軟體工程師職涯升級計畫啟動!立即預約職涯諮詢、履歷健檢或模擬面試👈,為您的加薪做好準備!
現代 Web 架構,前後端分離已成常態,但這也讓前端直接與後端 API 互動的風險增加。暴露 API 網址(endpoint)、跨來源請求(CORS)問題、權限控管,都是開發者必須正面面對的挑戰。
為了解決這些問題,我們可以善用「Proxy(代理伺服器)」作為中介層,攔截、轉發與過濾請求,提供更安全、更彈性的 API 使用方式。
🔍 Proxy 是什麼?為何而設?
Proxy(代理伺服器)是一種常見的設計模式與架構元件,會在**用戶端(Client)與目標伺服器(Server)**之間插入一個代理點。無論是系統內部的 microservices,還是使用者與外部 API 的請求,都可以透過 Proxy 來:- 遮蔽實際後端 API 位址(URL 隱藏)
- 統一處理請求與回應(格式、Header、錯誤)
- 執行權限驗證、轉址、日誌紀錄等
- 解決跨域(CORS)限制
簡單說,它是一個可以「轉送請求 + 加入中介邏輯」的工具。
💡 Proxy 的應用場景
1. 🚦 API 路由切換
在大型專案中,開發與正式環境的 API 往往部署於不同的網域上。例如:
- 開發環境(Dev):
http://localhost:4000/api
- 正式環境(Prod):
https://api.myapp.com
若將邏輯寫死在前端,將增加維護與測試困難。我們可以透過 Proxy 中介層,讓前端始終只向 /api
發送請求,Proxy 再根據環境自動轉發到正確的後端 API。
2. 🔐 權限驗證與請求過濾
Proxy 可作為 API Gatekeeper,先檢查使用者是否具備存取權限。若無權限,可直接攔截、重新導向或回傳錯誤訊息,減少後端承擔不必要的流量與資源負擔。
3. 🛠️ 統一格式與 Header 處理
常見需求包含:
- 自動附帶語系、時區等 Header
- 自動將 Client 傳入參數格式轉換為後端所需格式
- 統一錯誤處理,避免錯誤資訊洩露
🛠 實作:使用 Node.js 建立 Proxy 中介層
在 Node.js 環境下,我們可透過第三方套件 http-proxy-middleware
搭配 Express 快速實作一個簡易 Proxy:
📦 安裝套件
bash
複製編輯npm install http-proxy-middleware
🧪 基本範例程式碼
js
複製編輯const express = require('express');
const { createProxyMiddleware } = require('http-proxy-middleware');
const app = express();
app.use('/api', createProxyMiddleware({
target: 'https://api.example.com',
changeOrigin: true,
pathRewrite: { '^/api': '' },
onProxyReq: (proxyReq, req, res) => {
// 加入語言資訊於 Header
proxyReq.setHeader('Accept-Language', req.headers['accept-language'] || 'en');
},
onProxyRes: (proxyRes, req, res) => {
// 可在此處理後端回應(如統一錯誤格式)
}
}));
app.listen(3000, () => {
console.log('Proxy server is running on http://localhost:3000');
});
🕵️♀️ 說明重點
target
:實際後端 API 網址pathRewrite
:將 Client 發送的/api
前綴移除,使 URL 不外洩changeOrigin
:變更 origin 以符合 CORS 檢查onProxyReq / onProxyRes
:攔截請求與回應,可植入自定邏輯(如權限檢查、紀錄日誌等)
🔄 支援動態環境切換
可額外撰寫函式根據 process.env.NODE_ENV
動態切換目標 API,例如:
js
複製編輯const getApiTarget = () => {
return process.env.NODE_ENV === 'production'
? 'https://api.example.com'
: 'http://localhost:4000';
};
🔒 Proxy 在安全性上的角色

📘 延伸資源
✅ 小結
使用 Proxy 串接 API,不只是為了方便開發、切換環境,更能加強安全控管、統一處理邏輯,是現代前後端分離架構中不可或缺的一環。
下一篇,我們將深入探討 HTTP 快取策略,如何減少請求延遲、提升使用者體驗,別錯過!
📩 喜歡這篇內容嗎?歡迎收藏、轉貼給你正在架構前後端系統的朋友,或留言告訴我你遇到過哪些 API 安全問題。