11

尽管我在我的应用程序的根目录进行了初始化，但我多次收到以下警告（针对多个页面）。这让我想知道谷歌分析是否正常工作？ [react-ga] ReactGA.initialize must be called first or GoogleAnalytics should be loaded manually

我正在使用 ReactGA 来处理我的谷歌分析标签，但我无法让它工作。根据文档和一些其他在线问题，我需要做的就是在我的应用程序根目录中插入这个：

应用程序.js：

import ReactGA from 'react-ga';
ReactGA.initialize('G-xxxxxxxxxx');

const app = () => (
    // Root level components here, like routing and navigation
)

我正在使用服务器端渲染，所以我在跟踪之前确保窗口对象存在。这一行放在我每个页面的导入末尾：

示例 page.js：

import ReactGA from 'react-ga';
if (typeof(window) !== 'undefined') {
    ReactGA.pageview(window.location.pathname + window.location.search);
}

function page() {
    return(<div className="page">Hello, World</div>)
}

export default page;

目前，关于如何为 SSR 应用程序设置 Google Analytics（分析）的信息并不多，所以我不完全确定需要做什么才能使其正常工作。任何帮助表示赞赏！

4

1 回答 1

6

经过大量修补潜在的解决方案后，我终于找到了解决方案。由于在初始化完成之前就触发了综合浏览量，因此我厌倦了通过将其放置在componentDidMount(). 该实现如下所示：

应用程序.js：

//imports
import ReactGA from 'react-ga';
ReactGA.initialize('UA-xxxxxxxxx-x');

const App = () => (
  <div className="App">
    <Navigation />
            
    <AppRouting />
  </div>
);

页面.js：

import ReactGA from 'react-ga';

class MyPage extends React.Component {
    componentDidMount() {
        ReactGA.pageview(window.location.pathname + window.location.search);
    }

    render() {
        return(
            <Component />
        );
    }
}
于 2020-03-07T03:44:22.243 回答