Google Analytics 应该是当今互联网使用最广泛的网站流量分析服务。通过在网页中嵌入追踪代码,Google Analytics 能够帮我们收集网站的流量来源,同时自动分析跳出率、转化率等核心指标。但是对于大部分中小型站点而言,接入 Google Analytics 并不是最理想的选择,因为它太复杂了,同时国内访问也不太方便。

umami.is 则可以看作是 Google Analytics 的精简版解决方案,它完全免费且开源,非常适合中小站点的网络流量统计分析。相对于复杂的 Google Analyticsumami.is 的界面也更加简洁,只关注于核心指标,并方便分享出去。

20230501123735961

前期准备

你需要完成以下 3 个步骤:

  1. 访问 umami.is 代码仓库,点击右上方 Fork 到自己的帐号。
  2. 访问 Vercel注册页面,点击使用 GitHub 登录到 Vercel。
  3. 访问 Supabase注册 页面,点击使用 GitHub 登录到 Supabase。

1、在Supabase创建数据库

我们需要先在 Supabase 的主界面中找到 New Project 按钮创建一个新的数据库。名字可以使用 umami,然后设置一个自己记得住的数据库密码(一会要用)。下方的 Region 区域选择 Northeast Asia(Tokyo)东京区域。Supabase 本身使用了 AWS 云服务,东京区域在大陆地区的访问速度还是比较理想的。等待数据库建立,需要几分钟的时间。

20230501123735962

建立之后,点击左下方的 Project Settings,选择 Database,找到 Connection string 中的 URL 一栏,复制内容,并将[YOUR-PASSWORD]替换为上一步生成的密码。 Supabase 平台的操作就结束了。 20230501123735963

2、在 Vercel 部署 Umami

登录Vercel 之后,点击右上角 Add New Project,并导入事先 Fork 的项目仓库。创建项目的页面中,会自动加载你 GitHub 帐号下方的代码仓库。还记得准备步骤 Fork 的 umami.is 仓库吗?选中即可。

20230501123735964

在 Configure Project 中需要设置两个环境变量(Environment Variables)。 分别添加 DATABASE_URLHASH_SALT

  • DATABASE_URL:是上一步在 Subabase 复制的 URL,记得替换自己的 Password;

  • HASH_SALT:它的值可以是任意随机英文字符串,比如我使用了我的用户名 HUHUHANG,你也可以自定义其他随机字符串

最后点击 Deploy,等待两分钟。

20230501123735965

3、测试和设置

至此,主要步骤已经顺利完成,你需要做的只是耐心等待项目部署完毕。完成之后,Vercel 会自动跳转到项目主页,并随机分配一个域名(需要科学上网,可以绑定自己的域名)。点击 Visit 访问项目,umami 默认的后台登录的用户名是 admin,密码是 umami

1)自定义域名

首先是设置一个独立域名,当然前提条件是你有自己的域名,没有的话可以到任意域名服务商(阿里云、腾讯云等)购买。当然你也可以一直使用 Vercel 自动分配的域名(Vercel 自动分配的域名需要科学上网)。

2)重设 umami 密码并绑定站点

不要忘记到 umami 后台重设默认的管理员密码。同时,你可以新建站点并获取到数据追踪代码嵌入到你的站点中。 20230501123735966

这里非常推荐开启「启用共享链接」的选项,这是 umami 的一大特色,可以方便分享你的站点访问数据。同时当你自己查看时,可以免登录。你可以 访问我的示例分享页面

提示:如果需要删除网站,先将语言切换至 English,中文状态无法删除。

4、常见问题和小结

Q:Vercel 和 Supabase 是免费的吗?我能用多久?
A:目前 Vercel 的个人帐号完全免费,企业帐号才需要付费。Supabase 的免费数据库存在 500 MB 的限制,对于中小站点这个容量理论上够用很多年了。

Q:umami 的访问速度如何?
A:据我所知,Vercel 使用了 Google Cloud 的云服务,距离大陆地区最近的节点在台湾省和香港特别行政区,访问速度还算理想。而 Supabase 使用了 AWS 云服务,一开始我们创建的数据库就选择了离大陆地区最近的东京数据中心。

Q:umami 后续如何升级?
A:Vercel 的部署是自动触发和完成的,也就是说当 GitHub 代码仓库更新时,Vercel 会帮你自动部署上线最新版本的 umami。你可以不定期访问你 Fork 后的代码仓库,选中 Fetch upstream 从 umami 官方仓库同步最新的代码后即可自动升级。当然,你还可以从一开始直接部署官方仓库的代码,完全跟随官方版本迭代升级。