之前我們在安裝完Node.js後直接寫了個HelloWorld網站，這次呢，我們使用Node.js的Web框架Express來重寫一下HelloWorld，看看有什麼不同。同時我們還會重寫之前的檔案伺服器，功能更完善而程式碼更簡潔。

安裝 express

為了重寫我們的HelloWorld，我們需要安裝Express模組。Express基於Node.js的一個Web框架，官方網站在這裡：http://expressjs.com/。官網對Express的介紹是：

Fast, unopinionated, minimalist web framework for Node.js

要安裝express模組，直接使用npm命令即可。在命令列環境下不帶引數執行npm命令，即可看到npm的幫助資訊。安裝某個Node.js模組，使用install子命令。“npm install xxx”會將xxx模組安裝到當前路徑下，“npm install -g xxx”則將xxx模組安裝到當前使用者的全域性位置。使用“npm helo install”可以檢視install子命令的細節。要解除安裝一個模組，使用“npm uninstall xxx”，假如你是全域性安裝，則使用“npm uninstall -g xxx”。

在使用npm安裝某個模組時，它會自動解決依賴。

在命令列環境執行下面的命令來安裝express：

注意，我指定了使用淘寶的映象，快一些。

特別說明一下：

很快啦，你就可以看到下面的介面（注意我們安裝的Express版本是4.13.3）：

好啦，Express安裝完畢。

需要說明的是，使用-g命令全域性安裝Node.js模組後，需要設定環境變數NODE_PATH，否則在我們使用node命令啟動某個應用時可能會報找不到指定的模組這種錯誤。在我的Windows 7環境下，全域性安裝時npm模組的位置為“C:\Users\Administrator\AppData\Roaming\npm\node_modules”（看上面的圖可知）。至於環境變數的設定，計算機->高階系統設定->高階->環境變數，新增一個名為NODE_PATH的環境變數, 將其值設定為全域性模組的根目錄。設定完成後，重新進入命令列環境即可生效。

提一下，如果要在NODE_PATH中新增多個模組路徑，只需用“;”分隔開即可。具體含義，命令列下執行“node -h”可檢視幫助。

HelloWorld

程式碼就是這麼簡單：

// 引入 express 模組
var express = require('express');

// 建立 express 例項
var app = express();

// 響應HTTP的GET方法
app.get('/', function (req, res) {
  res.send('Hello World!');
});

// 監聽到8000埠
app.listen(8000, function () {
  console.log('Hello World is listening at port 8000');
});
 

儲存為HelloExpress.js，然後在Node.js的命令列環境下執行“node HelloExpress.js”命令，網站就執行起來了。瀏覽器訪問一下，和上次的示例一樣一樣的。

使用Express有什麼不同

沒有使用Express的程式碼是醬紫的：

// 引入http模組
var http = require("http"); 

// 建立server，指定處理客戶端請求的函式
http.createServer(
    function(request, response) { 
        response.writeHead(200, {"Content-Type": "text/plain"}); 
        response.write("Hello World!"); 
        response.end(); 
    }
).listen(8000); 

console.log("Hello World is listening at port 8000");

上面的程式碼直接使用Node.js帶的http模組來建立HTTP伺服器，指定了一個處理請求的函式。實際應用時，我們需要在這個函式內區分不同的HTTP請求，比如GET、HEAD、POST等。而Express版本的HelloWorld則有所不同，它可以針對每一個路徑和HTTP請求指定響應函式，比如Express版本的HelloWorld例項，只有你在瀏覽器中輸入“http://localhost:8000”時它才會返回“HelloWorld”，如果你在瀏覽器中輸入“http://localhost:8000/abc”，你就看到一條錯誤資訊（會收到404狀態碼，express自動幫你處理了）。這裡邊有一個URL路由（URL routing）的概念。假如把程式碼修改成下面的樣子：

app.get('*', function (req, res) {
  res.send('Hello World!');
});

效果就和使用http模組的版本類似了。因為我使用了“*”作為萬用字元，可以匹配任何路徑。Express的get方法原型如下：

app.METHOD(path, callback [, callback …])

使用express建立HelloExpress

express模組有一個命令列工具express，可以用來生成基於express模組的應用結構（網站結構）。

