關(guān)于express路由的一些疑問

//users.js
var express = require('express');
var router = express.Router();

//路由定義
router.get('/article', function(req, res) {
    res.render('index', {titile: 'express'});
};
//模塊導(dǎo)出
module.exports = router;


//app.js
var user = require(./routes/users');
app.use('/users', user);

請問express是如何做到路由匹配的，在看express源碼時候看到routes是個handle(req, res, next)方法，_route->stack->layer, 而get等方法是_route->stack->layer->route->stack->layer,
第一個問題是想問調(diào)用好中間件方法之后/article，是如何做到匹配的？第二個問題是因為listen監(jiān)聽的是app()里面的handle函數(shù)，如何做到路由的實時監(jiān)聽，比如網(wǎng)頁上寫了一個地址,如何觸發(fā)的，

回答

編輯回答

囍槑

express為了做到靈活、代碼精簡，內(nèi)部的代碼進(jìn)行了大量的抽象+復(fù)用，尤其是在路由這塊。樓主看了心生疑惑是正常的，這塊的代碼的確挺糟糕的。

樓主的問題足夠?qū)懸黄荛L的文章，編寫回答將近半個小時候我覺得放棄有條理的回答，直奔主題。

// 樓主的代碼，稍微精簡下
var router = express.Router();
router.get('/article', fn);

// app的_router 屬性，其實也是 express.Router()
app._router = new Router();
app._router.use('/user', router); 

// 上面的代碼導(dǎo)致下面的邏輯
app._router.stack.push(new Layer({
  path: '/user',
  handler: fn,
  route: undefined // 這里！非常關(guān)鍵
));

// 請求到來時，假設(shè) path 是 '/user'
app.handle() -> app._router.handle();

// 然后，遍歷 app._router.stack 數(shù)組，看有沒有那個 stack（里面是Layer實例）的path屬性符合要求
// 如果找到符合要求的，也就是樓主的 router

我們看下下面代碼發(fā)生了什么

router.get('/article', fn);

在內(nèi)部，往 stack 里又push了 Layer 實例。

var layer = new Layer({
  path: '/article',
  handler: fn
};
// 這里非常關(guān)鍵！這個實際存放路由，也就是 用戶訪問 /user/article 時的回調(diào)方法
layer.route = new Route();
router.stack.push(layer);

為什么樓主會覺得疑惑

前面說了，express這塊的代碼本身挺糟糕的，比如存在如下用法，并且內(nèi)部都是往 router.stack 里新增一個 Layer實例

routerA.use(path, routerB); // 第一種 
routerA.get(path, fn); // 第二種

那么，如何區(qū)分是子路由，還是實際的路由

// 子路由，對應(yīng)第一種
layer.route = undefined;
router.stack.push(layer);

// 實際路由，對應(yīng)第二種
layer.route = new Route();
router.stack.push(layer);

如何匹配的

比如樓主訪問了 /user/articles，那么express內(nèi)部（跳過一些瑣碎的分支判斷）

查看有沒有匹配 /user 的子路由，發(fā)現(xiàn)有，就是樓主的 router。實際動作是搜索 app._router.stack
查看有沒有匹配 /articles 的實際路由，發(fā)現(xiàn)有。實際動作是搜索 router.stack[i].layer，并且找到對應(yīng)的處理方法 router.stack[i].layer.route[i].stack