光政的博客 2024年07月09日
如何零成本给博客集成 umami 数据统计分析功能
index_new5.html
../../../zaker_core/zaker_tpl_static/wap/tpl_guoji1.html

 

本文介绍如何零成本给博客或网站集成umami统计功能,包括使用supabase创建数据库、vercel托管umami服务及配置umami等内容。

🧐使用supabase提供的有限额postgres数据库创建umami所需数据库。创建supabase账号,新建项目并输入密码,等待几分钟完成创建,获取DATABASE_URL。

🛠️通过vercel托管umami服务。登录GitHub账号fork umami项目,登录vercel并导入fork的项目,填写两个环境变量DATABASE_URL和TRACKER_SCRIPT_NAME,在Build阶段填写特定命令。

⚙️配置umami。在vercel部署完成后,访问得到的网址,使用默认账号密码登录,进行基础帐号配置,添加网站并填写信息,获取相关数据用于主题配置。

本篇文章介绍如何零成本给博客或者网站集成 umami 统计功能。数据库用的是 supabase 提供的有限额的 postgres,不过免费提供的 500M 对于 umami 来讲已经足够了。

托管 umami 服务用的是 vercel。得益于现在的云厂商优秀的服务能力,你可以在 10 分钟内集成好 umami。可以点击 数据统计看板 查看最终效果。

创建数据库

数据库用的是 supabase 提供的有限额的 postgres 数据库,创建一个 supabase 账号,新建一个项目,输入 Datebase password 即可创建数据库服务。

创建可能会话费几分钟时间,创建完成后只需要拿到 DATABASE_URL 即可。

托管 umami

托管 umami 服务用的是 vercel。创建好数据库实例之后,可以通过 Vercel 一键部署 umami 服务了。访问 umami 官方文档Running on Vercel 模块,有操作说明与一键部署脚本。

首先我们登录 GitHub 账号, fork umami (https://github.com/umami-software/umami) 项目。

登录 vercel ,创建一个的账号,建议使用 GitHub 账号注册登录,在 new project 中选择 import 你刚刚 fork 的项目。

之后填写环境变量,这里我们需要填写两个环境变量

最后在 Build 阶段, build command 记得填写 yarn build && yarn update-db,这样的话会自动 migrate 数据库的表。无需自己手动导入。

当然如果你想自己导入的话,也可以直接从这里 https://github.com/umami-software/umami/blob/master/sql/schema.postgresql.sql 获取需要的表。

配置 umami

在 vercel 部署完成 umami 后会得到一个 <deploy-id>.vercel.app ,我们访问它,默认的账号密码是 adminumami

完成基础帐号配置后,点击侧边栏网站 Tab,点击添加网站。填写网站基本信息,可以勾选 enable share URL,这样任何人都可以访问这个数据看板。

我们拿到对应的 data-website-idsrc ,填入主题配置中的 params.analytics.umami.website_idparams.analytics.umami.url 即可。

最终,我们可以得到本站数据统计看板的功能???

Fish AI Reader

Fish AI Reader

AI辅助创作,多种专业模板,深度分析,高质量内容生成。从观点提取到深度思考,FishAI为您提供全方位的创作支持。新版本引入自定义参数,让您的创作更加个性化和精准。

FishAI

FishAI

鱼阅,AI 时代的下一个智能信息助手,助你摆脱信息焦虑

联系邮箱 441953276@qq.com

相关标签

umami统计功能 supabase vercel 数据统计
相关文章