如果你给博客启用了统计代码,那么在本地测试的时候,统计代码也会运行,带来大量 localhost 的无效访问记录,影响数据准确性。同时,我还有一个测试用的域名,我在访问这个域名的时候,也不想触发统计代码。
那么,如何让统计代码只在我的生产域名 blog.yfi.moe 上运行呢?
前置知识#
本文的方法只对使用这类方法添加的跟踪代码有效。如果使用的是主题提供的方法,可能需要自行修改主题文件,不在本文讨论范围之内。
修改#
先贴成品吧:
这样的 js 代码被注入之后,只会在目前域名为 `blog.yfi.moe
<script>
var host = window.location.host;
if (host == "blog.yfi.mo") {
// google analytics 1
(function () {
var ggtag = document.createElement('script');
ggtag.async = true;
ggtag.src = 'https://www.googletagmanager.com/gtag/js?id=G-*******'; // 修改这里的 G- 代码
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(ggtag, s);
})();
//google analytics 2
window.dataLayer = window.dataLayer || [];
function gtag() { dataLayer.push(arguments); }
gtag('js', new Date());
gtag('config', 'G-********'); // 修改这里的 G- 代码
// umami
(function() {
var analytics = document.createElement('script');
analytics.async = true;
analytics.src = 'https://change-to-your.domain/script.js'; // 修改为自己的域名
analytics.setAttribute('data-website-id', 'e0****a7-****-****-****-88e5****5132'); // 改为你的跟踪 id
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(analytics, s);
})();
}
</script>
简单的说,就是要在执行代码之前做一个判断,如果当前网页的域名是 blog.yfi.moe
则运行统计代码的 script,否则不运行。
问了下 ChatGPT,如何获取当前的域名,答曰使用 window.location.host
方法,再问,如何将 <script async src="https://www.googletagmanager.com/gtag/js?id=G-*******"></script>
这类 script 转为纯 js 的样式,答曰:
(function () {
var ggtag = document.createElement('script');
ggtag.async = true;
ggtag.src = 'https://www.googletagmanager.com/gtag/js?id=G-*******';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(ggtag, s);
})();
有点怪,应该不是最优方案,但是试下来可以用,虽然不知道 async 到底有没有起到作用,就这样吧。
Google 给的代码有两段,第二段本身就是 js,直接用就行
umami 的代码也是同理。