Question

我们在我们的react应用程序中创建了package.json中的代理（创建为create-react-app。我们在开发期间使用前端（webpack）和后端（express）之间的代理作为{{3}这是我们为后端服务器定义代理的部分（package.json：

  "scripts": {
    ...
  },
  "proxy": "http://localhost:3001"
}

在后端（服务器在端口3001上运行）我们调用另一个API（但我认为它并不重要，只是一个注释）。我注意到来自webpack（create-react-app）的代理调用表示（支持）非常慢。（Windows操作系统）

GET http://localhost:3000/endpoint/ -> ~600ms - 900ms
GET http://localhost:3001/endpoint/ -> ~150ms - 250ms

正如您所看到的，代理呼叫（端口3000）和直接呼叫 - 端口（3001）之间的时间差异非常大。我期待延迟，但这看起来很奇怪。

同样有时来自代理的大型JSON响应（~38KB）被破坏（无效 - 例如在30%+个案例中缺少响应的某些部分或交换的字符）。我一直在后端方面遇到同样的问题而且我认为我已经使用代理代理解决了这个问题，我设置了keep-alive连接。

您是否知道为何或如何改善代理时间和行为？

此外，我尝试在package.json中设置代理，但没有成功。 described here说：

您还可以指定http-proxy-middleware或http-proxy支持的任何配置值。

create react app documentation说

agent：要传递给http（s）.request的对象（请参阅Node的https代理和http代理对象）

是否可以在package.json？

中定义代理

我试过，但我收到了以下错误

TypeError：代理选项必须是类似于代理的对象，未定义或假。在新的ClientRequest（_http_client.js：106：11）

"proxy": {
    "/": {
      "target": "http://localhost:3001",
      "agent": { "keepAlive": true }
    }
  }

非常感谢任何建议或想法。

Answer 1

为我的问题添加答案，以防有人遇到与我们相同的问题。

我们被迫使用react-app-rewired作为自定义代理。很遗憾我们无法为// config-overrides.js module.exports = { devServer: function(configFunction) { return function(proxy, allowedHost) { const config = configFunction(proxy, allowedHost); config.proxy.forEach(p => { p.agent = agent; }); return config; }; } }代理设置我们的自定义代理。

如果您需要更改devServer的代理，请在documentation中解释一下。

create-react-app

我想它的解决方法可能不会在react-app-rewired 的未来版本中得到支持，但响应时间大约是150ms - 230ms （AND！没有无效的JSON）并且它＆＃ 39;这是现在很重要的事情。。

来自{{1}}的令人不安的说明我想指出：

通过这样做你打破了＆＃34; guarantees＆＃34; CRA提供。也就是说你现在已经拥有了＃34;配置。不会提供任何支持。谨慎行事。

我已报告issue so further investigation will be there.

在Windows上，在package.json中React create app proxy agent很慢

1 个答案: