使用Express快速搭建前端項目架構
Express是基于Node.js的前端Web開發架構,使用其可以簡潔快速的建立健壯友好的API服務。在前端或移動端的開發過程中,可以借助Express的這項功能模拟API資料,友善開發調試。
Express是基于Node.js平台的,是以在安裝Express之前,需要先安裝Node.js。使用如下指令來檢查系統中所安裝的node版本:
node -v
複制
如果系統中沒有安裝Node.js,可以在如下網站進行下載下傳安裝:
https://nodejs.org/en/。
建立一個測試工程目錄,用于存放Express項目架構,首先在終端,使用如下指令進行Express的全局安裝:
npm install express-generator -g
複制
需要注意,很多時候國内網絡使用npm的時候會非常慢,可以通過如下指令來修改倉庫源。
npm install -g cnpm --registry=https://registry.npm.taobao.org
複制
之後使用cnpm來進行包的安裝:
cnpm install express-generator -g
複制
安裝好Express後,在建立的檔案夾目錄下,執行Express的初始化:
express
複制
如果檔案夾不為空,會提示是否繼續操作,輸入yes後回車即可。
初始化完成後的Express項目結構如下:
其中會預設建立一個package.json檔案,其中會添加許多依賴包,在項目目錄中執行如下指令來安裝這些依賴:
npm install
複制
依賴安裝完成後,工程中會多一個node_modules的檔案夾,裡面是所有依賴封包件。
再來看Express模闆中的檔案,其中bin檔案夾下面的www.js檔案是服務的啟動檔案,其中啟動了HTTP的服務,預設端口為3000。routes檔案夾下面的檔案用于配置api路由,預設有index.js與users.js兩個。app.js檔案中對api進行了初始化與配置。可以在users.js中添加一個測試api如下:
var express = require('express');
var router = express.Router();
/* 這個是預設生成的. */
router.get('/', function(req, res, next) {
res.send('respond with a resource');
});
/* 添加一個測試api*/
router.get('/testAPi',function(rep,res,next){
res.send('{name:jaki,age:24}');
});
module.exports = router;
複制
在項目目錄下通過終端執行如下指令來将服務開啟:
node bin/www
複制
如果服務啟動成功,在浏覽器輸入http://127.0.0.1:3000/users/testAPi會傳回我們send()方法傳遞的字元串。
小提示:MacOS系統在服務進行中,可以使用control+c來釋放端口的監聽,如果不小心使用control+z或者關閉了終端,會導緻所監聽端口的無法釋放,下次如果再次啟動node服務,會報Port 3000 is already in use的錯誤,可以使用如下方法來進行所監聽端口的釋放:
首先使用如下指令檢視所有監聽某個端口的服務,例如3000端口:
sudo lsof -i:3000
複制
之後終端會将服務名與進行id告訴我們,如下:
COMMAND PID USER FD TYPE DEVICE SIZE/OFF NODE NAME
node 829 vip 13u IPv6 0x9c3536500e84e203 0t0 TCP *:hbci (LISTEN)
複制
使用如下指令來殺死對應程序即可:
sudo kill -9 829
複制