使用NodeJS的Express4.X框架寫WEB應用
Express 3.0 與 4.0的特性改變
Express 3.0 | Express 4.0 |
---|---|
bodyParser | body-parser |
compress | compression |
cookieSession | cookie-session |
logger | morgan |
cookieParser | cookie-parser |
session | express-session |
favicon | static-favicon |
response-time | response-time |
error-handler | errorhandler |
method-override | method-override |
timeout | connect-timeout |
vhost | vhost |
csrf | csurf |
安裝Express, 並建立一個WEB專案
首先安裝好NodeJS。
安裝Express 4:
> npm install express -gd
其中選項-g表示全域性安裝,目標模組將會被安裝到NODE_PATH的lib裡面node_modules資料夾中,全域性使用。-d選項表示一併安裝依賴模組。沒有-g選項的話會在當前目錄(通常是專案目錄)建立一個node_modules目錄。
安裝成功後,命令列會提示 npm info ok
express 4.0之後將命令工具分出來了(建立一個APP的工具),因此還需安裝express-generator。沒它建立不了應用程式。
> npm install -g express-generator #全域性安裝-g
> express -V # 檢查express的版本
安裝好以後,可以使用express的命令,建立專案了。
> express -e firstweb # 在當前目錄下會建立firstweb目錄
> cd firstweb # 進入專案目錄
> npm install # 在專案目錄中,下載依賴庫來構建專案。
啟動專案:
> npm start
Express4中引入了著名的debug模組,所以debug模式更方便的研究Node中的模組,其使用方法:https://www.npmjs.org/package/debug
使用DEBUG方式啟動專案:
> DEBUG=firstweb ./bin/www # 用文字編輯器看看這個www檔案的內容!
Express專案的目錄結構
- bin, 存放啟動專案的指令碼檔案
- node_modules, 存放所有的專案依賴庫
- public,靜態檔案(css,js,img)
- routes,路由檔案(MVC中的C,controller)
- views,頁面檔案(Ejs模板)
- package.json,專案依賴配置及開發者資訊
- app.js,應用核心配置檔案,程式啟動檔案
package.json檔案
package.json用來宣告專案基本資訊和使用的模組,這樣在新的環境部署時,只要在package.json檔案所在的目錄執行npm install命令即可安裝所需要的模組了。
{
"name": "first",
"version": "0.0.0",
"private": true,
"scripts": {
"start": "node ./bin/www"
},
"dependencies": {
"body-parser": "~1.15.1",
"cookie-parser": "~1.4.3",
"debug": "~2.2.0",
"ejs": "~2.4.1",
"express": "~4.13.4",
"morgan": "~1.7.0",
"serve-favicon": "~2.3.0"
}
}
裡面的scripts屬性,是用於定義操作命令的,可以非常方便的增加啟動命令,比如預設的start,用npm start代表執行node ./bin/www命令。
編寫業務處理程式
比如,編寫一個檢視文章的功能:新增一個article的路由控制代碼。
在routes目錄下面新建一個article.js檔案,來具體實現業務羅輯。
url為http://localhost:3000/article/id/xxxx
每個文章有一個id,一串數字,返回json資料。
article.js檔案內容如下:
var express = require('express');
var router = express.Router();
/* GET data listing. */
router.get('/', function(req, res, next) {
res.send('respond with a article');
});
router.get(/^\/id\/(\d+)$/, function(req, res, next) {
var article_id = req.params[0];
res.send("article id is : " + article_id);
});
module.exports = router;
以上程式碼完成了路由控制代碼,之後,將它掛在路由路徑上:
在app.js新增以下程式碼
var article = require('./routes/article.js');
app.use('/article', article);
獨立編寫程式:不使用Express工具生成專案結構
以上的專案是用express-generator工具生成的。
也可以不用他,自己從零開始寫。
程式和上面一樣,隨意放到任何目錄都可以,但是要注意一點,需要設定NODE_PATH這個環境變數,並指向安裝的擴充套件包的根目錄。比如,WINDOWS下預設是:C:\Users\fd\AppData\Roaming\npm\node_modules
如果不指定這個目錄,那麼就需要在專案目錄下再執行一次本地安裝:npm install express
否則,會報錯:Cannot find module ‘express’