GoatCounter 前端接入指南:count.js 脚本的设置、数据参数与 API 方法全解析
数据分析后端【免费下载链接】goatcounterEasy web analytics. No tracking of personal data.项目地址https://gitcode.com/gh_mirrors/go/goatcounter点击查看免费下载GoatCounter 是一款强调隐私保护的轻量级网页统计工具Easy web analytics. No tracking of personal data.而其官方推荐的主流接入方式就是本文要讲解的count.js前端脚本。本文以 tpl/help/js.md 为骨架结合 public/count.js 与 public/count.v5.js 的源码实现、handlers/count.go 的后端接收逻辑系统讲解如何在你的站点中引入count.js、通过data-goatcounter-settings属性与window.goatcounter对象配置统计行为、定制上报数据并掌握count()、url()、filter()、bind_events()、get_query()等核心方法。读完后你可以在自己的网站上完成从基础埋点到事件跟踪、自定义路径、本地测试的完整接入方案。为什么优先使用 count.js将 GoatCounter 添加到网站的主要方式就是使用count.js脚本这也是迄今为止最简单的集成方式。脚本默认托管在http://gc.zgo.at/count.js正式部署时通常使用 https你也可以自行托管或将脚本内容直接内联进页面——相关说明见 tpl/help/countjs-host.md。此外还有带子资源完整性SRI校验的稳定版本可供选择见 tpl/help/countjs-versions.md。一个值得注意的设计决策是该脚本按设计以未压缩unminified形式下发便于任何人轻松审查其行为。脚本本身不大约 3.2KB压缩后也只能省下约 1KB收益有限因此选择了透明可读。这一点与项目隐私透明、代码可审计的理念一致。脚本加载后会向window.goatcounter暴露一系列设置项与方法。从服务端角度看脚本最终会把数据以查询参数的形式发送到/count端点由 handlers/count.go 中的backend.count处理器接收并写入内存存储goatcounter.Memstore.Append(hit)随后在后台任务中落库。设置Settings两种配置方式与全部支持项配置count.js最直接的方式是给script标签加上data-goatcounter-settings属性也可以直接在window.goatcounter上赋值。两种方式效果一致下面分别演示。方式一data-goatcounter-settings 属性例如允许来自本机/内网的请求用于本地联调测试集成script>var s document.querySelector(script[data-goatcounter]) if (s s.dataset.goatcounterSettings) { try { var set JSON.parse(s.dataset.goatcounterSettings) } catch (err) { console.error(invalid JSON in>script // 这段必须放在 count.js 加载 *之前*否则页面浏览可能已发出 // 而且这里的赋值会直接覆盖脚本建立的对象。 window.goatcounter {allow_local: true} /script script>设置说明no_onload页面加载时不执行任何操作不自动上报适用于你想手动调用count()的场景同时也不会绑定任何事件。no_events不自动绑定事件点击跟踪。allow_local允许来自本地地址localhost、192.168.0.0等的请求用于在本地测试集成。allow_frame允许页面处于 frame/iframe 中时上报。endpoint自定义上报页面浏览的端点会覆盖data-goatcounter里的 URL。仅在设置了no_onload时有用。关于endpoint的补充说明对照源码 public/count.js端点的解析优先级是document.querySelector(script[data-goatcounter]).dataset.goatcounter优先找不到data-goatcounter属性时才回退到goatcounter.endpoint。也就是说data-goatcounter属性永远优先于 JS 中设置的endpoint——如果你在 JS 里定制 endpoint就不要在 script 标签上写data-goatcounter。动态按主机名切换端点的完整示例见 tpl/help/modify.md。数据参数Data Parameters定制上报内容你可以自定义发送给 GoatCounter 的数据。有一个关键规则需要牢记默认值仅在值为null或undefined时生效空字符串、数字0或其他任何值都不会触发默认值对照源码中的is_empty判断v null || v undefined || typeof(v) function见 public/count.js。数据参数还支持回调函数默认值会作为参数传入回调回调的返回值才会真正发送到服务端。特别地如果path的回调返回null则完全不会发送任何页面浏览。变量说明path页面路径不含域名或事件名称。默认取link relcanonical的值若存在否则取location.pathname location.search。title人类可读的标题。默认是document.title。referrer访客来源可以是 URL如https://example.com或任意字符串如June Newsletter。默认使用Referer请求头。event将path视为事件而非 URL。布尔值。no_session本次页面浏览不跟踪会话这样即使刷新页面也始终计数。主要用于事件跟踪如统计每一次按钮点击。一般不建议用于普通页面浏览。示例总是上报 /helloscript>script window.goatcounter {path: /hello} /script script>var data { p: (vars.path undefined ? goatcounter.path : vars.path), // path r: (vars.referrer undefined ? goatcounter.referrer : vars.referrer), // referrer t: (vars.title undefined ? goatcounter.title : vars.title), // title e: !!(vars.event || goatcounter.event), // 是否为事件 s: window.screen.width, // 屏幕宽度 b: is_bot(), // 疑似 bot 的标识 q: location.search, // 原始查询串 }处理流程是先取出 path/referrer/title 的值若是函数则暂存为回调再对空值null/undefined/函数套用默认值document.referrer、document.title、get_path()最后依次执行回调。no_session在 vars 中单独处理为真时追加ns参数。默认path的取法get_path()public/count.js会优先检查同域允许www子域差异的link relcanonical否则回退到当前location.pathname location.search。这与 tpl/help/path.md 中关于 canonical URL 与自定义 path 的说明相互印证。更多高级示例在发送前修改数据的更多高级用法如去掉首页跟踪、去掉.html后缀、按主机名动态切换端点见 tpl/help/modify.md控制发送路径的专项文档见 tpl/help/path.md。方法Methods手动控制上报与过滤count.js以async方式加载因此默认情况下你的脚本运行时它可能尚未加载完毕。要安全地使用下面的方法要么去掉async要么用一个简单的轮询回调var t setInterval(function() { if (!window.goatcounter || !window.goatcounter.count) return clearInterval(t) // 在这里安全地使用 goatcounter。 }, 100)count(vars)发送一个页面浏览或事件到 GoatCounter。vars参数即上文数据参数一节描述的对象会被合并进全局的window.goatcounter若其存在。对照 public/count.jscount()的实际执行链路为先调用goatcounter.filter()若返回过滤原因则console.warn(goatcounter: not counting because of: f)并放弃调用goatcounter.url(vars)生成上报 URL若path回调返回了null则提示后放弃优先使用navigator.sendBeacon(url)发送页面卸载时更可靠若sendBeacon不存在或返回false例如被 CSP 内容安全策略拦截则回退为在页面底部插入一张1px透明 GIF 图片请求img.src url并把alt、aria-hiddentrue以保证可访问性与布局影响最小源码见 public/count.js。url(vars)生成将要发送给服务器的 URLvars参数行为与count()一致。由 public/count.js 可知它会调用get_data()组装参数并在查询串中追加一个 5 位随机字符串rnd源码注释解释浏览器不总是遵守 Cache-Control加随机数是为了绕过缓存若找不到端点则warn(no endpoint found)。注意使用url()时你可能仍希望调用filter()来排除预渲染prerender请求及其他各类情况避免把不该计数的请求算进去。filter()判断本次请求是否应被过滤返回一个说明原因的字符串无需过滤时返回false。对照 public/count.js 的完整过滤逻辑它按顺序检查document.visibilityState prerender→ 返回visibilityState预渲染不计页面处于 frame/iframe 且未设置allow_frame→ 返回frame主机名匹配本地地址localhost、127.、10.、172.(16-31).、192.168.、0.0.0.0且未设置allow_local→ 返回localhostfile:协议且未设置allow_local→ 返回localfilelocalStorage中被标记了skipgc t通过#toggle-goatcounter开关→ 返回disabled with #toggle-goatcounter以上均不命中 → 返回false。示例用法var f goatcounter.filter() if (f) { if (console log in console) console.warn(goatcounter: not counting because of: f) return }补充脚本里还内置了一个跳过自己的访问的便捷开关——当location.hash #toggle-goatcounter时切换localStorage中的skipgc标记见 public/count.js。bind_events()为所有带data-goatcounter-click属性的元素绑定点击事件。页面加载时会自动调用除非设置了no_onload或no_events。如果你在页面加载后动态插入元素需要手动调用它。对照 public/count.js绑定逻辑是遍历所有*[data-goatcounter-click]元素跳过已标记goatcounterBound的同时绑定click和auxclick中键点击并把事件名、标题、referrer 一起上报。点击事件的完整用法包括data-goatcounter-click、data-goatcounter-title、data-goatcounter-referrer、data-goatcounter-no-session等属性见 tpl/help/events.md。get_query(name)从当前页面 URL 获取单个查询参数不存在时返回undefined。常用于从 URL 中提取referrer例如script window.goatcounter { referrer: function() { return goatcounter.get_query(ref) || goatcounter.get_query(utm_campaign) || goatcounter.get_query(utm_source) || document.referrer }, } /script script>script>script window.goatcounter {endpoint: {{.SiteURL}}/count} // [.. count.js 的内容 ..] /script自托管不会收到新功能或更新但/count端点保证长期兼容因此脚本永远不会失效。小结count.js的设计处处体现简单 可审计 隐私友好脚本未压缩以便审查通过data-goatcounter-settings或window.goatcounter提供统一配置入口filter()从源头过滤掉预渲染、iframe、本地地址等噪声get_data()对空值、回调、canonical 路径做了细致的默认值处理上报时优先sendBeacon、失败回退 1px 图片请求。配合 tpl/help/events.md 的事件跟踪、tpl/help/modify.md 的数据改写示例和 tpl/help/countjs-versions.md 的版本策略你可以按需组合出从一行埋点到精细事件统计的完整接入方案。如需深入后端行为可以继续阅读接收上报的 handlers/count.go含 bot 检测、IP 忽略列表、Collect选项下的地理位置与语言解析等逻辑。赞分享数据分析后端【免费下载链接】goatcounterEasy web analytics. No tracking of personal data.项目地址https://gitcode.com/gh_mirrors/go/goatcounter点击查看免费下载相关推荐GoatCounter 自托管 count.js 完整指南内嵌脚本与 endpoint 配置实战GoatCounter 自托管 count.js 完整指南内嵌脚本与 endpoint 配置实战 导读 本文聚焦 GoatCounter 官方文档中关于 自托数据分析后端matplotlib 高阶统计图表实战气泡图、面积图、雷达图、玫瑰图与 3D 曲面图绘制指南matplotlib 高阶统计图表实战气泡图、面积图、雷达图、玫瑰图与 3D 曲面图绘制指南 在 Python 100 天学习路线的数据可视化章节中 Day数据分析后端MarkItDown 文件转Markdown教程3分钟装好20格式一次到位MarkItDown 文件转Markdown教程3分钟装好20格式一次到位 MarkItDown 是一个轻量级 Python 工具负责把 PDF、Wor人工智能AI 应用MCP 服务上一篇如何用雀魂牌谱屋快速提升麻将水平从战绩查询到安定段位的完整数据分析指南下一篇香山 XiangShan 处理器贡献指南Bug 报告、提交规范与 PR 自动化标签全解析创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考

