数据统计
数据统计
Vergil 内置了 Umami Analytics 数据统计页面,无需离开站点即可查看访问量、来源、设备分布等数据。
效果预览
访问 /stats 路径即可查看数据看板,包含:
- 概览指标 — 浏览量、访客数、访问次数、跳出率、平均停留时长
- 流量趋势 — 按时间粒度展示访问走势(今日按小时、今年按月)
- 热门页面 — 访问量最高的页面排行
- 来源分析 — 访客来源域名分布
- 浏览器 / 设备 / 地区 — 访客环境分布标签云
- 实时在线 — 当前正在浏览的人数
配置方法
编辑 src/data/config/analytics.ts:
export const analytics = {
enabled: true, // ← 总开关,true 启用追踪和统计页面
provider: 'umami' as const,
umami: {
// 在 Umami Cloud 后台获取 Website ID
websiteId: 'your-website-id',
// Umami 追踪脚本地址
scriptUrl: 'https://cloud.umami.is/script.js',
// Umami Cloud API 地址
apiHost: 'https://api.umami.is/v1',
// API Token,在 Umami Cloud 后台生成
apiToken: 'your-api-token',
statsPage: {
path: '/stats',
modules: ['overview', 'trends', 'pages', 'referrers', 'devices', 'locations', 'realtime'],
defaultRange: '7d',
},
},
};
获取凭证
- 注册 Umami Cloud
- 添加网站后,在 Settings → Websites 中获取
Website ID - 在 Settings → API Keys 中生成
API Token - 将凭证填入配置文件中
可选配置
| 配置项 | 类型 | 说明 |
|---|---|---|
statsPage.modules | string[] | 展示的模块,可选值:overview、trends、pages、referrers、devices、locations、realtime |
statsPage.defaultRange | string | 默认时间范围,可选:today、7d、30d、year |
例如,只展示概览和趋势图:
statsPage: {
modules: ['overview', 'trends'],
defaultRange: '30d',
}
注意事项
analytics.enabled是唯一开关,设为false将同时关闭追踪脚本注入和统计页面数据加载- API Token 不要提交到公共仓库,建议生产环境通过环境变量注入
- 站点刚建立时数据较少,各时间范围的数据可能相近,属于正常现象
- 今日视图按小时聚合,年视图按月聚合,其余按天聚合