隨著前端開發的發展，越來越多的應用需要透過 API 介面和後端伺服器進行通訊。但開發人員面臨的一個問題是如何繞過跨來源限制，這是瀏覽器出於安全考慮防止跨站點攻擊而引入的機制。
而代理程式是一種解決跨來源限制的常用方式。透過將瀏覽器的請求傳送到代理伺服器上，並由代理伺服器轉送請求到真正的介面位址，我們可以繞過跨來源限制來存取介面。在本文中，我們將介紹如何在 Node.js 中使用路由元件來設定代理程式。
在 Node.js 中，我們有多種方案可以設定代理程式。以Express 為例，常用的方案有以下幾種：
在本文中，我們將介紹第一個方案。
我們需要安裝 http-proxy-middleware 外掛程式來實作代理功能。
$ npm install http-proxy-middleware --save-dev
在 Express 中，我們可以使用 express.Router() 方法來建立路由實例。我們可以為每一個路由實例配置一個代理程式。
const express = require('express');
const { createProxyMiddleware } = require('http-proxy-middleware');
const app = express();
const router = express.Router();
// 配置代理
router.use('/api', createProxyMiddleware({
target: 'http://www.example.com',
changeOrigin: true
}));
app.use(router);
// 启动服务器
const server = app.listen(3000, () => {
const { address, port } = server.address();
console.log(`Listening on http://${address}:${port}`);
});上面的程式碼透過設定一個路由，將路由位址為 /api 的請求代理程式到了 http://www.example.com 位址上。
在 createProxyMiddleware 中，我們可以設定多個選項來自訂代理設定。例如，我們可以使用pathRewrite 選項來重寫路徑，用於將路由位址中的/api 前綴去掉，實現與真實介面位址的匹配：
router.use('/api', createProxyMiddleware({
target: 'http://www.example.com',
changeOrigin: true,
pathRewrite: { '^/api': '' }
}));上面的程式碼將代理以後的路徑中的/ api 前綴去掉。
除了設定代理，我們也可以設定攔截器來客製化代理行為。攔截器用於處理請求和回應，例如，我們可以在請求發起之前添加頭部訊息，或處理請求回應之後的回傳值。
在 http-proxy-middleware 中，我們可以透過 onProxyReq 和 onProxyRes 兩個選項來設定攔截器。
//
router.use('/api', createProxyMiddleware({
target: 'http://www.example.com',
changeOrigin: true,
onProxyReq: (proxyReq, req, res) => {
// 在请求发起前添加头部信息
proxyReq.setHeader('Authorization', 'Bearer ' + token);
},
onProxyRes: (proxyRes, req, res) => {
// 在响应返回后处理返回值
const data = proxyRes.body.toString('utf8');
const newData = JSON.parse(data).result;
res.send(newData);
}
}));上述程式碼中，我們在 onProxyReq 中新增了一個名為 Authorization 的頭部訊息，並在 onProxyRes 中處理了傳回值。
透過以上介紹，我們學習如何使用 http-proxy-middleware 外掛程式來實現路由代理功能，我們也了解如何透過中介軟體來實現。此外，我們還學習了配置攔截器，用於處理請求和回應。
Node.js 提供了許多方便的工具來幫助我們實作代理功能，有助於開發人員快速建置並部署應用程式。希望本文對你有幫助，在你的後端開發工作中，利用代理來解決跨站點通訊的問題。
以上是如何在 Node.js 中使用路由元件來設定代理的詳細內容。更多資訊請關注PHP中文網其他相關文章！
