帶有反應的谷歌分析不起作用
[英]Google analytics with react is not working
問題描述
我在我的反應項目中使用谷歌分析，即使我在線，它也不會顯示任何活躍用戶。 我嘗試了在網上找到的不同方法，但似乎都不起作用。 我只在本地主機上試過，沒有在已部署的網站上試過，但我認為它應該仍然有效。
這是我的代碼。
我的應用程序.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);
我在這里做錯了什么？
5 個解決方案
解決方案1
1 2020-09-16 15:25:21
我在我的 React 項目中使用谷歌分析，即使我在線，它也不會顯示任何活躍用戶。 我嘗試了在網上找到的不同方法，但似乎都不起作用。 我只在本地主機上嘗試過，而不是在已部署的網站上嘗試過，但我認為它應該仍然有效。
這是我的代碼。
我的 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);
我在這里做錯了什么？
解決方案2
0 2020-08-30 09:48:05
您是否在 html 的頭部包含了 google analytics 的 cdn 鏈接和 js？
解決方案3
0 2020-09-02 11:03:58
您是否嘗試在 index.html 的<head>中添加跟蹤代碼（管理 -> 屬性 -> 跟蹤代碼）？
解決方案4
0 2021-05-18 18:47:28
由於您在useEffect中使用空依賴項數組，因此您的代碼僅在<App/>呈現時執行一次。 因此，您不會發送有關路線更改的綜合瀏覽量。
您需要在 ReactGA 初始化之后，在您的 App 組件之前放置與瀏覽量相關的代碼。 這是docs中的一個使用示例。
解決方案5
0 2022-05-17 09:42:19
我有一個類似的問題嘗試禁用你的廣告塊如果你有它處於活動狀態並將 ReactGA.initialize 放在 useEffect 中
解決方案6
0 2022-08-18 04:16:08
從react-ga更新到react-ga4對我有用。
將導入更改為react-ga4而不是ReactGA.pageview(...)使用ReactGA.send("pageview") 。
解決方案7
0 2022-09-10 18:32:18
從“react-ga4”導入 ReactGA；
ReactGA.initialize("你的測量 id"); ReactGA.send("pageview");
React 的 Google Analytics 設置
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.