nodejs+express搭建小程序后台服務器


本文使用node.js和express來為小程序搭建服務器。node.js簡單說是運行在服務端的javascript;而express是node.js的一個Web應用框架,使用express可以非常簡單快捷地搭建起網站。


0、背景

官方要求小程序的包最多不能超過2M,減小小程序包大小最有效的方法就是將本地圖片上傳至服務器。
本文搭建服務器,以小程序從后台獲取圖片為例,實現小程序與后台的通信。
小程序采用這篇教程mpvue從一無所有開始仿大眾點評小程序中的demo(但圖片均移動到了public/images),
可以從這里下載項目文件


1、開發准備

要搭建小程序后台有兩種選擇
(1)購買雲服務器。詳細可見這里
(或直接使用雲開發,雲開發是小程序在2018.9新增的功能,詳細可見這里
(2)使用代理服務器,可實現搭建本地服務器,進行本地開發調試。
例如使用charels進行反代理,教程可見:mac版win版

注意映射的線上域名和服務器端口要與實際設置的一致。比如這里采用的線上域名為https://wx.test.cn,搭建的服務器端口為localhost:3000


2、安裝Express

按以上兩種方法搭建好服務器后,在服務器上安裝好Node.js,打開命令行:

npm install -g express@3
npm install express-generator --save -g

選擇一個工作目錄,打開命令行運行:

mkdir server 
cd server
express  -e 
npm install

安裝完成后輸入:

npm start

此時便用Express搭建了一個服務器並監聽端口3000。可以用瀏覽器打開localhost:3000或https://wx.test.cn/進行訪問。


3、路由控制

初始化項目后,一般工程結構如下

server
├── node_modules
├── public    
├── routes
├── view
├── app.js
└── package.json

我們這里只要關心app.jspublic

  • app.js是工程的入口文件,待會我們在這里編寫路由控制;
  • public是存放各種資源的文件夾,這里可以保存image、css、javascript等文件


    (1)首先我們將從這里下載項目文件中的public文件夾,與原public文件夾合並;
    (2)然后打開app.js,在app.use('/users', usersRouter);后添加
app.get('/public/images/*', function (req, res) {
    res.sendfile( __dirname + "/" + req.url );
    console.log("Request for " + req.url + " received.");
  })

這段命令的意思是當客戶端用get命令請求/public/images/下的資源時,服務器將對應的圖片資源傳送過去。
(3)中斷原先的進程,再次運行:

npm start

我們可以在瀏覽器上打開網址https://wx.test.cn/public/images/my/user.png,測試是否可以請求到圖片。

將小程序中原先指向本地圖片的鏈接均改為指向服務器的圖片。

此時使用微信開發者工具再次打開小程序,即可看到完整的頁面。同時也可以進行預覽發布


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM