google-analytics - SvelteKit 谷歌分析双重报告

Question

我正在寻找正确的设置方式在我的 sveltekit 应用程序中启用谷歌分析。

app.html

<script async src="https://www.googletagmanager.com/gtag/js?id=TRACKING_ID"></script>
<script>
    window.dataLayer = window.dataLayer || [];
    function gtag() {
            window.dataLayer.push(arguments);
    }
    gtag('js', new Date());
    gtag('config', 'TRACKING_ID');
</script>

__layout.svelte

$: {
        console.log('page: ' + $page.url.pathname);
        if (typeof gtag !== 'undefined') {
            console.log('callign gtag: ' + $page.url.pathname);
            gtag('config', trackingId, {
                page_path: $page.url.pathname
            });
        }
    }

它工作正常，唯一的问题是双重报告

我可以看到一个页面两次而不是一次 :(

可以帮帮我吗？

Answer 1

我使用这个脚本。我是从一个 Youtuber 上找到的，但我不记得要引用的 channel 。

我将其导入 __layout.svelte。这有助于在生产环境中启动 gtag 并正确引用访问过的页面。

<script>

import { page } from '$app/stores';


    $: if (typeof gtag !== 'undefined' && import.meta.env.PROD == true) {
        if ($page.query.toString().length > 0) {
            gtag('config', 'GA_MEASUREMENT_ID', {
                page_path : $page.path,
                page_location: `${$page.host}${$page.path}?${$page.query}`,
            });
        } else {
            gtag('config', 'GA_MEASUREMENT_ID', {
                page_path : $page.path,
                page_location: `${$page.host}${$page.path}`,
            });
        }
    }


</script>