express 4.x之後，express命令被獨立出來放在了express-generator模組中。我們用下面的命令全域性安裝express這個命令列工具：

npm install -g express-generator

安裝完成後，在命令列環境下執行“express -V”，可以看到express的版本是4.13.1。

好了，現在我們使用express命令來建立一個預設的網站。

在命令列環境下導航到myprojects這個目錄下，執行下面的命令：

express HelloExpress

然後可以看到：

仔細看上面的圖哦，它告訴了我們三類非常重要的資訊：

• express命令建立的網站的目錄結構以及建立的檔案
• 安裝依賴（進入到HelloExpress下，執行npm install）
• 使用npm start啟動網站（express 4.x後）

好啦，我們先安裝依賴。這裡要先提一下HelloExpress目錄下的package.json檔案，其內容如下：

{
  "name": "HelloExpress",
  "version": "0.0.0",
  "private": true,
  "scripts": {
    "start": "node ./bin/www"
  },
  "dependencies": {
    "body-parser": "~1.13.2",
    "cookie-parser": "~1.3.5",
    "debug": "~2.2.0",
    "express": "~4.13.1",
    "jade": "~1.11.0",
    "morgan": "~1.6.1",
    "serve-favicon": "~2.3.0"
  }
}

這個檔案定義了一個Node.js應用的基本資訊，我們這次注意的是 dependencies ，它定義了應用依賴的模組。

在HelloExpress下執行“npm install”命令，npm會自動找到package.json，分析它，安裝所有依賴模組。這要花費一些時間，休息一下，去喝杯茶。

看看，下面是安裝結果：

G:\nodejs\myprojects\HelloExpress>npm install
[email protected] node_modules\debug
└── [email protected]

[email protected] node_modules\cookie-parser
├── [email protected]
└── [email protected]

[email protected] node_modules\serve-favicon
├── [email protected]
├── [email protected]
├── [email protected]
└── [email protected]

[email protected] node_modules\morgan
├── [email protected]
├── [email protected]
├── [email protected]
└── [email protected] ([email protected])

[email protected] node_modules\body-parser
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected] ([email protected])
├── [email protected]
├── [email protected]
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected])
└── [email protected] ([email protected], [email protected])

[email protected] node_modules\express
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected] ([email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected], [email protected], [email protected], http-er
[email protected])
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected], [email protected])
└── [email protected] ([email protected], [email protected])

[email protected] node_modules\jade
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected] ([email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected], [email protected], [email protected]
1.34, ya[email protected])
├── [email protected] ([email protected], [email protected])
├── [email protected] ([email protected], [email protected], [email protected])
└── [email protected] ([email protected], [email protected])

G:\nodejs\myprojects\HelloExpress>

有興趣的可以研究下各個依賴模組的資訊，現在我們啟動網站了。執行 npm start 命令，很快就可以看到下面的圖：

看到上圖，說明網站已正常執行。你可以在瀏覽器裡訪問http://localhost:3000，然後就可以看到這個頁面：

OK，大功告成。

這個由express generator建立的HelloExpress和我們基於express手動寫的HelloWorld又有一些不同，比如你在瀏覽器位址列裡輸入http://localhost:3000/abc，就會看到一個預設的404頁面，顯示了具體的錯誤資訊。而我們的HelloWorld，顯示的則是“Cannot GET /abc”這個文字串。這就是模板的便利之處，有很多預設處理，可以為我們省很多麻煩。

Express版本的檔案伺服器

express是在Node.js的http的基礎上實現的，相比http模組，封裝更多更適用於web伺服器場景的功能。之前我們在Node.js開發入門——HTTP檔案伺服器裡使用http模組實現了一個簡單的檔案伺服器。那個版本的檔案伺服器還有一個缺陷，就是沒有根據檔名設定HTTP的Content-Type頭部。如果我們使用express來實現檔案伺服器（用到了Request物件的sendFile方法），哈哈，就只有幾行程式碼，還解決了Content-Type問題！

程式碼如下：

var express = require('express');
var app = express();

app.get('*', function(req, res){
    res.sendFile(req.path, {root: __dirname+'/', dotfiles: 'deny'});
});

app.listen(3000);

是不是超級簡單？

其它文章：