Node 之 Express 學習筆記 第二篇 Express 4x 骨架詳解
阿新 • • 發佈：2018-12-27
https://blog.csdn.net/tdcqfyl/article/details/52328930
Node 之 Express 學習筆記 第二篇 Express 4x 骨架詳解
週末，沒事就來公司加班繼續研究一下Express ，這也許也是單身狗的生活吧。
1、目錄結構：
- bin, 存放啟動專案的指令碼檔案
- node_modules, 專案所有依賴的庫，以及存放 package.json 中安裝的模組，當你在 package.json 新增依賴的模組並安裝後，存放在這個資料夾下
- public，靜態檔案(css,js,img)
- routes，路由檔案(MVC中的C,controller)
- views，頁面檔案(jade模板)，後期打算換成 Ejs 模板搞搞
- package.json，儲存著工程的資訊及模組依賴
- app.js，應用核心配置檔案（入口檔案）
2、Package.json
package.json用於專案依賴配置及開發者資訊，scripts屬性是用於定義操作命令的，可以非常方便的增加啟動命令，比如預設的start，用npm start代表執行node ./bin/www命令。當在 dependencies 中新增依賴的模組時，執行 npm install ，npm 會檢查當前目錄下的 package.json，並自動安裝所有指定的模組。
1 {
2 "name": "myapp",
3 "version": "0.0.0",
4 "private": true,
5 "scripts": {
6 "start": "node ./bin/www"
7 },
8 "dependencies": {
9 "body-parser": "~1.13.2",
10 "cookie-parser": "~1.3.5",
11 "debug": "~2.2.0",
12 "express": "~4.13.1",
13 "jade": "~1.11.0",
14 "morgan": "~1.6.1",
15 "serve-favicon": "~2.3.0"
16 }
17 }
3、app.js
核心檔案，也是專案入口檔案。
1 var express = require('express');
2 //用於處理目錄的物件，提高開發效率
3 var path = require('path');
4 //使用者載入圖示
5 var favicon = require('serve-favicon');
6 //在控制檯中，顯示req請求的資訊
7 var logger = require('morgan');
8 //載入cookie模組，用於獲取web瀏覽器傳送的cookie中的內容
9 var cookieParser = require('cookie-parser');
10 //解析客戶端請求的body中的內容,內部使用JSON編碼處理,url編碼處理以及對於檔案的上傳處理
11 var bodyParser = require('body-parser');
12
13 var routes = require('./routes/index');
14 var users = require('./routes/users');
15 var demo = require('./routes/demo');
16
17 var app = express(); //生成一個express例項 app
18
19
20 //設定VIEWS資料夾，__dirname是node.js裡面的全域性變數。取得執行js所在的路徑
21 app.set('views', path.join(__dirname, 'views'));
22 // 檢視引擎設定
23 app.set('view engine', 'jade');
24
25
26 // 定義icon圖示，引數為圖示的路徑。如果不指明，則用預設的express圖示
27 //app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));
28
29 //載入日誌中介軟體，定義日誌和輸出級別
30 app.use(logger('dev'));
31
32 //載入解析json的中介軟體,接受json請求
33 app.use(bodyParser.json());
34
35 //載入解析urlencoded請求體的中介軟體
36 app.use(bodyParser.urlencoded({ extended: false }));
37
38 //載入解析cookie的中介軟體
39 app.use(cookieParser());
40
41 //靜態檔案目錄設定,設定public資料夾為存放靜態檔案的目錄
42 app.use(express.static(path.join(__dirname, 'public')));
43 //app.use(express.static(path.join(__dirname, 'html')));
44
45 //路由控制器
46 app.use('/', routes);
47 app.use('/users', users);
48 app.use('/demo',demo);
49
50 // 捕獲404錯誤，並轉發到錯誤處理器
51 app.use(function(req, res, next) {
52 var err = new Error('Not Found');
53 err.status = 404;
54 next(err);
55 });
56
57 // error handlers
58
59 // 開發環境下的500錯誤處理器，將錯誤資訊渲染error模版並顯示到瀏覽器中
60 if (app.get('env') === 'development') {
61 app.use(function(err, req, res, next) {
62 res.status(err.status || 500);
63 res.render('error', {
64 message: err.message,
65 error: err
66 });
67 });
68 }
69
70 // 生產環境下的錯誤處理器，將錯誤資訊渲染error模版並顯示到瀏覽器中
71 // no stacktraces leaked to user
72 app.use(function(err, req, res, next) {
73 res.status(err.status || 500);
74 res.render('error', {
75 message: err.message,
76 error: {}
77 });
78 });
79
80 //匯出app例項供其他模組呼叫
81 module.exports = app;
4、Bin/www檔案
www檔案內容：這裡擁有著http伺服器的基本配置，www檔案也是一個node的指令碼，用於分離配置和啟動程式只用。程式碼如下：
1 #!/usr/bin/env node //表明是 node 可執行檔案
2
3 /**
4 * Module dependencies.
5 */
6 //依賴載入
7 //引入我們上面匯出的app例項
8 var app = require('../app');
9
10 //引入debug模組，列印除錯日誌
11 var debug = require('debug')('myapp:server');
12 var http = require('http');
13
14 /**
15 * Get port from environment and store in Express.
16 */
17 //定義啟動埠
18 var port = normalizePort(process.env.PORT || '3000');
19 app.set('port', port);
20
21 /**
22 * Create HTTP server.
23 */
24
25 var server = http.createServer(app);
26
27 /**
28 * Listen on provided port, on all network interfaces.
29 */
30
31 server.listen(port);
32 server.on('error', onError);
33 server.on('listening', onListening);
34
35 /**
36 * Normalize a port into a number, string, or false.
37 */
38 //埠標準化函式
39 function normalizePort(val) {
40 var port = parseInt(val, 10);
41
42 if (isNaN(port)) {
43 // named pipe
44 return val;
45 }
46
47 if (port >= 0) {
48 // port number
49 return port;
50 }
51
52 return false;
53 }
54
55 /**
56 * Event listener for HTTP server "error" event.
57 */
58 //HTTP異常事件處理函式
59 function onError(error) {
60 if (error.syscall !== 'listen') {
61 throw error;
62 }
63
64 var bind = typeof port === 'string'
65 ? 'Pipe ' + port
66 : 'Port ' + port;
67
68 // handle specific listen errors with friendly messages
69 switch (error.code) {
70 case 'EACCES':
71 console.error(bind + ' requires elevated privileges');
72 process.exit(1);
73 break;
74 case 'EADDRINUSE':
75 console.error(bind + ' is already in use');
76 process.exit(1);
77 break;
78 default:
79 throw error;
80 }
81 }
82
83 /**
84 * Event listener for HTTP server "listening" event.
85 */
86 //事件繫結函式
87 function onListening() {
88 var addr = server.address();
89 var bind = typeof addr === 'string'
90 ? 'pipe ' + addr
91 : 'port ' + addr.port;
92 debug('Listening on ' + bind);
93 }
5、routes
生成一個路由例項用來捕獲訪問主頁的GET請求，匯出這個路由並在app.js中通過app.use('/', routes); 載入。這樣，當訪問主頁時，就會呼叫res.render('index', { title: 'Express' });渲染views/index.jade模版並顯示到瀏覽器中。
1 var express = require('express');
2 var router = express.Router();
3
4 /* GET home page. */
5 router.get('/', function(req, res, next) {
6 res.render('index', { title: 'Express' });
7 });
8
9 module.exports = router;
關於路由，路由中有兩個常用功能：
- app.route()函式，建立可連結的途徑處理程式的路由路徑。
- express.Router類，建立模組化安裝路徑的處理程式。
app.route方法會返回一個Route例項，它可以繼續使用所有的HTTP方法，包括get,post,all,put,delete,head等。
1 app.route('/users')
2 .get(function(req, res, next) {})
3 .post(function(req, res, next) {})
express.Router類，則可以幫助我們更好的組織程式碼結構。在app.js檔案中，定義了app.use(‘/’, routes); routes是指向了routes目錄下的index.js檔案，./routes/index.js檔案中，express.Router被定義使用， 路徑/*處理都會由routes/index.js檔案裡的Router來處理。如果我們要管理不同的路徑，那麼可以直接配置為多個不同的Router。
1 app.use('/user', require('./routes/user').user);
2 app.use('/admin', require('./routes/admin').admin);
3 app.use('/', require('./routes'));
Express生成的骨架大致內容都差不多瞭解了。下一篇寫一個小demo，連實踐一下。