Umami 自托管部署完整指南：Vercel + Supabase 免费方案

什么是 Umami？#

Umami 是一个开源、轻量、隐私友好的网站分析工具，相比 Google Analytics，它更注重用户隐私，数据完全由自己掌控，而且界面简洁美观，功能实用。

为什么选择 Vercel + Supabase？#

Vercel：提供免费的静态网站托管服务，部署简单，全球 CDN，访问速度快
Supabase：提供免费的 PostgreSQL 数据库服务，适合小型应用，操作简单
完全免费：两者的免费额度足够个人和小型网站使用
无需服务器：不需要购买和维护服务器，节省成本和精力

准备工作#

1. 注册账号#

GitHub 账号：用于代码托管和 Vercel 登录
Vercel 账号：用于部署 Umami
Supabase 账号：用于提供 PostgreSQL 数据库

2. 技术要求#

基本的 Git 操作知识
基本的数据库操作知识
能够访问 GitHub、Vercel 和 Supabase 网站

步骤一：创建 Supabase 项目#

1. 登录 Supabase#

访问 Supabase 控制台，使用 GitHub 账号登录。

2. 创建新项目#

点击「New Project」按钮
填写项目信息：
- Project Name：填写项目名称，比如 umami-db
- Database Password：设置一个安全的数据库密码（记住这个密码，后面会用到）
- Region：选择离你最近的区域
点击「Create Project」按钮，等待项目创建完成（约需 2-3 分钟）

3. 获取数据库连接信息#

项目创建完成后：

点击顶部菜单的「Connect」
在「Connection String」部分，找到「URI」格式的连接字符串
复制这个连接字符串，备用

注意：连接字符串格式类似：

1
postgresql://postgres:你的密码@aws-0-us-east-1.pooler.supabase.com:6543/postgres

4. 执行数据库初始化脚本#

点击左侧菜单的「SQL Editor」
点击「New query」按钮
复制粘贴以下 SQL 脚本：

1
-- Create tables
2
CREATE TABLE IF NOT EXISTS accounts (
3
  id serial PRIMARY KEY,
4
  username VARCHAR(255) UNIQUE NOT NULL,
5
  password VARCHAR(255) NOT NULL,
6
  created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
7
);
8

9
CREATE TABLE IF NOT EXISTS websites (
10
  id serial PRIMARY KEY,
11
  name VARCHAR(255) NOT NULL,
12
  domain VARCHAR(255) NOT NULL,
13
  share_id VARCHAR(64) UNIQUE,
14
  created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
15
);
16

17
CREATE TABLE IF NOT EXISTS website_events (
18
  id serial PRIMARY KEY,
19
  website_id INTEGER NOT NULL,
20
  session_id VARCHAR(64) NOT NULL,
21
  event_type VARCHAR(64) NOT NULL,
22
  url VARCHAR(2048) NOT NULL,
23
  referrer VARCHAR(2048),
24
  device VARCHAR(64),
25
  browser VARCHAR(64),
26
  os VARCHAR(64),
27
  country VARCHAR(2),
28
  city VARCHAR(255),
29
  screen VARCHAR(64),
30
  language VARCHAR(64),
31
  created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
32
);
33

34
-- Create indexes
35
CREATE INDEX IF NOT EXISTS website_events_website_id_idx ON website_events(website_id);
36
CREATE INDEX IF NOT EXISTS website_events_session_id_idx ON website_events(session_id);
37
CREATE INDEX IF NOT EXISTS website_events_created_at_idx ON website_events(created_at);
38

39
-- Insert default account
40
INSERT INTO accounts (username, password) VALUES ('admin', '$2b$10$t3q4bN3BjV8sS6XZ7Y8Z9u.7a2b3c4d5e6f7g8h9i0j1k2l3m4n5o6p7q8r9s0t');

点击「Run」按钮执行脚本

说明：默认账号的用户名是 admin，密码是 umami，登录后可以修改。

方案二：使用 Vercel Database（Neon）部署#

如果你觉得 Supabase 配置步骤太麻烦，也可以选择使用 Vercel 自带的 Neon 数据库服务，操作更加简单一体化。

1. 登录 Vercel#

访问 Vercel 控制台，使用 GitHub 账号登录。

2. 创建数据库#

在 Vercel 控制台中，点击左侧菜单的「Storage」
点击「Create Database」按钮
选择「Neon」作为数据库类型
填写数据库信息：
- Database Name：填写数据库名称，比如 umami-db
- Region：选择离你最近的区域
点击「Create」按钮，等待数据库创建完成

3. 获取数据库连接信息#

数据库创建完成后：

在 Storage 页面中，点击你刚刚创建的数据库
在「Connection Project」选项卡中，选择部署好的项目（前提是你已经部署了项目，建议先执行步骤二的内容）
重新执行步骤二的第6点内容

步骤二：部署 Umami 到 Vercel#

1. Fork Umami 仓库#

