十分钟给静态页面加上分析
Ghost 自带的 Web Analytics(基于 Tinybird)非常好用。但问题是——它只统计 Ghost 博客自己的页面。如果你像我一样把博客迁移到 /blog/ 子路径,然后在根路径放了独立的 Landing / About / Cases 页面,这些静态页面的访问数据 Ghost 是不知道的。
Ghost 自带的 Web Analytics(基于 Tinybird)非常好用。但问题是——它只统计 Ghost 博客自己的页面。如果你像我一样把博客迁移到 /blog/ 子路径,然后在根路径放了独立的 Landing / About / Cases 页面,这些静态页面的访问数据 Ghost 是不知道的。
这篇文章记录了我怎么花十分钟解决这件事。
先看 Ghost 的分析怎么工作的
打开浏览器开发者工具,看看 Ghost 博客页面加载了什么:
<script defer src="/blog/public/ghost-stats.min.js?v=3d251a135e"
data-stringify-payload="false"
data-datasource="analytics_events"
data-storage="localStorage"
data-host="https://<你的域名>/.ghost/analytics/api/v1/page_hit"
tb_site_uuid="<你的站点UUID>"
tb_post_uuid="..."
tb_post_type="post"
tb_member_uuid="..."
tb_member_status="...">
</script>核心逻辑很简单: 1. 加载 ghost-stats.min.js(Ghost 官方提供的前端统计脚本) 2. 脚本从标签属性里读取配置:API 地址、站点 ID、页面类型等 3. 页面加载后发送 page_hit 事件到 data-host 指定的端点 4. Ghost 的服务端把这个事件转发到 Tinybird
关键发现:这个脚本不依赖 Ghost 运行时。它就是一个独立的前端统计脚本。那就好办了。
给静态页面加上
我只需要把同样的 <script> 标签复制到三个静态页面的 <head> 里,改几个参数就行:
<script defer src="/blog/public/ghost-stats.min.js?v=3d251a135e"
data-stringify-payload="false"
data-datasource="analytics_events"
data-storage="localStorage"
data-host="https://<你的域名>/.ghost/analytics/api/v1/page_hit"
tb_site_uuid="<你的站点UUID>"
tb_post_type="page" <!-- 改成 page,区别于博客文章 -->
tb_member_uuid="undefined"
tb_member_status="undefined">
</script>改动点: - tb_post_type 从 "post" 改为 "page" —— 方便在 Tinybird 里区分来源 - tb_post_uuid 去掉 —— 静态页面没有文章 ID - tb_member_uuid 和 tb_member_status 设为 undefined —— 静态页面没有会员系统
同一个 tb_site_uuid、同一个 data-host,所有数据会进入同一个 Tinybird analytics_events 数据源。
部署到线上
SSH 连上服务器,把三个文件推上去:
scp index.html user@<你的域名>:/path/to/site/index.html
scp about/index.html user@<你的域名>:/path/to/site/about/index.html
scp cases/index.html user@<你的域名>:/path/to/site/cases/index.html验证一下:
curl -s https://<你的域名>/ | grep ghost-stats
# <script defer src="/blog/public/ghost-stats.min.js?v=3d251a135e"
curl -s https://<你的域名>/about/ | grep ghost-stats
# <script defer src="/blog/public/ghost-stats.min.js?v=3d251a135e"
curl -s https://<你的域名>/cases/ | grep ghost-stats
# <script defer src="/blog/public/ghost-stats.min.js?v=3d251a135e"全部正常加载。总耗时不到十分钟。
事后想想
这事的本质是:Ghost 的 Tinybird 集成方案本身就是前端脚本 + 后端代理的组合。前端脚本可以独立运行,后端代理只负责转发。只要 nginx 配置正确(/blog/ 子路径下的静态资源能正常访问),任何页面都能复用这套分析能力。
如果你的 Ghost 博客也有独立静态页面,这个方案可以直接抄。
2026-06-23 更新
文章里说去掉 tb_post_uuid,但后来 Ghost Analytics 容器升级到了 1.0.244 版本,对 payload 做了严格 schema 校验——post_uuid 是必填字段。空字符串不行,必须是有效的 UUID 或者字面字符串 "undefined"。所以静态页面的追踪脚本应该改成:
评论 ()