相关新闻

Django-基于RestNet50的猕猴桃叶病害识别分类系统-大数据开发大数据专业毕业设计

Django-基于RestNet50的猕猴桃叶病害识别分类系统-大数据开发大数据专业毕业设计

猕猴桃作为一种富含维生素 C 等多种营养成分的水果,在全球水果市场中占据着重要地位。中国是猕猴桃的原产国,也是种植和生产大国。然而,猕猴桃在生长过程中极易受到多种病害的侵袭,尤其是猕猴桃叶病害,严重影响了猕猴桃…

2026/10/11 13:13:46 阅读更多 →
我用两行命令,让 Codex、Claude Code、Grok Build 全部跑上了 DeepSeek、Kimi、Qwen——OpenCodex 深度实战指南

我用两行命令,让 Codex、Claude Code、Grok Build 全部跑上了 DeepSeek、Kimi、Qwen——OpenCodex 深度实战指南

文章目录 一、先讲个扎心的故事 二、它到底能让你干什么?——功能全景图 三、5 分钟极速上手 3.1 安装条件 3.2 三条命令跑起来 3.3 交互式初始化 3.4 停止——干净到没有残留 四、架构拆解:这个代理内部到底长什么样? 五、核心功能逐个击破 5.1 模型路由:`provider/model`…