访问 Umami GitHub 仓库
点击右上角的「Fork」按钮，将仓库 fork 到自己的 GitHub 账号下

2. 登录 Vercel#

访问 Vercel 控制台，使用 GitHub 账号登录。

3. 导入项目#

点击「Add New」→「Project」
在「Import Git Repository」部分，找到并选择你刚才 fork 的 Umami 仓库
点击「Import」按钮

4. 配置项目#

在配置页面：

Project Name：保持默认或修改为你喜欢的名称
Framework Preset：选择「Next.js」
Root Directory：保持默认
Build and Output Settings：保持默认

5. 设置环境变量#

在「Environment Variables」部分，点击「Add」按钮，添加以下环境变量：

变量名	值	说明
`DATABASE_URL`	你的 Supabase 连接字符串	数据库连接地址
`HASH_SALT`	随机字符串	用于密码哈希，建议使用随机生成的字符串

注意：

DATABASE_URL 就是你在 Supabase 中复制的连接字符串
HASH_SALT 可以使用在线工具生成一个随机字符串

6. 部署项目#

点击「Deploy」按钮，等待部署完成。部署过程可能需要 2-3 分钟。

7. 访问项目#

部署完成后，Vercel 会生成一个域名，点击「Visit」按钮即可访问 Umami 应用。

步骤三：配置 Umami#

1. 登录 Umami#

访问部署后的 Umami 网站
使用默认账号登录：
- 用户名：admin
- 密码：umami

2. 修改默认密码(重要)#

登录后，点击右上角的用户头像
选择「Profile」
在「Password」部分，输入新密码
点击「Save」按钮

3. 添加网站#

点击左侧菜单的「Websites」
点击「Add Website」按钮
填写网站信息：
- Name：网站名称
- Domain：网站域名
点击「Save」按钮

4. 获取跟踪代码#

在网站列表中，找到你刚刚添加的网站
点击右侧的「</>」图标
复制跟踪代码
将跟踪代码添加到你网站的 <head> 标签中

步骤四：验证部署#

1. 检查数据统计#

访问你添加的网站
浏览几个页面
回到 Umami 控制台，查看「Real-time」数据
确认能看到访问数据

2. 检查历史数据#

等待一段时间（约 5-10 分钟）
回到 Umami 控制台
查看「Dashboard」页面
确认能看到历史访问数据

常见问题及解决方案#

1. 数据库连接失败#

症状：部署后无法访问，或显示数据库连接错误

解决方案：

检查 DATABASE_URL 环境变量是否正确
确认 Supabase 项目是否正常运行
检查数据库密码是否正确

2. 跟踪代码不工作#

症状：网站访问后，Umami 中没有数据

解决方案：

确认跟踪代码是否正确添加到网站中
检查浏览器控制台是否有错误
确认网站域名是否与 Umami 中添加的域名一致

3. 部署失败#

症状：Vercel 部署过程中出现错误

解决方案：

检查环境变量是否正确设置
确认 Umami 版本是否与 Vercel 兼容
查看部署日志，根据错误信息进行修复

总结#

通过以上步骤，你已经成功在 Vercel 上部署了 Umami，并使用 Supabase 作为数据库。现在你可以：

实时监控网站访问数据
查看详细的用户行为分析
导出数据进行进一步分析
完全掌控你的网站分析数据

Umami 是一个非常优秀的开源网站分析工具，结合 Vercel 和 Supabase 的免费服务，你可以零成本搭建一个功能完整的网站分析系统。

项目资源#

Umami GitHub 仓库：https://github.com/umami-software/umami
Vercel 官网：https://vercel.com
Supabase 官网：https://supabase.com

希望这篇指南对你有所帮助！如果你在部署过程中遇到任何问题，欢迎在评论区留言。

Umami 自托管部署完整指南：Vercel + Supabase 免费方案

什么是 Umami？#

为什么选择 Vercel + Supabase？#

准备工作#

1. 注册账号#

2. 技术要求#

步骤一：创建 Supabase 项目#

1. 登录 Supabase#

2. 创建新项目#

3. 获取数据库连接信息#

4. 执行数据库初始化脚本#

方案二：使用 Vercel Database（Neon）部署#

1. 登录 Vercel#

2. 创建数据库#

3. 获取数据库连接信息#

步骤二：部署 Umami 到 Vercel#

1. Fork Umami 仓库#

2. 登录 Vercel#

3. 导入项目#

4. 配置项目#

5. 设置环境变量#

6. 部署项目#

7. 访问项目#

步骤三：配置 Umami#

1. 登录 Umami#

2. 修改默认密码(重要)#

3. 添加网站#

4. 获取跟踪代码#

步骤四：验证部署#

1. 检查数据统计#

2. 检查历史数据#

常见问题及解决方案#

1. 数据库连接失败#

2. 跟踪代码不工作#

3. 部署失败#

总结#

项目资源#

支持与分享

评论区