Laravel Jetstream 添加谷歌分析答案

【问题标题】：Laravel Jetstream Adding Google AnalyticsLaravel Jetstream 添加谷歌分析
【发布时间】：2021-05-31 17:48:46
【问题描述】：

我正在努力让 Google Analytics 使用 Laravel Jetstream 的 InertiaJS 堆栈正确报告。我需要跟踪单个页面访问，但由于它是一个 SPA，我不确定如何去做。我已将标签放置在我的 app.blade 中，但这会显示所有流量，而不是特定于每个页面，我也无法触发事件。

将 GA 加入 Laravel Jetstream Inertia 堆栈的最佳方法是什么？

【问题讨论】：

标签： laravel vue.js inertiajs jetstream

【解决方案1】：

我选择使用 Inertia::share 然后在我的 app.blade 上我引用了相应的元素，例如标题等作为道具。

例如。 RouteController（返回惯性视图）：

Inertia::share([
            'title' => $title,
            'description' => $description,
            'meta_image' => $meta_image,
            'meta_url' => $meta_url
        ]);
return Inertia::render...

App.blade：

<title>{{$page['props']['title'] ?? ''}}</title>
<meta name="description" content="{{$page['props']['description'] ?? ''}}">
...

最后，在我的 AppLayout.vue 中，我对这些用于页面更改的道具进行了观察：

watch: {
        "$page.props.title"(newTitle) {
            this.setPageData();
        },
        "$page.props.description"(newDescription) {
            this.setPageData();
        },
    },

只需要查看标题，因为机器人应该重新加载每个页面（出于 SEO 目的），但这对于元标记（开放图）和 GA 来跟踪每个页面都很有效。

【讨论】：