2026/10/10 8:57:33 阅读更多 →
408复试机试Day8复盘:计组模拟与图数组代码实战

408复试机试Day8复盘:计组模拟与图数组代码实战

408复旦机试复试学习Day8——说实话,前三天我还处于“机试到底考什么”的焦虑里,今天才算真正把节奏踩稳了。这篇不是攻略,就是一份第8天的真实备考复盘:我今天干了一件事,就是围绕408机试把两个最核心的板块——计算机…

2026/10/11 10:57:33 阅读更多 →

最新新闻

Django+Vue外卖点餐系统毕设指南:从建表到联调全流程

Django+Vue外卖点餐系统毕设指南:从建表到联调全流程

简介:一套基于Python Django与Vue.js开发的外卖点餐系统毕业设计项目,采用B/S架构,适合计算机相关专业学生作为毕业设计或课程设计参考。前端覆盖首页、菜品详情、订单中心、用户中心等核心用户场景;后台提供总览、订单管理、菜品…

2026/10/11 13:14:52 阅读更多 →
如何在 Virtual Mac 上 5 分钟装好 macOS:新手保姆级快速上手教程

如何在 Virtual Mac 上 5 分钟装好 macOS:新手保姆级快速上手教程

【免费下载链接】VirtualMacOniPad People have dreamed of running macOS on iPad for more than a decade. Today, that dream comes true. With Virtual Mac, iPad finally breaks free from iPadOS, enabling pro apps like Xcode, Terminal, Final Cut Pro, Logic Pro, an…

