Avec le développement du développement front-end, de plus en plus d'applications doivent communiquer avec les serveurs back-end via des interfaces API. Mais l’un des problèmes auxquels les développeurs sont confrontés est de savoir comment contourner les restrictions d’origine croisée, un mécanisme introduit par les navigateurs pour des raisons de sécurité afin d’empêcher les attaques intersites.
Le proxy est un moyen courant de résoudre les restrictions d'origine croisée. En envoyant la demande du navigateur au serveur proxy et en transmettant la demande à l'adresse réelle de l'interface, nous pouvons contourner les restrictions d'origine croisée et accéder à l'interface. Dans cet article, nous verrons comment configurer un proxy à l'aide du composant de routage dans Node.js.
Dans Node.js, nous disposons de plusieurs options pour configurer le proxy. En prenant Express comme exemple, les solutions couramment utilisées sont les suivantes :
Dans ce article, nous La première option sera introduite.
Nous devons installer le plug-in http-proxy-middleware pour implémenter la fonction proxy.
$ npm install http-proxy-middleware --save-dev
Dans Express, nous pouvons utiliser la méthode express.Router() pour créer des instances de routage. Nous pouvons configurer un proxy pour chaque instance de routage.
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}`); });
Le code ci-dessus transmet la requête avec l'adresse de routage /api à l'adresse http://www.example.com en configurant une route.
Dans createProxyMiddleware, nous pouvons configurer plusieurs options pour personnaliser la configuration du proxy. Par exemple, nous pouvons utiliser l'option pathRewrite pour réécrire le chemin afin de supprimer le préfixe /api de l'adresse de routage afin qu'il corresponde à l'adresse réelle de l'interface :
router.use('/api', createProxyMiddleware({ target: 'http://www.example.com', changeOrigin: true, pathRewrite: { '^/api': '' } }));
Le code ci-dessus supprimera le préfixe /api du chemin après le proxy.
En plus de configurer le proxy, nous pouvons également configurer les intercepteurs pour personnaliser le comportement du proxy. Les intercepteurs sont utilisés pour traiter les demandes et les réponses. Par exemple, nous pouvons ajouter des informations d'en-tête avant le lancement de la demande, ou traiter la valeur de retour après la réponse à la demande.
Dans http-proxy-middleware, nous pouvons configurer l'intercepteur via les deux options onProxyReq et 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); } }));
Dans le code ci-dessus, nous avons ajouté une information d'en-tête nommée Authorization dans onProxyReq et traité la valeur de retour dans onProxyRes.
Grâce à l'introduction ci-dessus, nous avons appris à utiliser le plug-in http-proxy-middleware pour implémenter la fonction de proxy de routage, et nous avons également appris à l'implémenter via un middleware. De plus, nous avons également appris à configurer des intercepteurs pour gérer les requêtes et les réponses.
Node.js fournit de nombreux outils pratiques pour nous aider à implémenter des fonctions proxy, aidant ainsi les développeurs à créer et déployer rapidement des applications. J'espère que cet article vous aidera à utiliser des proxys pour résoudre les problèmes de communication entre sites dans votre travail de développement back-end.
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!