Vercel免费托管Umami
本文利用 Vercel 的免费额度和 Neon 提供的免费 PostgreSQL，把整套 Umami 跑起来，包含 Fork 仓库、导入项目、创建数据库、部署、获取追踪代码、绑定自定义域名等完整流程，全程零成本、零服务器。
网络
1,051 字 | 6 分钟阅读
前言：Umami 是一个简单、快速、注重隐私的网站分析工具。它提供实时的网站访问统计、用户行为分析等功能。
例如本博客所采用的评论点赞等都使用到Umami进行数据收集。
当我们手头缺失服务器，或者在没有情况下本机部署Umami时，可以使用Vercel进行免费部署
准备工作
首先我们需要拥有一个Github的账户，以及一个Vercel的账户和可访问国际互联网的环境
一、在Github Fork Umami
- 首先打开浏览器
- 在登陆Github账户的情况下打开Umami官方仓库 https://github.com/umami-software/umami/fork
- 根据官方指引填写仓库名，保持默认的
umami就行，然后点Create fork - 等几秒，浏览器页面跳转到你自己的
你的用户名/umami，这一步就完成了
后面如果 Umami 更新了，你也可以在自己的仓库里点 Sync fork 拉取新代码，Vercel 会自动重新部署。
二、在 Vercel 导入项目
- 登陆 Vercel，进入控制台
- 点右上角的
Add New...→Project - 在
Import Git Repository里找到刚才 Fork 的umami，点Import Framework Preset会自动识别成 Next.js，不用动- 先别急着点 Deploy，因为 Umami 需要一个数据库才能跑起来，没有
DATABASE_URL直接部署的话，构建会直接失败
三、准备一个 PostgreSQL 数据库
Umami 支持 PostgreSQL 和 MySQL，在 Vercel 上最省事的是用 Neon，它免费额度基本上够个人用了。
- 在 Vercel 项目页面点顶部的
Storage标签 - 点
Create Database，选择Neon - 区域选离你主要访问者近的，比如
Singapore或者US East - 计划选
Free，名字随便起，比如umamidb - 点
Create，创建完之后在弹窗里点Connect，把数据库连接到当前项目(就是你创建那个)
连接完成后 Vercel 会自动往项目里注入 DATABASE_URL 环境变量，不需要自己复制粘贴。如果你是自己在 Neon 官网建的库，那就手动把连接串加到环境变量里。
四、部署
- 回到
Deployments标签，点Create Deployment，选择main（或者master）分支 - 等构建完成，第一次构建时 Umami 会自动在数据库里建表，同时创建一个默认管理员账号
- 构建成功后点域名，打开
xxx.vercel.app
默认登录账号密码是：
用户名：admin
密码：umami登录后第一件事就是去左上角改密码，不然谁拿到你的域名都能进后台！！！！
五、添加网站并获取追踪代码
- 进后台点
Settings→Websites→Add website Name填网站名字，Domain填你的域名，比如blog.muhan.wiki，不要带https://- 保存后点这个网站，切到
Tracking code标签，能看到类似这样的代码：
<script
defer
src="https://你的域名/script.js"
data-website-id="xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx"
></script>- 把这段代码加到博客的
<head>里，或者用你博客框架提供的注入方式
加完之后刷新博客页面，回到 Umami 后台，能看到实时访客数动起来就说明接好了。
六、绑定自定义域名（可选）
xxx.vercel.app 在国内访问速度一般，而且不少广告拦截插件会直接屏蔽这个域名。建议绑一个自己的子域名，比如 umami.muhan.wiki。
- 项目
Settings→Domains→Add Domain - 填入
umami.muhan.wiki - 按提示去 DNS 服务商添加一条
CNAME记录，指向cname.vercel-dns.com - 等 DNS 生效，Vercel 会自动签发证书
绑好之后把追踪代码里的 src 换成新域名就行。