从使用CRA创建的Firebase托管React应用访问外部API

时间:2020-01-14 17:08:35

标签: reactjs firebase api cors create-react-app

我有一个React应用(CRA),该应用托管在Firebase上,正在尝试访问外部Rest API(使用javascript的fetch()),但是该API与Web应用不在同一个域中,则会引发“ CORS”错误。 API的标头Access-Control-Allow-Origin*。 在开发模式下,我可以在package.json中使用代理来解决此问题,但是在托管应用后似乎没有任何作用。

尝试过以下事情

  • 更新了Firebase.json以包含标题
  • 使用no-cors
  • fetch()模式

1 个答案:

答案 0 :(得分:2)

正确的CORS标头是const byPayAsc = ascend(prop('pay')) // spare, for checking const byPayDes = descend(prop('pay')) const sortByPay = sort(byPayDes) const groupedByTeam = compose(values, groupBy(prop('team'))) const topTwoPlayers = map(take(2)) const topTwoHighestPaidPlayersPerTeam = pipe( sortByPay, groupedByTeam, topTwoPlayers, flatten, sortByPay ) topTwoHighestPaidPlayersPerTeam(footballers) ,而不是Access-Control-Allow-Origin。另外,根据请求的性质,您可能需要official doc,并且可能无法使用Access-Control-Origin作为来源。

您无法在客户端绕过CORS进行任何操作-它被明确设计为一种浏览器安全性机制,可以防止意外的跨域请求。如果您可以控制API服务器,则应该可以解决此问题。如果不这样做,则可能需要使用Cloud Function将请求代理到外部API。