CRA 2.0 如何在 React 中设置代理？

Question

在 CRA 2.0 代理属性上 package.json 不起作用。经过一些研究，我发现了一篇建议使用 http-proxy-middleware 的文章。我在客户端文件夹（React 端）的 src 中创建了一个 setupProxy.js。包含以下代码

const proxy = require("http-proxy-middleware");
module.exports = function(app) {
  console.log("Setup proxy is ever called");
  app.use(proxy("/api/auth/google", { target: "http://localhost:5000/" }));
};

这之后我应该做什么。我应该在哪里导入 setupProxy.js 文件。它将从哪里接收 app。

Answer 1

package.json 中的 proxy 值在 CRA 2 中仍然有效，但它现在只接受一个字符串，更复杂的代理选项必须像你一样放在 src/setupProxy.js 中正在做。但请注意，如果您将 proxy 属性留在 package.json 中，CRA 将使用它并忽略您的 setupProxy.js 文件。

您不需要在任何地方导入 setupProxy.js，只要它在 src.

中，CRA 就会找到它

不用担心 app 来自哪里，该变量将在运行时提供。

你的例子会起作用，我试过了（只要你从 package.json 中删除旧的代理字符串）。但是 console.log 不会被记录到终端（我不确定为什么）。

进一步阅读，引入此更改的 PR：https://github.com/facebook/create-react-app/pull/5073

CRA 2.0 如何在 React 中设置代理？

CRA 2.0 How to setup proxy in React?

reactjs

http-proxy-middleware