create-react-app 构建的项目使用代理 proxy

发布时间：2020-12-15 20:32:41 所属栏目：百科来源：网络整理

导读：1.首先进入项目运行 npm run eject 展开详细代码（只可以使用一次，展开后不可恢复） 2.create-react-app 的版本在低于 2.0 的时候可以在 package.json 增加 proxy 配置，配置成如下： "proxy" :{ "/api/**" :{ "target":"https://easy-mock.com/mock/5c0f3

1.首先进入项目运行 npm run eject 展开详细代码（只可以使用一次，展开后不可恢复）

2.create-react-app 的版本在低于 2.0 的时候可以在 package.json 增加 proxy 配置，配置成如下：

"proxy":{
    "/api/**":{
        "target":"https://easy-mock.com/mock/5c0f31837214cf627b8d43f0/",//需要代理的地址
    　　 "changeOrigin": true
    }
}

3.create-react-app 的版本高于 2.0 版本的时候在 package.json 只能配置 string 类型，配置成如下：

"proxy": "https://easy-mock.com/mock/5c0f31837214cf627b8d43f0/",

4.更好的配置，建立 src/setupProxy.js 文件，npm 安装 install http-proxy-middleware,配置成如下：(可配置多个代理)

const proxy = require("http-proxy-middleware");
module.exports = function(app) {
    app.use(
        proxy("/base/",{
            target: "http://45.32.15.21:8090/",changeOrigin: true
        })
    );
    app.use(
        proxy("/api/",{
            target: "https://easy-mock.com/mock/5c0f31837214cf627b8d43f0/",changeOrigin: true
        })
    );
};

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!