2026/10/11 13:14:52 阅读更多 →
Kubernetes弹性伸缩实战:HPA、VPA与Cluster Autoscaler原理与配置

Kubernetes弹性伸缩实战:HPA、VPA与Cluster Autoscaler原理与配置

这两年只要跟Kubernetes沾边的团队,几乎都会聊到弹性伸缩。我这些年在一线折腾过不少集群,从最早以为加个 HPA 就万事大吉,到后来被线上抖动、扩容滞后和成本账单来回折磨,才算是把这一整套机制吃透。Kubernetes弹性伸缩实际上不是…

2026/10/11 13:14:52 阅读更多 →
Kubernetes弹性伸缩实战:HPA、VPA、CA与KEDA解析

Kubernetes弹性伸缩实战:HPA、VPA、CA与KEDA解析

做 Kubernetes 这行绕不开的话题就是弹性伸缩。很多人觉得只要部署到集群里,流量大了自然就能扩容,结果一到促销或者突发流量就被报警轰醒,才发现 Pod 数量没有动,节点也快被打满了。原因很简单,Kubernetes 的弹性伸缩…

2026/10/11 13:14:52 阅读更多 →
把CIContext存进@State?SwiftUI-Agent-Skill的“状态即缓存“高级技巧解析

把CIContext存进@State?SwiftUI-Agent-Skill的“状态即缓存“高级技巧解析

【免费下载链接】SwiftUI-Agent-Skill SwiftUI agent skill for Claude Code, Codex, and other AI tools. 项目地址: https://gitcode.com/GitHub_Trending/swi/SwiftUI-Agent-Skill 点击查看 免费下载 SwiftUI-Agent-Skill(技能名 SwiftUI Pro&#x…

2026/10/11 13:14:52 阅读更多 →
健身动作错误归因数据集:专注关节抖动、遮挡漂移与小目标定位

健身动作错误归因数据集:专注关节抖动、遮挡漂移与小目标定位

