在我看來,前端框架的中間件的思想來源於傳統后端的切面編程(AOP)思想,比如我們常見的身份校驗(JWT)。
axios的攔截器也是基於這種程序設計模式的。
在koa中,實際上是由一個數組對象來保存所有的中間件的,原理解析可以參考這篇博客:https://www.cnblogs.com/dashnowords/p/10439605.html。
除此之外,還得益於js的異步事件隊列,關於異步事件隊列,可參考這篇博客:https://www.cnblogs.com/eco-just/p/10389933.html。
中間件的事件處理可以是同步事件,也可以是異步事件,但是得注意了異步事件總是會等同步事件全部執行完成之后才會去執行(后面有個與之相關的中間件)。
一、模塊化路由中間件
home.js
一個home路由下,有兩個請求地址,一個啥都不寫,另一個寫了點數據,並將這個koa-router當作模塊暴露出去
index.js
這也是一個路由,路由包路由,並添加了一個父路徑--“/home”.並且將這個路由暴露出去
最終供我們app使用
此時,我們訪問127.0.0.1:1996/home/nav
127.0.0.1:1996/home/
針對這種情況,我們需要對接口的數據返回做一個統一的處理。
二、自定義格式化返回數據中間件
這里為什么在next()后面處理數據?應為next()函數返回一個Promise對象,then函數里面的回調是異步的,這就能保證在路由中間件里的業務邏輯一定先於此處的數據處理。
有一點需要注意的是,koa的ctx.status默認值是404,所以我們要在接口內把業務邏輯寫完后修改ctx.status的值,這樣,上述中間件就能對不同業務狀態返回不同的格式化數據給前台。
有了該中間件之后:
localhost:1996/home
localhost:1996/home/nav
另外,如果你覺得根據業務邏輯來修改ctx.status的值很麻煩的話,可以適當封裝工具類來達到目的,例如下面這個工具類: