Node.js 程式札記:Express 中間件 (Middleware)

閱讀時間約 8 分鐘

Express 中間件能夠處理請求驗證、錯誤處理、日誌記錄等問題,簡化複雜的開發流程,無論你是正在構建企業級應用還是簡單的網站,掌握中間件的使用都能顯著提升你的開發效率和應用質量。

中間件定義和作用

中間件是一個函數,它可以存取請求對象(request object,req)、回應對象(response object,res),以及應用程式的請求-回應循環中的下一個中間件函數,通常由變數 next 表示。

中間件的作用

中間件在 Express 應用中可以執行以下任務:

  1. 執行任何程式碼
  2. 修改請求和回應對象
  3. 結束請求-回應循環
  4. 呼叫順序中的下一個中間件

如果當前中間件沒有終止請求-回應循環,它必須呼叫 next() 將控制權傳遞給下一個中間件,否則請求將被掛起。

中間件的基本結構

一個典型的中間件函數看起來是這樣的:

function myMiddleware(req, res, next) {
// 執行某些操作
console.log('這是一個中間件');
// 呼叫下一個中間件
next();
}

常用的內建中間件

Express 提供了一些內建的中間件,可以直接使用來處理常見任務。以下是幾個最常用的:

1. express.json()

這個中間件用於解析 JSON 格式的請求體。當客戶端傳送 JSON 數據時,express.json() 會自動將其解析並放入 req.body 中。

const express = require('express');
const app = express();
const port = 3000;

app.post('/api/data', (req, res) => {
console.log(req.body); // 存取已解析的表單數據
res.json({ message: '數據已接收' });
});

app.listen(port, () => {
console.log(`服務器運行在 http://localhost:${port}`);
});

2. express.urlencoded()

這個中間件用於解析 URL-encoded 格式的請求體,通常用於處理 HTML 表單提交的數據。

const express = require('express');
const app = express();
const port = 3000;

app.use(express.urlencoded({ extended: true }));

app.post('/submit-form', (req, res) => {
console.log(req.body); // 存取已解析的表單數據
res.send('表單已提交');
});

app.get('/', (req, res) => {
res.send(`
<html>
<body>
<h1>表單提交示例</h1>
<form action="/submit-form" method="POST">
<label for="name">姓名:</label>
<input type="text" id="name" name="name"><br><br>
<label for="email">郵箱:</label>
<input type="email" id="email" name="email"><br><br>
<input type="submit" value="提交">
</form>
</body>
</html>
`);
});

app.listen(port, () => {
console.log(`服務器運行在 http://localhost:${port}`);
});

3. express.static()

express.static 中間件用於提供靜態文件,如 HTML、CSS、JavaScript、圖片等。

app.use(express.static('public'));

這行程式碼將使 public 目錄下的文件可以直接通過 URL 存取。例如,如果 public 目錄下有一個 styles.css 文件,可以通過 http://localhost:3000/styles.css 存取。

自定義中間件的使用

除了使用內建中間件,你還可以創建自定義中間件來滿足特定需求。以下是一些常見的自定義中間件示例:

1. 日誌記錄中間件

這個中間件可以用來記錄每個請求的詳細信息:

function loggerMiddleware(req, res, next) {
console.log(`[${new Date().toISOString()}] ${req.method} ${req.url}`);
next();
}

app.use(loggerMiddleware);

2. 錯誤處理中間件

錯誤處理中間件通常定義為四個參數的函數,用於集中處理應用程式中的錯誤:

// 模擬數據庫操作
function fetchUserFromDatabase(id) {
// 假設 ID 為 0 時,模擬數據庫錯誤
if (id === '0') {
throw new Error('數據庫連接失敗');
}
return { id, name: 'User ' + id };
}

// 用戶資料路由
app.get('/user/:id', (req, res, next) => {
try {
const user = fetchUserFromDatabase(req.params.id);
res.json(user);
} catch (error) {
next(error); // 將錯誤傳遞給錯誤處理中間件
}
});

// 錯誤處理中間件
app.use((err, req, res, next) => {
console.error(err.stack);
res.status(500).json({ error: '伺服器錯誤,請稍後再試' });
});

3. 身份驗證中間件

用於檢查用戶是否已登入的中間件:

function authMiddleware(req, res, next) {
if (req.session && req.session.user) {
next();
} else {
res.status(401).send('請先登入');
}
}

// 在需要驗證的路由上使用
app.get('/protected', authMiddleware, (req, res) => {
res.send('這是受保護的內容');
});

總結

通過合理使用內建中間件和自定義中間件,你可以輕鬆處理複雜的業務邏輯、提升應用程式的安全性,並實現各種功能擴展。記住,中間件的順序很重要,合理安排它們可以讓你的應用程式的可維護性提高。

