如何在 CRA v2 中将代理值从 package.json 移动到 setupProxy.js？答案

【问题标题】：How to move a proxy value from package.json to setupProxy.js in CRA v2?如何在 CRA v2 中将代理值从 package.json 移动到 setupProxy.js？
【发布时间】：2019-03-13 19:50:29
【问题描述】：

自从最近发布 CRA（创建 React 应用程序）v2 以来，现在可以将代理设置从 package.json 移动到 setupProxy.js。我的问题很简单：如果我只想始终使用http://127.0.0.1:5000，我的setupProxy.js 应该是什么样子？我需要这个，因为如果一切正常（到目前为止没有运气），我可以用来自开发/生产环境的.env 文件中的变量替换它。但到目前为止，我只得到 a 或 b：

a) CORS 错误

b) 我的应用程序的 index.html 作为 http 请求的结果返回

这是我尝试过的 setupProxy.js 版本之一的示例：

const proxy = require('http-proxy-middleware');

module.exports = function(app) {
  app.use('/', proxy({target: 'http://127.0.0.1:5000', changeOrigin: true}));
  app.use('/*', proxy({target: 'http://127.0.0.1:5000', changeOrigin: true}));
  app.use(proxy({'/', target: 'http://127.0.0.1:5000', changeOrigin: true}));
  app.use(proxy({'/*', target: 'http://127.0.0.1:5000', changeOrigin: true}));
};

我尝试了各种版本的app.use 行，我只是在这里发布了几个示例。

我通常尝试一次使用一条 app.use 行，但也尝试使用多行。

每次更改文件时，我都会重新启动 react 应用程序。

我也尝试使用process.env.REACT_APP_BACKEND_BASEURL 代替'http://127.0.0.1:5000'，这是我的最终目标。

【问题讨论】：

标签： reactjs cors create-react-app package.json

【解决方案1】：

所以试试

app.use(proxy('/**', { target:'http://127.0.0.1:5000', changeOrigin: true }))

【讨论】：

欢迎来到 Stack Overflow - 如果解释了为什么工作，这看起来可能是一个很好的答案！

【解决方案2】：

如果我没记错的话，使用 setupProxy.js 只对本地开发有好处，但我也需要它在实时/部署的服务器上工作，所以我最终根本没有使用 setupProxy.js - 我保存了不同的后端 URL 为不同 .env 文件中的 REACT_APP_BACKEND_BASEURL 变量（.env.development 文件中的 loclahost url 和 .env.production 文件中的远程 url），并将前端 JavaScript 代码中的所有出现替换为使用 process.env.REACT_APP_BACKEND_BASEURL。

【讨论】：