後端框架與API 開發(五) - Middleware-設定與管理

更新於 發佈於 閱讀時間約 4 分鐘

※ 什麼是Middleware (中介層)?

Middleware 一般翻譯作「中間件」或是「中介軟體」,其實 Express 應用程式就是由一連串的 middleware 串連而成:

  • 從 request 進來到 response 回去會經過一系列的流程。
  • 這個流程會按照路由清單由上而下執行。
  • 可以用 app.use 來對所有的 request 進行前置處理;也可以用 app.get 或 app.post 等方法來篩選用特定 HTTP method 發送的請求。
  • 只要是會發生在這個 request-response 流程裡的程序,都叫做 middleware。
raw-image

※ Middleware (中介層)舉例說明:

你可以把 middleware 的運作想像成一個加工生產線:

raw-image

生產線上的員工協力把輸送進來的「原料」(request) 一步步處理加工,完成最後的「製成品」(response)。當一個 middleware 把事情做完之後,它就會呼叫 next() 把請求交給下一個 middleware 來處理。

raw-image

所以每一個 middleware function 都會帶三個參數:reqres、與 next,例如:

app.use((req, res, next) => {
// do something
return next()
})

※ Express Middleware 分類:

  • 應用程式層級:

綁定到 app 物件的 middleware,被稱為應用程式層級的 middleware。它會在所有路由和路由器層級的 middleware 中運行。

這種 middleware 可以被設定去處理每一個應用程式接收到的請求內容。例如,我們可以使用 app.use() 函數來指定一個或多個特定的 middleware 函數,這些函數將在每次請求時被調用。

同樣地,我們也可以使用 app.get() 或 app.post() 來指定只在特定 HTTP 方法的請求時被調用的 middleware。簡單來說,應用程式層級的 middleware 就像是一個全局過濾器,它會在每次請求時先運行,然後根據需要進行處理或轉發請求。這讓我們可以在請求到達路由之前進行一些預處理,例如驗證、日誌記錄或其他任何我們需要的操作。

  • 路由器層級:

使用 路由器層級的 middleware 時,我們會將它綁定到 express.Router() 的實例。它的工作方式與應用程式層級的 middleware 相同,但它只在該路由器的路由中運行。路由器層級的 middleware 就像是一個局部過濾器,它只對綁定到同一個 Router() 實例的路由有效。這意味著,如果你有一組相關的路由,你可以使用一個 Router() 實例來管理它們,並且可以使用路由器層級的 middleware 來對這些路由進行一些共同的預處理,例如驗證或日誌記錄。

  • 錯誤處理:

錯誤處理 middleware主要工作是處理在其他 middleware 或路由處理函數中產生的錯誤。它的特點是有四個參數:errreqres 和 next,而不是通常的三個參數。當一個 middleware 函數呼叫了 next(err) 時,Express 會跳過剩下的所有非錯誤處理 middleware,並尋找下一個有四個參數的 middleware 函數,也就是錯誤處理 middleware。

然後,Express 會將錯誤物件 err 傳遞給這個錯誤處理 middleware,讓它來處理這個錯誤。這種機制讓我們可以集中處理錯誤,並提供友好的錯誤訊息或進行錯誤修復。

  • 內建層級:

有一些內建的 middleware 函數,這些函數可以幫助我們處理一些常見的任務。其中一個最常用的內建 middleware 是 express.static。透過 express.static(‘public’) 可以讀取,由我們自行建立的靜態檔案,包含 JavaScript 、 CSS 檔案。

  • 第三方層級:

由第三方所撰寫的套件。我們可以透過 npm 下載並在我們的應用程式中使用這些套件。這些第三方 middleware 的最大好處是,它們可以幫助我們避免重複造輪子,讓我們可以直接引用他人的模組工具來解決我們的專案問題。例如,body-parser 是一個常用的第三方 middleware,它可以幫助我們解析 HTTP 請求的 body。另外,passport 是一個用於身份驗證的 middleware,而 morgan 是一個用於日誌記錄的 middleware。