60會員
91內容數
「梧笙」即「吾生」,意即我的生命,朋友都叫我「阿梧(Awu)」,高雄人。我喜歡學習新技能,從程式設計到網路工具,再到社群經營和影片剪輯。日常興趣是打遊戲、看動漫、讀小說和聽音樂。我會把這些興趣寫成文章,如果你有任何想法或問題,歡迎來信到我的郵箱 [email protected]
留言0
查看全部
發表第一個留言支持創作者!
梧笙の領域展開 的其他內容
本文將介紹 Express 如何設置基本路由、處理不同的 HTTP 方法、利用路由參數和查詢字串,以及如何使用請求和回應物件。
Node.js 是一個功能強大的 JavaScript 執行環境,它內建的核心模組讓開發者能夠輕鬆處理檔案系統操作、網路請求和路徑管理等常見需求。本文將介紹三個常用的 Node.js 核心模組,並透過範例程式碼展示它們的基本用法,幫助你快速上手。
Express 是一個簡潔而靈活的 Node.js 網頁應用程式框架,本文將介紹 Express 的基礎知識,包括安裝、路由設定、中介層使用,以及如何搭配 EJS 模板引擎來渲染動態內容。
MongoDB 是一個靈活的 NoSQL 資料庫,這篇文章將帶你了解如何在 Node.js 中操作MongoDB 資料庫,包括基本連接、CRUD操作,以及如何使用 Mongoose ODM 來簡化資料庫操作。
在學習 Node.js 時,異步處理是其中一個非常重要的概念,因為Node.js是一個非阻塞I/O的運行環境,所以理解如何處理異步操作對於開發者來說至關重要。本篇文章將介紹 Node.js 中常見的三種異步處理方式:回調函式、Promise、以及 Async/Await。
由於 Node.js 其非同步和事件驅動的特性,Node.js 特別適合構建高效能的網絡應用程式。本文將介紹 Node.js 的三個基礎概念:事件驅動和非阻塞I/O、模組系統以及 npm 套件管理器。
本文將介紹 Express 如何設置基本路由、處理不同的 HTTP 方法、利用路由參數和查詢字串,以及如何使用請求和回應物件。
Node.js 是一個功能強大的 JavaScript 執行環境,它內建的核心模組讓開發者能夠輕鬆處理檔案系統操作、網路請求和路徑管理等常見需求。本文將介紹三個常用的 Node.js 核心模組,並透過範例程式碼展示它們的基本用法,幫助你快速上手。
Express 是一個簡潔而靈活的 Node.js 網頁應用程式框架,本文將介紹 Express 的基礎知識,包括安裝、路由設定、中介層使用,以及如何搭配 EJS 模板引擎來渲染動態內容。
MongoDB 是一個靈活的 NoSQL 資料庫,這篇文章將帶你了解如何在 Node.js 中操作MongoDB 資料庫,包括基本連接、CRUD操作,以及如何使用 Mongoose ODM 來簡化資料庫操作。
在學習 Node.js 時,異步處理是其中一個非常重要的概念,因為Node.js是一個非阻塞I/O的運行環境,所以理解如何處理異步操作對於開發者來說至關重要。本篇文章將介紹 Node.js 中常見的三種異步處理方式:回調函式、Promise、以及 Async/Await。
由於 Node.js 其非同步和事件驅動的特性,Node.js 特別適合構建高效能的網絡應用程式。本文將介紹 Node.js 的三個基礎概念:事件驅動和非阻塞I/O、模組系統以及 npm 套件管理器。
你可能也想看
Google News 追蹤
Thumbnail
這個秋,Chill 嗨嗨!穿搭美美去賞楓,裝備款款去露營⋯⋯你的秋天怎麼過?秋日 To Do List 等你分享! 秋季全站徵文,我們準備了五個創作主題,參賽還有機會獲得「火烤兩用鍋」,一起來看看如何參加吧~
Thumbnail
美國總統大選只剩下三天, 我們觀察一整週民調與金融市場的變化(包含賭局), 到本週五下午3:00前為止, 誰是美國總統幾乎大概可以猜到60-70%的機率, 本篇文章就是以大選結局為主軸來討論近期甚至到未來四年美股可能的改變
Thumbnail
Faker昨天真的太扯了,中國主播王多多點評的話更是精妙,分享給各位 王多多的點評 「Faker是我們的處境,他是LPL永遠繞不開的一個人和話題,所以我們特別渴望在決賽跟他相遇,去直面我們的處境。 我們曾經稱他為最高的山,最長的河,以為山海就是盡頭,可是Faker用他28歲的年齡...
Thumbnail
在這篇教學文章中,我們將展示如何使用 Node.js 建立一個簡單的伺服器,並解決常見的跨來源資源共享(CORS)問題,確保伺服器能夠接收並處理來自不同來源的資料。
Thumbnail
※ 什麼是Web API API 就是後端開出來讓前端來用的介面,讓前端與後端可以溝通。 API流程: 終端使用者用任何一種裝置進入瀏覽器。 瀏覽器透過 API 向後端發出請求,請求查詢或修改資料。 後端透過 API 收到前端的請求後,取得資料並回應給前端。 前端渲染畫面,終端使用者
Thumbnail
※ 原本狀態:伺服器渲染 這是 MVC 架構下的 request / response 示意圖,在這張圖呈現的架構裡,畫面和資料都由同一個架構處理。 伺服器渲染流程: 瀏覽器針對特定網址送出請求。 路由器解析請求後,轉接給對應的 controller。 controller 按照要求,透過
Thumbnail
※ 什麼是Middleware (中介層)? Middleware 一般翻譯作「中間件」或是「中介軟體」,其實 Express 應用程式就是由一連串的 middleware 串連而成: 從 request 進來到 response 回去會經過一系列的流程。 這個流程會按照路由清單由上而下執行。
※ 補充說明: ※ npm 常用指令: ◦ npm init–y:快速初始化一個新的 Node.js 並建立一個 package.json 文件的命令。 ◦ npm info 套件名稱 version:快速查詢指定 npm 套件的最新版本號。 ◦ npm install套件名稱:用來安裝
Thumbnail
本章節旨在介紹TypeScript中的函數,包括其基本結構、如何呼叫函數、函數的參數以及函數的返回值等相關概念。通過本章節,讀者可以學習到如何在TypeScript中使用不同的方式來定義函數,如函數聲明、函數表達式、箭頭函數和匿名函數等。
※ Express 專案步驟筆記清單 Node.js 環境建置核對 新增專案資料夾 設定 package.json npm init -y 設定程式入口為 app.js 安裝 Express:npm install express 設定主程式 app.js 建構應用程式伺服器 設定
Thumbnail
Request內容 package main import ( "fmt" "log" "net/http" "strings" ) func request(w http.ResponseWriter, r *http.Request) { //這些資訊是輸出到伺服器端的列印訊息
Thumbnail
HTTP伺服器端 package main import ( "net/http" ) type Refer struct { handler http.Handler refer string } //實現中介軟體邏輯​ func (this *Refer) ServeHTTP(
Thumbnail
這個秋,Chill 嗨嗨!穿搭美美去賞楓,裝備款款去露營⋯⋯你的秋天怎麼過?秋日 To Do List 等你分享! 秋季全站徵文,我們準備了五個創作主題,參賽還有機會獲得「火烤兩用鍋」,一起來看看如何參加吧~
Thumbnail
美國總統大選只剩下三天, 我們觀察一整週民調與金融市場的變化(包含賭局), 到本週五下午3:00前為止, 誰是美國總統幾乎大概可以猜到60-70%的機率, 本篇文章就是以大選結局為主軸來討論近期甚至到未來四年美股可能的改變
Thumbnail
Faker昨天真的太扯了,中國主播王多多點評的話更是精妙,分享給各位 王多多的點評 「Faker是我們的處境,他是LPL永遠繞不開的一個人和話題,所以我們特別渴望在決賽跟他相遇,去直面我們的處境。 我們曾經稱他為最高的山,最長的河,以為山海就是盡頭,可是Faker用他28歲的年齡...
Thumbnail
在這篇教學文章中,我們將展示如何使用 Node.js 建立一個簡單的伺服器,並解決常見的跨來源資源共享(CORS)問題,確保伺服器能夠接收並處理來自不同來源的資料。
Thumbnail
※ 什麼是Web API API 就是後端開出來讓前端來用的介面,讓前端與後端可以溝通。 API流程: 終端使用者用任何一種裝置進入瀏覽器。 瀏覽器透過 API 向後端發出請求,請求查詢或修改資料。 後端透過 API 收到前端的請求後,取得資料並回應給前端。 前端渲染畫面,終端使用者
Thumbnail
※ 原本狀態:伺服器渲染 這是 MVC 架構下的 request / response 示意圖,在這張圖呈現的架構裡,畫面和資料都由同一個架構處理。 伺服器渲染流程: 瀏覽器針對特定網址送出請求。 路由器解析請求後,轉接給對應的 controller。 controller 按照要求,透過
Thumbnail
※ 什麼是Middleware (中介層)? Middleware 一般翻譯作「中間件」或是「中介軟體」,其實 Express 應用程式就是由一連串的 middleware 串連而成: 從 request 進來到 response 回去會經過一系列的流程。 這個流程會按照路由清單由上而下執行。
※ 補充說明: ※ npm 常用指令: ◦ npm init–y:快速初始化一個新的 Node.js 並建立一個 package.json 文件的命令。 ◦ npm info 套件名稱 version:快速查詢指定 npm 套件的最新版本號。 ◦ npm install套件名稱:用來安裝
Thumbnail
本章節旨在介紹TypeScript中的函數,包括其基本結構、如何呼叫函數、函數的參數以及函數的返回值等相關概念。通過本章節,讀者可以學習到如何在TypeScript中使用不同的方式來定義函數,如函數聲明、函數表達式、箭頭函數和匿名函數等。
※ Express 專案步驟筆記清單 Node.js 環境建置核對 新增專案資料夾 設定 package.json npm init -y 設定程式入口為 app.js 安裝 Express:npm install express 設定主程式 app.js 建構應用程式伺服器 設定
Thumbnail
Request內容 package main import ( "fmt" "log" "net/http" "strings" ) func request(w http.ResponseWriter, r *http.Request) { //這些資訊是輸出到伺服器端的列印訊息
Thumbnail
HTTP伺服器端 package main import ( "net/http" ) type Refer struct { handler http.Handler refer string } //實現中介軟體邏輯​ func (this *Refer) ServeHTTP(