Google Analytics 跨站点 Cookie 问题
Google Analytics Cross-Site Cookie Issues
由于“问题”选项卡中的错误,我们网站上的 Google 分析使 LightHouse 最佳实践分数下降了 7%。查看“问题”选项卡显示 Google Analytics 发送了 6 个 cookie,但没有设置必要的 SameSite 值。有什么办法可以fix/address这个吗?
在此处的 Google 开发人员文档中找到了深埋的解决方案:
https://developers.google.com/analytics/devguides/collection/analyticsjs/cookies-user-id
通过我自己的一些调整,我想出了这个解决方案:
const gacode = 'UA-XXXXX-Y';
const rootdomain = 'example.com';
const GA_LOCAL_STORAGE_KEY = 'ga:clientId';
const GA_COOKIE_KEY = 'gaCookie';
if (window.localStorage) {
ga('create', gacode, {
storage: 'none',
clientId: window.localStorage.getItem(GA_LOCAL_STORAGE_KEY),
});
ga(function (tracker) {
window.localStorage.setItem(
GA_LOCAL_STORAGE_KEY,
tracker.get('clientId')
);
});
} else {
ga('create', gacode, {
cookieName: GA_COOKIE_KEY,
cookieDomain: rootdomain,
cookieExpires: 60 * 60 * 24 * 28,
cookieUpdate: 'false',
cookieFlags: 'SameSite=None; Secure',
});
};
如果可用,这将通过本地存储以无 cookie 模式使用分析,如果不可用,则将 SameSite 标志添加到 cookie。这可能不是默认设置,因为它限制了跨站点跟踪。
即使使用了预取 dns 和预加载分析脚本等所有技巧,它仍然会使性能下降一点,因为它们的脚本在第二个脚本中动态标记,但要好得多。至少在“问题”选项卡中不再显示“不良做法”。
<link rel="dns-prefetch" href="https://www.google-analytics.com" />
<link
rel="preload"
href="https://www.google-analytics.com/analytics.js"
as="script"
/>
并包括异步脚本
<script async src="https://www.google-analytics.com/analytics.js"></script>
这让我们大部分时间回来了。
希望这个回答对其他人和对我一样有帮助。
由于“问题”选项卡中的错误,我们网站上的 Google 分析使 LightHouse 最佳实践分数下降了 7%。查看“问题”选项卡显示 Google Analytics 发送了 6 个 cookie,但没有设置必要的 SameSite 值。有什么办法可以fix/address这个吗?
在此处的 Google 开发人员文档中找到了深埋的解决方案: https://developers.google.com/analytics/devguides/collection/analyticsjs/cookies-user-id
通过我自己的一些调整,我想出了这个解决方案:
const gacode = 'UA-XXXXX-Y';
const rootdomain = 'example.com';
const GA_LOCAL_STORAGE_KEY = 'ga:clientId';
const GA_COOKIE_KEY = 'gaCookie';
if (window.localStorage) {
ga('create', gacode, {
storage: 'none',
clientId: window.localStorage.getItem(GA_LOCAL_STORAGE_KEY),
});
ga(function (tracker) {
window.localStorage.setItem(
GA_LOCAL_STORAGE_KEY,
tracker.get('clientId')
);
});
} else {
ga('create', gacode, {
cookieName: GA_COOKIE_KEY,
cookieDomain: rootdomain,
cookieExpires: 60 * 60 * 24 * 28,
cookieUpdate: 'false',
cookieFlags: 'SameSite=None; Secure',
});
};
如果可用,这将通过本地存储以无 cookie 模式使用分析,如果不可用,则将 SameSite 标志添加到 cookie。这可能不是默认设置,因为它限制了跨站点跟踪。
即使使用了预取 dns 和预加载分析脚本等所有技巧,它仍然会使性能下降一点,因为它们的脚本在第二个脚本中动态标记,但要好得多。至少在“问题”选项卡中不再显示“不良做法”。
<link rel="dns-prefetch" href="https://www.google-analytics.com" />
<link
rel="preload"
href="https://www.google-analytics.com/analytics.js"
as="script"
/>
并包括异步脚本
<script async src="https://www.google-analytics.com/analytics.js"></script>
这让我们大部分时间回来了。
希望这个回答对其他人和对我一样有帮助。