全端網頁開發專業知識分享
留言0
查看全部
avatar-img
發表第一個留言支持創作者!
※ Params是什麼? 在網頁開發中,params代表的是參數(Parameters)。當你在路由(Route)中定義了一個或多個變數時,這些變數的值就會被存儲在 params 對象中。所以,params 就是用來存儲路由參數的地方,這些參數可以在處理請求時使用。 ※ Params的兩個功能:
※ 什麼是路由? 當我們說「路由」時,可能是在談論路由器(實體設備),也可能是在談論路由(選擇路徑的過程),或者是在談論路徑(資料封包的傳輸路徑)。 路由器 (Router):這是一種實體設備,負責將資料封包 (Packet) 從一個網路傳送到另一個網路。它的工作方式類似於交通指揮,確保資料封包
※ 什麼是 Helper? Helper 通常指的是樣板引擎裡的邏輯工具。當我們想做的事情超越內建功能時,就可以自訂 helper。 ※ Handlebar helper的用處 說明:Handlebars helper 是一種自定義函數,可以在 Handlebars 模板中執行邏輯操作。這些函
※ 用 faker 套件產生假資料步驟 安裝 faker套件:快速生成假資料(人名、地名、時間)。 npm install faker@5.5.3 引入 faker 套件: const faker = require('faker') 建立data資料夾來生成假資料。創建一個名為 gene
使用靜態檔案下載 Bootstrap 的原因主要有以下幾點: 客製化:當你下載了 Bootstrap 的靜態檔案,你可以根據自己的需求來修改這些檔案。例如,你可以改變預設的顏色、字型大小、間距等,使其更符合你的網站風格。這是直接使用 CDN 所無法做到的。 效能優化:如果你的網站只使用 Boot
※ 視圖模板 視圖模板(View Templates) 是在 MVC 架構中負責展示數據的 HTML 文件,包含模板語法,用於在渲染時插入實際數據。它們的主要目的是分離數據與展示邏輯,讓代碼更加模塊化和易於維護。 視圖模板設計和使用的核心理念,就是「重複的事情不要重複做、效益最大化、有效利用資源
※ Params是什麼? 在網頁開發中,params代表的是參數(Parameters)。當你在路由(Route)中定義了一個或多個變數時,這些變數的值就會被存儲在 params 對象中。所以,params 就是用來存儲路由參數的地方,這些參數可以在處理請求時使用。 ※ Params的兩個功能:
※ 什麼是路由? 當我們說「路由」時,可能是在談論路由器(實體設備),也可能是在談論路由(選擇路徑的過程),或者是在談論路徑(資料封包的傳輸路徑)。 路由器 (Router):這是一種實體設備,負責將資料封包 (Packet) 從一個網路傳送到另一個網路。它的工作方式類似於交通指揮,確保資料封包
※ 什麼是 Helper? Helper 通常指的是樣板引擎裡的邏輯工具。當我們想做的事情超越內建功能時,就可以自訂 helper。 ※ Handlebar helper的用處 說明:Handlebars helper 是一種自定義函數,可以在 Handlebars 模板中執行邏輯操作。這些函
※ 用 faker 套件產生假資料步驟 安裝 faker套件:快速生成假資料(人名、地名、時間)。 npm install faker@5.5.3 引入 faker 套件: const faker = require('faker') 建立data資料夾來生成假資料。創建一個名為 gene
使用靜態檔案下載 Bootstrap 的原因主要有以下幾點: 客製化:當你下載了 Bootstrap 的靜態檔案,你可以根據自己的需求來修改這些檔案。例如,你可以改變預設的顏色、字型大小、間距等,使其更符合你的網站風格。這是直接使用 CDN 所無法做到的。 效能優化:如果你的網站只使用 Boot
※ 視圖模板 視圖模板(View Templates) 是在 MVC 架構中負責展示數據的 HTML 文件,包含模板語法,用於在渲染時插入實際數據。它們的主要目的是分離數據與展示邏輯,讓代碼更加模塊化和易於維護。 視圖模板設計和使用的核心理念,就是「重複的事情不要重複做、效益最大化、有效利用資源
你可能也想看
Google News 追蹤
Thumbnail
大家好,我是woody,是一名料理創作者,非常努力地在嘗試將複雜的料理簡單化,讓大家也可以體驗到料理的樂趣而我也非常享受料理的過程,今天想跟大家聊聊,除了料理本身,料理創作背後的成本。
Thumbnail
哈囉~很久沒跟各位自我介紹一下了~ 大家好~我是爺恩 我是一名圖文插畫家,有追蹤我一段時間的應該有發現爺恩這個品牌經營了好像.....快五年了(汗)時間過得真快!隨著時間過去,創作這件事好像變得更忙碌了,也很開心跟很多厲害的創作者以及廠商互相合作幫忙,還有最重要的是大家的支持與陪伴🥹。  
Thumbnail
嘿,大家新年快樂~ 新年大家都在做什麼呢? 跨年夜的我趕工製作某個外包設計案,在工作告一段落時趕上倒數。 然後和兩個小孩過了一個忙亂的元旦。在深夜時刻,看到朋友傳來的解籤網站,興致勃勃熬夜體驗了一下,覺得非常好玩,或許有人玩過了,但還是想寫上來分享紀錄一下~
Thumbnail
軟體系統的發展歷程大多相似,首重解決基本需求、提供操作介面,進而提升安全性、擴充功能、優化操作。
Thumbnail
代理模式通過封裝原始對象來實現對該對象的控制和管理,同時不改變原始對象的行為或客戶端與該對象互動的方式,以此介入或增強對該對象的訪問和操作。
Thumbnail
Express 是一個流行的 web 框架,使用 JavsScript 實現,執行在 node 環境上,主要用來寫後端應用。
Thumbnail
當我們在撰寫一套系統的時候, 總是會提供一個介面讓使用者來觸發功能模組並回傳使用者所需的請求, 而傳統的安裝包模式總是太侷限, 需要個別主機獨立安裝, 相當繁瑣, 但隨著時代的演進與互聯網的崛起, 大部分的工作都可以藉由網頁端、裝置端來觸發, 而伺服端則是負責接收指令、運算與回傳結果, 雲端
Thumbnail
在開發前後端分離架構時,使用兩個不同網域所遇到跨域請求問題。特別是在POST請求時行為差異大,揭示了「簡單請求」與「預檢請求」的關鍵差異。簡單請求不需預檢,但application/json會觸發預檢請求,需透過特定設定解決。分享這篇文章希望幫助開發者有效處理跨域問題。
Thumbnail
當我剛開始接觸這個領域的時候,經常會看到有人在討論: 到底要做前端還是後端工程師呢?後端工程師賺的比前端工程師多?前端工程師轉後端工程師?那前端與後端到底是什麼呢? 這篇文章提供了前端與後端的基本概念並舉例來說明。同時也介紹了前端的三大要素以及後端的運作原理,對於想深入瞭解前後端的讀者會非常有幫助。
Thumbnail
先前幾篇筆記介紹了網路請求,瀏覽器儲存資料的方式,那麼實務上,前端最常需要發送網路請求的時候,就是透過呼叫 API,去向後端工程師發送/請求資料,所以今天來記錄什麼是 API吧!
Thumbnail
HTTP伺服器端 package main import ( "net/http" ) type Refer struct { handler http.Handler refer string } //實現中介軟體邏輯​ func (this *Refer) ServeHTTP(
Thumbnail
大家好,我是woody,是一名料理創作者,非常努力地在嘗試將複雜的料理簡單化,讓大家也可以體驗到料理的樂趣而我也非常享受料理的過程,今天想跟大家聊聊,除了料理本身,料理創作背後的成本。
Thumbnail
哈囉~很久沒跟各位自我介紹一下了~ 大家好~我是爺恩 我是一名圖文插畫家,有追蹤我一段時間的應該有發現爺恩這個品牌經營了好像.....快五年了(汗)時間過得真快!隨著時間過去,創作這件事好像變得更忙碌了,也很開心跟很多厲害的創作者以及廠商互相合作幫忙,還有最重要的是大家的支持與陪伴🥹。  
Thumbnail
嘿,大家新年快樂~ 新年大家都在做什麼呢? 跨年夜的我趕工製作某個外包設計案,在工作告一段落時趕上倒數。 然後和兩個小孩過了一個忙亂的元旦。在深夜時刻,看到朋友傳來的解籤網站,興致勃勃熬夜體驗了一下,覺得非常好玩,或許有人玩過了,但還是想寫上來分享紀錄一下~
Thumbnail
軟體系統的發展歷程大多相似,首重解決基本需求、提供操作介面,進而提升安全性、擴充功能、優化操作。
Thumbnail
代理模式通過封裝原始對象來實現對該對象的控制和管理,同時不改變原始對象的行為或客戶端與該對象互動的方式,以此介入或增強對該對象的訪問和操作。
Thumbnail
Express 是一個流行的 web 框架,使用 JavsScript 實現,執行在 node 環境上,主要用來寫後端應用。
Thumbnail
當我們在撰寫一套系統的時候, 總是會提供一個介面讓使用者來觸發功能模組並回傳使用者所需的請求, 而傳統的安裝包模式總是太侷限, 需要個別主機獨立安裝, 相當繁瑣, 但隨著時代的演進與互聯網的崛起, 大部分的工作都可以藉由網頁端、裝置端來觸發, 而伺服端則是負責接收指令、運算與回傳結果, 雲端
Thumbnail
在開發前後端分離架構時,使用兩個不同網域所遇到跨域請求問題。特別是在POST請求時行為差異大,揭示了「簡單請求」與「預檢請求」的關鍵差異。簡單請求不需預檢,但application/json會觸發預檢請求,需透過特定設定解決。分享這篇文章希望幫助開發者有效處理跨域問題。
Thumbnail
當我剛開始接觸這個領域的時候,經常會看到有人在討論: 到底要做前端還是後端工程師呢?後端工程師賺的比前端工程師多?前端工程師轉後端工程師?那前端與後端到底是什麼呢? 這篇文章提供了前端與後端的基本概念並舉例來說明。同時也介紹了前端的三大要素以及後端的運作原理,對於想深入瞭解前後端的讀者會非常有幫助。
Thumbnail
先前幾篇筆記介紹了網路請求,瀏覽器儲存資料的方式,那麼實務上,前端最常需要發送網路請求的時候,就是透過呼叫 API,去向後端工程師發送/請求資料,所以今天來記錄什麼是 API吧!
Thumbnail
HTTP伺服器端 package main import ( "net/http" ) type Refer struct { handler http.Handler refer string } //實現中介軟體邏輯​ func (this *Refer) ServeHTTP(