首页 > 解决方案 > 在 React 中,使用 Google Analytics 根据浏览量跟踪排名靠前的用户

问题描述

我正在使用ReactGA在我们的 React 应用程序中设置一些用户和活动跟踪。我们的 App.js 的顶部目前看起来像这样:

imports...
function App() {

    // Initialize Google Analytics
    useEffect(() => { // Initialize Once
        ReactGA.initialize(config.gaTrackingId);
    }, []);

    // Track Pageview on Page Change
    useEffect(() => { // Set pageview on each different pathname
        ReactGA.pageview(window.location.pathname + window.location.search);
    }, [window.location.pathname]);

    // Setup User Login
    const [isUserLoading, setIsUserLoading] = useState(true);
    const [userData, setUserData] = useState({ token: undefined, user: undefined });
    // console.log('userData: ', userData);

    // Check User Is Logged In
    // run this once to verify if user is logged in
    useEffect(() => {
        const checkLoggedIn = async () => {
            ...
            // If Valid Token, Set User Info
            if (userIsLoggedIn === true) {
                ...
                // Set userId for Google Analytics
                ReactGA.set({ userId: userResponse.data.id });
                ...
            }
        };

        checkLoggedIn();
    }, []);

    // return routes
}

上面代码中的最后一个 useEffect 用于检查用户是否登录网站,通过保存在 localStorage 中的令牌。如果它发现用户已登录,它会运行ReactGA.set({ userId: userResponse.data.id });,它会设置 userId。

那么问题是 - 在我的 Google Analytics(分析)仪表板中,我如何/在哪里可以看到基于userId?看到这个细分userId是巨大的,因为它会让我了解有多少用户在我们的网站上实际活跃。了解我们的 1000 次总浏览量是仅来自 2 个用户还是来自 50 个用户,这对我们来说很重要。

在此处输入图像描述

暂时忽略我们没有用户,但是从仪表板的角度来看,我很迷茫,它在哪里提供了用户细分,如果有的话。

编辑 1

此外,似乎没有正确计算综合浏览量。只有在我刷新应用程序时才会计算网页浏览量。目前,如果我在不刷新的情况下从一个页面导航到另一个页面,这些页面不计入综合浏览量,但我认为它们应该算作单独的综合浏览量。也许useEffect上面代码中的第二个有问题?

标签: reactjsgoogle-analytics

解决方案


首先,您不能userId在 Google Analytics(分析)报告中用作维度。GA 在内部使用它来调整users指标并考虑跨设备使用情况。其次,请确保您在运行set命令之前,pageview否则相应的数据未设置为 GA。第三,您可以使用 GA 标准参与度报告来检查浏览量深度分布事件,而无需实施用户 ID 跟踪,请参见此处的示例https://nimb.ws/nMVySK。此外,您可以使用pageviews > XX有条件的细分来调查重度用户行为。第四,确保ReactGA.pageview每次将访问者导航到新路线时都在调用,并referrer按照此处的建议注意正确的参数值https://developers.google.com/analytics/devguides/collection/analyticsjs/single-page-applications


推荐阅读