指定时，package.json 中的“代理”必须是字符串

Question

我想在我的反应客户端中有代理，我的 package.json 包含：

 ...
"scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "proxy": {
    "/auth/google": {
      "target": "http://localhost:5000"
    }
   },
...

但是当我运行它时，我得到了错误

When specified, "proxy" in package.json must be a string.
[1] Instead, the type of "proxy" was "object".
[1] Either remove "proxy" from package.json, or make it a string.

我试图转换为字符串，没有错误，但代理不起作用

"proxy": "http://localhost:5000"

我的 App.js

 <div className="App">
        <header className="App-header">
          <img src={logo} className="App-logo" alt="logo" />
          <p>hey there</p>
          <a href="/auth/google">Sign In With Google</a>
        </header>
      </div>

原文由 richersoon 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

您面临的问题是因为 CRA v2 。

首先，如果您只是在代理中使用纯字符串，则不需要任何其他配置。但是当你使用一个对象的时候，你就是在使用高级配置。

因此，您必须按照下面列出的步骤操作：

1. 输入 npm i --save http-proxy-middleware 安装 http-proxy-middleware

2. 从 package.json 中删除条目：

 "proxy": {
    "/auth/google": {
        "target": "http://localhost:5000"
    }
}

1. 现在为您的代理创建一个设置文件。您应该在客户端的 src 文件夹中将其命名为 setupProxy.js 并键入以下代码：

 const proxy = require('http-proxy-middleware');
module.exports = function(app) {
    app.use(proxy('/auth/google',
        { target: 'http://localhost:5000/' }
    ));
}

有关更多信息，请检查 此

原文由 Rohan Dhar 发布，翻译遵循 CC BY-SA 4.0 许可协议