Question

我有这样的API调用：

 const response = await fetch('/api/some-url')

为使其正常工作，我在package.json中添加了代理字段

...
"proxy": "https://some-domain.com"
...

我尝试了npm start，但效果很好

此后，我将部署添加到gh-pages：添加了属性“ homepage”并安装了“ gh-pages”包（全部来自https://create-react-app.dev/docs/deployment/）

接下来，我运行npm run deploy并转到托管我的应用程序的github（my-user-name.github.io/project-name）。并看到了api调用的结果-404错误。 api调用的请求网址为“ my-user-name.github.io/project-name/api/some-url”。

这是我遇到问题的github存储库：https://github.com/kpodmasko/binance-test-solution

问题：如何将请求URL从my-user-name.github.io/project-name/api/some-url更改为https://some-domain.com/api/some-url并保存代理逻辑？

Answer 1

我添加了环境变量（https://create-react-app.dev/docs/adding-custom-environment-variables/），将my-user-name.github.io/project-name/api/some-url更改为https://some-domain.com/api/some-url。

此后，我对CORS遇到了问题。解决方案是从package.json中删除代理属性。并使用类似fetch('https://thingproxy.freeboard.io/fetch/https://some-domain.com/api/some-url')的抓取方式。

它在localhost上有效，但是在gh-pages上有效-不能。因此，我认为要使其在gh页上工作，您应该找到有效的代理。另外，有人给我建议，我可以购买Digital Ocean托管服务器并使它正常工作。

使用代理部署create-react-app gh-pages

1 个答案: