Umami 统计配置

Fumomo-Nuxt 内置了对 Umami 访问统计的支持。Umami 是一个简单、快速、注重隐私的开源网站分析工具。

快速开始

第一步：获取 API 密钥

访问 Umami Cloud
注册或登录你的账户
进入 Settings → API Keys
创建新密钥并复制保存

第二步：获取网站 ID

在 Umami Cloud 中添加你的网站
在网站设置中找到 Website ID
复制网站 ID

第三步：配置项目

打开 app/config/index.ts，找到 umami 配置部分并填入你的信息：

umami: {
    enable: true,                          // 是否启用统计
    apiKey: "your-api-key-here",           // 你的 API 密钥
    websiteId: "your-website-id-here",     // 你的网站 ID
    apiEndpoint: "https://api.umami.is",   // Umami Cloud API 地址
}

第四步：更新跟踪脚本

打开 app/layouts/default.vue，更新 data-website-id：

script: [
  {
    defer: true,
    src: 'https://cloud.umami.is/script.js',
    'data-website-id': 'your-website-id-here'  // 使用你的网站 ID
  }
]

配置选项说明

选项	类型	说明
`enable`	boolean	是否启用 Umami 统计显示
`apiKey`	string	Umami Cloud API 密钥
`websiteId`	string	网站唯一标识符
`apiEndpoint`	string	API 端点地址

统计数据展示

配置完成后，访客统计数据会显示在关于页面中：

<li>{{ stats?.visitors ? "已有" + stats.visitors + "人发现了我" : "统计未启用" }}</li>

调试模式

项目提供了一个调试页面用于验证 Umami 配置：

访问 /debug-umami 页面可以查看：

当前配置信息
API 返回数据
访客数显示测试
启用状态

数据缓存

为了优化性能，Umami 统计数据会在客户端缓存：

const CACHE_KEY = 'umami-stats-cache'
const CACHE_TTL = 3600000 // 1小时

统计数据每小时更新一次，避免频繁的 API 调用。

自托管 Umami

如果你使用自托管的 Umami 实例，需要修改以下配置：

umami: {
    enable: true,
    apiKey: "your-api-key",
    websiteId: "your-website-id",
    apiEndpoint: "https://your-umami-instance.com/api",  // 你的实例地址
}

同时更新布局文件中的脚本地址：

script: [
  {
    defer: true,
    src: 'https://your-umami-instance.com/script.js',
    'data-website-id': 'your-website-id'
  }
]

禁用统计

如果你不想使用 Umami 统计，只需将 enable 设置为 false：

umami: {
    enable: false,
    // ...其他配置
}

常见问题

统计数据不显示

检查 API 密钥是否正确
确认网站 ID 匹配
查看浏览器控制台是否有错误信息
访问 /debug-umami 页面进行调试

API 调用失败

确认 apiEndpoint 地址正确
检查网络连接
验证 API 密钥是否有效

数据延迟

Umami 统计数据可能有几分钟的延迟，这是正常现象。客户端缓存也会影响数据更新频率。