简介:本资源是面向计算机视觉开发者与运动健康AI研究者的健身动作关键点检测专用数据集,聚焦于自下而上类动作识别与姿态评估,解决健身动作自动判别、姿势纠错与虚拟教练系统构建等核心问题。数据集共1758张真实场景图像(含训练/验…

2026/10/11 13:13:51 阅读更多 →

日新闻

流感时间序列预测实战:ARIMA/LSTM全流程拆解与避坑指南

流感时间序列预测实战:ARIMA/LSTM全流程拆解与避坑指南

简介:基于 ARIMA、LSTM、Transformer 等模型的流感时间序列预测 Python 源码,面向计算机相关专业课程设计与期末大作业学生,以及项目实战学习者。内容覆盖预处理、平稳性检验、定阶、残差分析、多模型对比预测的完整时序建模流程,…

2026/10/11 0:00:27 阅读更多 →
影刀RPA新手教程:键盘模拟输入实战——输入文本与模拟按键的区别

影刀RPA新手教程:键盘模拟输入实战——输入文本与模拟按键的区别

影刀RPA新手教程:键盘模拟输入实战——输入文本与模拟按键的区别 做影刀RPA自动化,十个新手有八个栽在"往输入框里填东西"这件事上:要么填不进去,要么填了一半,要么直接把原来内容追加在后面。这背后的根因&…

2026/10/11 0:00:27 阅读更多 →
影刀RPA新手教程:阅文起点小说数据采集实战——书籍信息与章节内容

影刀RPA新手教程:阅文起点小说数据采集实战——书籍信息与章节内容

影刀RPA新手教程:阅文起点小说数据采集实战——书籍信息与章节内容 1. 认识影刀:什么场景该用RPA采小说数据 起点中文网的页面结构相对稳定——分类榜单、书籍详情、章节内容三块独立页面,跳转链路清晰。这种场景非常适合影刀自动化&#x…

2026/10/11 0:00:27 阅读更多 →

周新闻

流感时间序列预测实战:ARIMA/LSTM全流程拆解与避坑指南

流感时间序列预测实战:ARIMA/LSTM全流程拆解与避坑指南

简介:基于 ARIMA、LSTM、Transformer 等模型的流感时间序列预测 Python 源码,面向计算机相关专业课程设计与期末大作业学生,以及项目实战学习者。内容覆盖预处理、平稳性检验、定阶、残差分析、多模型对比预测的完整时序建模流程,…

2026/10/11 0:00:27 阅读更多 →
影刀RPA新手教程:键盘模拟输入实战——输入文本与模拟按键的区别

影刀RPA新手教程:键盘模拟输入实战——输入文本与模拟按键的区别

影刀RPA新手教程:键盘模拟输入实战——输入文本与模拟按键的区别 做影刀RPA自动化,十个新手有八个栽在"往输入框里填东西"这件事上:要么填不进去,要么填了一半,要么直接把原来内容追加在后面。这背后的根因&…

2026/10/11 0:00:27 阅读更多 →
影刀RPA新手教程:阅文起点小说数据采集实战——书籍信息与章节内容

影刀RPA新手教程:阅文起点小说数据采集实战——书籍信息与章节内容

影刀RPA新手教程:阅文起点小说数据采集实战——书籍信息与章节内容 1. 认识影刀:什么场景该用RPA采小说数据 起点中文网的页面结构相对稳定——分类榜单、书籍详情、章节内容三块独立页面,跳转链路清晰。这种场景非常适合影刀自动化&#x…

2026/10/11 0:00:27 阅读更多 →

月新闻

我发现了一个新思路:用 Remotion + Claude Code 像写代码一样自动化生成短视频

我发现了一个新思路:用 Remotion + Claude Code 像写代码一样自动化生成短视频

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

2026/10/11 10:45:37 阅读更多 →
Windows下 Codex 中 Chrome 和 Computer Use 插件不可用问题排查及解决参考方式:TaoToken 统一 Key 配置与验证

Windows下 Codex 中 Chrome 和 Computer Use 插件不可用问题排查及解决参考方式:TaoToken 统一 Key 配置与验证

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

2026/10/9 21:32:20 阅读更多 →
黑夜航拍船只数据集训练YOLOV5模型全流程解析

黑夜航拍船只数据集训练YOLOV5模型全流程解析

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

2026/10/10 10:38:42 阅读更多 →