上线统计
用 Cloudflare Web Analytics 做早期访问统计，并判断什么时候再接入应用内事件分析。
上线后的第一件事，不是立刻接一整套复杂埋点，而是先确认三件事：
- 生产域名有没有真实访问。
- 哪些页面有人看，来源从哪里来。
- 页面性能在真实用户浏览器里是否正常。
如果域名已经接入 Cloudflare，早期优先使用 Cloudflare Web Analytics。它更像上线后的轻量观测面板，不需要先改业务代码，也不需要配置 VITE_* 环境变量。
和应用内统计的区别
| 场景 | 推荐工具 | 放在哪里配置 |
|---|---|---|
| 看 PV、访客、来源、热门页面、真实用户性能 | Cloudflare Web Analytics | Cloudflare Dashboard |
| 看自定义事件、注册转化、支付漏斗 | Umami / GA4 / PostHog | 应用代码或第三方脚本 |
| 看服务端错误、接口异常、部署日志 | 部署平台日志 + 日志系统 | Zeabur / Cloudflare / 应用日志 |
Cloudflare Web Analytics 不替代应用内事件分析。等产品开始有注册、付费、上传、AI 生成等关键动作，再按 应用数据统计 接入 Umami、GA4 或其他事件分析工具。
Cloudflare Web Analytics 当前不支持自定义事件，也不记录 query string，所以不要用它做 UTM campaign 归因。需要精细渠道和转化分析时，改用应用内事件统计。
推荐配置方式
01MVP 默认推荐 Zeabur + Cloudflare。应用跑在 Zeabur，Cloudflare 作为域名入口、HTTPS、WAF 和轻量统计层。
确认域名走 Cloudflare 代理
在 Cloudflare DNS 中，把正式域名的 A 或 CNAME 记录设为 Proxied，也就是打开橙色云朵。
只有流量经过 Cloudflare，Cloudflare 才能自动把 Web Analytics beacon 注入页面。灰色云朵的 DNS only 只是 DNS 解析，不能使用自动注入。
添加 Web Analytics 站点
进入 Cloudflare Dashboard 的 Web Analytics，选择 Add a site，从下拉框选择你的生产 hostname。
对于已经开启小橙云的站点，Cloudflare 会默认启用自动配置，自动在 HTML 响应中注入 beacon 脚本。
等待数据出现
配置完成后访问生产域名。Cloudflare Web Analytics 数据通常需要几分钟后才会出现在 Dashboard。
验证生产页面
打开浏览器 DevTools，确认页面请求里出现 beacon.min.js，并且指标会上报到 /cdn-cgi/rum。
如果响应头里设置了 Cache-Control: public, no-transform，Cloudflare 不能修改 HTML 响应，也就不能自动注入 Web Analytics beacon。遇到没有数据时先检查这个响应头。
TanStack Start 和 SPA 路由
01MVP 使用 TanStack Router，不是 hash 路由。Cloudflare Web Analytics 可以自动跟踪基于 History API 的 SPA 路由变化，所以文档页、登录页、后台页之间的前端跳转也能记录为页面访问。
如果你未来改成 hash-based router，Cloudflare Web Analytics 不会自动识别 hash 路由变化，需要改回 History API 路由，或改用应用内统计方案。
什么时候还要接 Umami 或 GA4
只想确认网站有没有人访问时，Cloudflare Web Analytics 足够。
下面这些情况需要应用内事件统计：
- 想知道用户点击了哪个 CTA。
- 想统计注册、登录、购买、上传、AI 生成的转化漏斗。
- 想按用户状态、会员等级、来源渠道分析行为。
- 想把事件发到自己的后台或数据仓库。
这时再打开 应用数据统计，选择 Umami、GA4、PostHog 或其他工具。不要为了几个访问量指标一开始就把多个统计脚本都塞进页面。
常见问题
要不要手动把 Cloudflare 脚本写进项目？
如果正式域名已经走 Cloudflare 代理，不需要。自动配置会把 beacon 注入 HTML 响应。
只有 DNS-only、没有走 Cloudflare 代理，或者你明确关闭自动注入时，才需要手动添加 Cloudflare 提供的 JS snippet。
为什么看到 /cdn-cgi/rum 的 405？
Cloudflare 的 RUM 端点只接受 beacon 发出的 POST 请求。浏览器地址栏、爬虫或测试工具用 GET 请求它时会返回 405。只要正常页面里的 beacon 上报成功，这类 405 通常不用当成应用错误。
CSP 需要改吗？
如果网站没有设置 CSP，可以不管这一项。
01MVP 模板默认带 CSP 安全头。CSP 会限制浏览器加载哪些外部脚本，所以即使 Cloudflare 成功自动注入了 beacon，浏览器也可能因为 CSP 拦掉它。模板已经在 script-src 放行 https://static.cloudflareinsights.com，这就是 Cloudflare Web Analytics 的脚本来源。
小橙云自动注入时，数据会上报到当前域名下的 /cdn-cgi/rum，模板现有的 connect-src 'self' 已经覆盖。只有 DNS-only 站点手动粘贴 Cloudflare snippet 时，才需要额外把 https://cloudflareinsights.com 加到 connect-src。
相关资源
这篇文档有问题？