Google Analytics分析无法正常工作

编程问答 2022-08-13

问题描述

我在我的React项目中使用了Google Analytics（分析），即使我在线也没有显示任何活跃用户。我尝试了在网上找到的其他方法，但似乎都没有用。我只在本地主机上尝试过它，而未在已部署的网站上尝试过，但我认为它仍然可以工作。

这是我的代码。

我的app.js 

import React,{ Suspense,useEffect } from "react";
import "./App.css";
import IntroPage from "./containers/IntroPage/IntroPage";
import Layout from "./containers/Layout/Layout";
import { Switch,Route,Redirect,withRouter } from "react-router-dom";
import Spinner from "./Components/UI/Spinner/Spinner";
import ReactGA from "react-ga";

const Contact = React.lazy(() => import("./Components/Contact/Contact"));

const trackingId = "UA-171033255-1";
ReactGA.initialize(trackingId);


function App() {
  useEffect(() => {
    ReactGA.pageview(window.location.pathname + window.location.search);
  },[]);

  return (
    <div className="App">
      <Layout>
        <Switch>
          <Route
            path="/contact"
            render={() => (
              <Suspense
                fallback={
                  <div className="Fallback">
                    <Spinner />
                  </div>
                }
              >
                <Contact />
              </Suspense>
            )}
          />
          <Route path="/" component={IntroPage} />
          <Redirect to="/" />
        </Switch>
      </Layout>
    </div>
  );
}

export default withRouter(App);

我在做什么错了？

解决方法

您是否在html的头中包含了Google分析的cdn链接和js？

,

您是否尝试过将跟踪代码添加到index.html的<head>中（管理->属性->跟踪代码）？

,

我在react-ga上也遇到了问题，因此我在普通JavaScript中实现了它，并且效果很好！我确切地写下了you can read it here。

让我知道这是否有帮助或您有任何问题：）

,

由于您在 useEffect 中使用空的依赖项数组，因此您的代码只会在 <App/> 呈现时执行一次。因此，您不会发送有关路线更改的综合浏览量。

您需要在您的 App 组件之前放置与浏览量相关的代码，紧跟在 ReactGA 初始化之后。这是来自 docs 的用法示例。