本文介绍了在宝塔系统上基于 MySQL,采用 Docker部署 Waline 的方法,并提供 Github 社交登陆,渐变彩色邮件通知模板!
准备工作
注册一个邮箱,并开启SMTP 。waline 邮件通知需要用到
你得有一个vps 。 目前个人能找到的最便宜的 VPS 服务商: racknerd VPS
安装配置好宝塔。 宝塔安装与配置简明教程
创建waline 数据库
以 mysql 数据库为例
MySQL 数据库初始化
https://waline.js.org/guide/database.html#mysql
https://github.com/walinejs/waline/blob/main/assets/waline.sql
docker 安装 waline
vps.yml
文件
注意这里的端口地址,并使用host模式,以方便连接主机的 MySQL 数据库
.env
文件
由于单引号和双引号过多,邮件通知模板只能放在env文件里面
这个邮件通知模板效果如下
安装waline
域名配置
域名设置
设置反向代理
宝塔设置反向代理方法如下
DNS 配置
这里以DNSPod 为例
直接使用ip就是如下示例
如果使用vercel ,那么域名配置方法如下
cname-china.vercel-dns.com
添加 GitHub 社交登录
- 开启 GitHub 账号登录功能需要配置 GitHub OAuth 密钥。点击 Register a new OAuth application 进入 GitHub OAuth 应用申请页面。
配置注意事项如下:
- Application name: 应用名称,会在用户授权时显示,推荐使用博客名称。
- Homepage URL: 应用主页地址,会在用户授权时显示,推荐使用博客地址。
- Appcation description: 应用描述,会在用户授权时显示,非必填项。
- Authorization callback URL: 应用的回调地址,登录时需要使用。填入
<serverURL>/oauth/github
其中<serverURL>
是你的 Waline 服务端地址。
- 填写完成后点击 Register application 即可成功创建。页面中会显示 Client ID。点击 Client secrets 栏右边的 Generate a new client secret 按钮则可以获取到该应用的 Client secrets。
显示在 GitHub的
Settings -> Developer settings -> OAuth Apps -> 又见苍岚
- 使用以上信息配置环境变量,重新部署。
环境变量名称 | 备注 |
---|---|
GITHUB_ID | 对应 GitHub OAuth App 中的 Client ID |
GITHUB_SECRET | 对应 GitHub OAuth App 中的 Client secrets |
- 之后即可使用 GitHub 登录
添加邮件通知
上文中已经在 docker compose 文件中添加了邮件通知功能,下面介绍另一个邮件通知模板
紫罗兰永恒花园信笺模板
这个模板测试还存在一些bug, css 需要一些调整
.env
如果采用vercel部署,修改部署repo 的 ~/index.js 文件
注意事项
- 默认创建好waline 后,尽快创建第一个登录用户! 默认第一个登录用户为管理员, 默认地址为
[域名]/ui
, 例如本文中就是waline.17lai.site/ui
- waline 自带数据导入导出,目前测试导入同一份数据2次,会使同一份数据在数据库中出现两次!
Cloudflare 设置
使用了 Cloudflare 时需要注意的配置事项!
如果使用了 CF 的服务,不配置这里,waline 就获取不到正确的地理位置,但 CF 还支持下面功能,官方文档
设置方法
Umami UV / PV 统计显示
Umami 统计了 UV PV 等各种访问数据,比不蒜子详细得多,自建服务也比不蒜子稳定。那么怎么用 Umami 代替不蒜子了? 下文将介绍详细方法
新建 View only
权限的用户
Q: 为什么不直接调用 Umami 的 API 获取数据,而是要额外创建一个账户?
A: 博客是 静态开源无服务器 的,所有代码都展示在前端,包括 API 调用。而 Umami 的
admin
API 权限太大了,如果使用admin
权限的 API Token,那么这个 token 可以获取、修改、删除所有网站的数据,会有严重的安全隐患。所以我们需要创建一个
View only
权限的用户,使用这个低权限的用户
的 API Token 来访问我们的浏览量等数据。
新建 Team
并添加用户和网站
Settings
-> Teams
-> Create team
-> 填写名称 -> Save
-> 找到刚刚创建的 Team
-> Edit
-> 复制 Access code
,点击 Websites
中点击 Add website
选中你想共享的网站
换一个浏览器登录 Umami(使用View only
权限的用户) -> Settings
-> Teams
-> Join team
-> 输入 Access code
-> Join
-> 如果没有出错的话,点击 Dashboard
就可以看到你刚刚添加的网站了
获取 View only
用户的 API Token
根据 Umami 的文档,我们可以通过以下方式获取 API Token:
例如 你的网站地址为 example.com
,那么你需要使用 View only
的账户密码向 https://example.com/api/auth/login
发送一个 POST 请求,请求体为:
如果成功,你应该会得到以下的结果:
保存 token 值,并在所有请求中发送带 Bearer <token>
值的 Authorization
标头。请求标头应该如下所示:
发送请求获取数据
这里要用到类似于 postman
的 API 测试工具,可以使用的是开源的 hoppscotch
,你也可以使用 curl
或者其他工具。
先分析一下官方文档的 API 接口:GET /api/websites/{websiteId}/stats
有两个必填的 查询参数:startAt
和 endAt
,都是 Unix 毫秒时间戳,表示开始时间和结束时间
websiteId
和 startAt
需要我们自己获取
websiteId
可以在 Dashboard
-> View details
-> 看浏览器栏的地址 https://example.com/websites/{websiteId}
中找到
startAt
可发送 GET
请求到 https://example.com/api/websites/{websiteId}
,请求头为
在返回结果中找到 createdAt
字段,这个字段就是 startAt
的值,也就是你的网站创建时间,数据的开始时间
编写页面
代码如下,修改你对应的参数即可运行:
参考&致谢
- Waline 添加 GitHub 社交登录
- waline 邮件通知模板样式一览
- 信笺样式留言板
- Umami UV / PV 统计显示
- https://umami.is/docs/websites-api
- https://umami.is/docs/authentication
- https://umami.is/docs/website-stats
雷打真孝子,财发狠心,麻绳专挑细处断,恶运专找苦命人!
——俗语赏析
系列教程
Hexo系列
[三万字教程]基于Hexo的matery主题搭建博客并深度优化完全一站式教程
- Hexo Docker环境与Hexo基础配置篇
- hexo博客自定义修改篇
- hexo博客网络优化篇
- hexo博客增强部署篇
- hexo博客个性定制篇
- hexo博客常见问题篇
- hexo博客博文撰写篇之完美笔记大攻略终极完全版
- Hexo Markdown以及各种插件功能测试
- markdown 各种其它语法插件,latex公式支持,mermaid图表,plant uml图表,URL卡片,bilibili卡片,github卡片,豆瓣卡片,插入音乐和视频,插入脑图,插入PDF,嵌入iframe
- 在 Hexo 博客中插入 ECharts 动态图表
- 使用nodeppt给hexo博客嵌入PPT演示
- GithubProfile美化与自动获取RSS文章教程
- Vercel部署高级用法教程
- webhook部署Hexo静态博客指南
- 在宝塔VPS上面采用docker部署waline全流程图解教程
Docker系列
- Docker使用简明教程
- 使用jeckett,sonarr,iyuu,qt,emby打造全自动追剧流程
- 为知笔记私有化Docker部署
- Earthly 一个更加强大的镜像构建工具
- 使用 Shell 脚本实现一个简单 Docker
- 如何使用Traefik V2 在Ubuntu20.04 上面来做 Dockers
- 通过IPV6访问Qnap NAS中Docker的服务
笔记系列
- 完美笔记进化论
- hexo博客博文撰写篇之完美笔记大攻略终极完全版
- Joplin入门指南&实践方案
- 替代Evernote免费开源笔记Joplin-网盘同步笔记历史版本Markdown可视化
- Joplin 插件以及其Markdown语法。All in One!
- Joplin 插件使用推荐
- 为知笔记私有化Docker部署
Gitbook使用系列
- GitBook+GitLab撰写发布技术文档-Part1:GitBook篇
- GitBook+GitLab撰写发布技术文档-Part2:GitLab篇
- 自己动手制作电子书的最佳方式(支持PDF、ePub、mobi等格式)