reactjs - 为 ReactGA 运行 pageView 时出现 CORS 错误

Question

我正在尝试将 React-GA 添加到 React Web 应用程序，并通过将其添加到 index.js 来遵循文档:

import ReactGA from 'react-ga';
ReactGA.initialize('MY_ID');
ReactGA.pageview(window.location.pathname + window.location.search);

但是，这会导致浏览器控制台中出现以下错误

Access to XMLHttpRequest at'https://www.google-analytics.com/j/collect?......'from origin 'http://localhost:3000' has been blocked by CORS policy:The value of the 'Access-Control-Allow-Origin' header in the responsemust not be the wildcard '*' when the request's credentials mode is'include'. The credentials mode of requests initiated by theXMLHttpRequest is controlled by the withCredentials attribute.

analytics.js:37 POSThttps://www.google-analytics.com/j/collect?......net::ERR_FAILED

查看网络选项卡中的 Google Analytics HTTP 响应，我肯定看到了为 access-control-allow-headers 设置的通配符:

access-control-allow-credentials: true
access-control-allow-headers: *
access-control-allow-methods: GET, HEAD, POST, PUT, PATCH, DELETE, OPTIONS
access-control-allow-origin: *
access-control-expose-headers: *
...

但是，我不确定如何最终解决此问题，因为它似乎是由 Google 的响应引起的。

Answer 1

我认为你的问题是你是将通配符与凭据模式“包含”的请求一起使用 .

The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'.

您需要为您的请求指定来源 .这是“http://localhost:3000”。
您可以在此 stackoverflow 上找到更多信息 post
我用过这个 code使用“create-react-app”测试 Google Analytics。