js 中介軟體的洋蔥模型

var express = require('express')

console.log('a middleware1 開始')
next()
console.log('b middleware1 結束')
})  console.log('c middleware2 開始')
next()
console.log('d middleware2 結束')
})  console.log('e middleware3 開始')
next()
console.log('f middleware3 結束')
})  res.send('ok')
console.log('*****== g *****==')
})if (module.parent)  else

a middleware1 開始

c middleware2 開始

e middleware3 開始

*****== g *****==

f middleware3 結束

d middleware2 結束

b middleware1 結束

--------------------------------------

|            middleware1              |
|    ----------------------------     |
|    |       middleware2         |    |
|    |    -------------------    |    |
|    |    |  middleware3    |    |    |
|    |    |                 |    |    |
next next next  ———————————   |    |    |
請求 ——————————————————> |  handler  | — 收尾工作->|
響應 <—————————————————  |     g     |  |    |    |
| a  | c  | e ——————————— f |  d |  b |
|    |    |                 |    |    |
|    |    -------------------    |    |
|    ----------------------------     |
--------------------------------------
順序 a -> c -> e -> g -> f -> d -> b
\---------------/   \----------/
↓                ↓
請求響應完畢        收尾工作

a middleware1 開始

c middleware2 開始

e middleware3 開始

*****== g *****==

f middleware3 結束

d middleware2 結束

b middleware1 結束

--------------------------------------

|            middleware1              |
|    ----------------------------     |
|    |       middleware2         |    |
|    |    -------------------    |    |
|    |    |  middleware3    |    |    |
|    |    |                 |    |    |
next next next  ———————————   |    |    |
dispatch  —————————————> |  reducer  | — 收尾工作->|
nextstate <————————————— |     g     |  |    |    |
| a  | c  | e ——————————— f |  d |  b |
|    |    |                 |    |    |
|    |    -------------------    |    |
|    ----------------------------     |
--------------------------------------
順序 a -> c -> e -> g -> f -> d -> b
\---------------/   \----------/
↓                ↓
更新 state 完畢      收尾工作

const koa = require('koa');

console.log('a middleware1 開始')
await next();
console.log('b middleware1 結束')
});  console.log('c middleware2 開始')
await next();
console.log('d middleware2 結束')
});  console.log('e middleware3 開始')
await next();
console.log('f middleware3 結束')
});  console.log('*****== g *****==')
});

a middleware1 開始

c middleware2 開始

e middleware3 開始

*****== g *****==

f middleware3 結束

d middleware2 結束

b middleware1 結束

redux 與 express、koa 的中介軟體執行流程一致

koa中介軟體梳理（洋蔥模型）

中介軟體概念 koa是乙個精簡的node框架，它主要做了以下事情 基於node原生req和res為request和response物件賦能，並基於它們封裝成乙個context物件。基於async await generator 的中介軟體洋蔥模型機制。koa1和koa2在原始碼上的區別主要是於對非同...

Koa中介軟體機制的洋蔥圈模型

const koa require koa console.log 1 await next console.log 6 console.log 2 await next console.log 5 console.log 3 ctx.body hello world console.log 4 c...

2 Koa中介軟體與洋蔥模型

1.async await 為了更好的理解aysnc await，我們先請求兩個介面 1.請求github中的使用者介面 請求github使用者介面 fetch then res res.json then json console.log json 2.請求github中的使用者介面後，請求特定使...