最新React使用 http-proxy-middleware解决多跨域问题(完美篇)

最新推荐文章于 2025-02-21 23:43:22 发布

晴天小哥哥

最新推荐文章于 2025-02-21 23:43:22 发布

阅读量1.8w

点赞数 11

分类专栏： React 文章标签： js reactjs

本文链接：https://blog.csdn.net/weixin_38399962/article/details/107258487

版权

1. 安装 http-proxy-middleware

npm install http-proxy-middleware
#顺便安装一下 axios ，不用也可以，用fetch也一样。
npm install axios

2. src目录下创建一个 setupProxy.js文件

里面的'api'代表target的域名url代理后的url

const { createProxyMiddleware } = require('http-proxy-middleware');
module.exports = function (app) {
    app.use(
        '/api',
        createProxyMiddleware({
            target: 'https://eyesight.news.qq.com/',
            changeOrigin: true,
            pathRewrite: {
                '^/api': '',
            }
        })
    );
    app.use(
        '/apc',
        createProxyMiddleware({
            target: 'https://api.inews.qq.com/',
            changeOrigin: true,
            pathRewrite: {
                '^/apc': '',
            }
        })
    );
};