feat: 集成 Artalk 自托管评论系统
- 新增 docs/overrides/partials/comments.html,Material 主题评论覆盖 - mkdocs.yml 添加 custom_dir: docs/overrides - 首页添加 comments: false 关闭评论 - 新增 Artalk 部署文档(Docker + Nginx 反代 + 初始化指南) - 技术 index 添加 Artalk 文档链接 - mkdocs.yml nav 添加 Artalk 评论系统入口
This commit is contained in:
@@ -1,3 +1,7 @@
|
||||
---
|
||||
comments: false
|
||||
---
|
||||
|
||||
# 🏠 我的知识库
|
||||
|
||||
欢迎!这里是我(kurihada)的个人知识内容存储。
|
||||
|
||||
@@ -0,0 +1,34 @@
|
||||
{#-
|
||||
Artalk 评论系统集成
|
||||
通过 Material 主题的 comments 块覆盖实现
|
||||
如需关闭某页面的评论,在页面 frontmatter 中设置 comments: false
|
||||
-#}
|
||||
{% if page.meta.comments is not defined or page.meta.comments %}
|
||||
<div id="artalk-comments"></div>
|
||||
<link href="/artalk/dist/Artalk.css" rel="stylesheet">
|
||||
<script src="/artalk/dist/Artalk.js"></script>
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
var isDark = document.documentElement.getAttribute('data-md-color-scheme') === 'slate'
|
||||
|
||||
Artalk.init({
|
||||
el: '#artalk-comments',
|
||||
site: '我的知识库',
|
||||
server: window.location.origin + '/artalk',
|
||||
pageKey: window.location.pathname.replace(/\/$/, ''),
|
||||
pageTitle: document.title,
|
||||
darkMode: isDark
|
||||
})
|
||||
|
||||
// 跟随 MkDocs Material 深色模式切换
|
||||
var observer = new MutationObserver(function(mutations) {
|
||||
mutations.forEach(function(mutation) {
|
||||
var scheme = document.documentElement.getAttribute('data-md-color-scheme')
|
||||
var dark = scheme === 'slate'
|
||||
if (Artalk.darkMode !== dark) Artalk.setDarkMode(dark)
|
||||
})
|
||||
})
|
||||
observer.observe(document.documentElement, { attributes: true, attributeFilter: ['data-md-color-scheme'] })
|
||||
})
|
||||
</script>
|
||||
{% endif %}
|
||||
@@ -0,0 +1,173 @@
|
||||
# Artalk 评论系统部署
|
||||
|
||||
> 为 kb 接入自托管评论系统。Artalk:Go 后端 + SQLite,Docker 一键部署,前端 ~40KB,完全自托管无外部依赖。
|
||||
|
||||
---
|
||||
|
||||
## 架构
|
||||
|
||||
```mermaid
|
||||
graph LR
|
||||
Browser["浏览器"]
|
||||
Nginx["Nginx"]
|
||||
MkDocs["MkDocs 静态文件"]
|
||||
Artalk["Artalk Docker<br/>:23366"]
|
||||
SQLite[("SQLite<br/>/data")]
|
||||
|
||||
Browser --> Nginx
|
||||
Nginx -->|"/"| MkDocs
|
||||
Nginx -->|"/artalk/"| Artalk
|
||||
Artalk --> SQLite
|
||||
```
|
||||
|
||||
- Artalk 后端和 kb 站点部署在同一台服务器
|
||||
- Nginx 将 `/artalk/` 路径反代到 Artalk 容器
|
||||
- 前端 JS/CSS 也从同域 `/artalk/dist/` 加载,完全自托管
|
||||
|
||||
---
|
||||
|
||||
## 一、Docker 部署
|
||||
|
||||
### 1.1 创建目录和 compose 文件
|
||||
|
||||
```bash
|
||||
# 在服务器上执行
|
||||
mkdir -p /opt/artalk && cd /opt/artalk
|
||||
```
|
||||
|
||||
`docker-compose.yml`:
|
||||
|
||||
```yaml
|
||||
services:
|
||||
artalk:
|
||||
image: artalk/artalk-go
|
||||
container_name: artalk
|
||||
restart: unless-stopped
|
||||
ports:
|
||||
- "127.0.0.1:23366:23366" # 仅本地监听,由 Nginx 反代对外
|
||||
volumes:
|
||||
- ./data:/data # SQLite 数据持久化
|
||||
environment:
|
||||
- TZ=Asia/Shanghai
|
||||
- ATK_LOCALE=zh-CN
|
||||
- ATK_SITE_DEFAULT=我的知识库
|
||||
- ATK_SITE_URL=https://<你的域名>
|
||||
- ATK_TRUSTED_DOMAINS=https://<你的域名>
|
||||
```
|
||||
|
||||
### 1.2 启动
|
||||
|
||||
```bash
|
||||
docker compose up -d
|
||||
docker compose logs -f # 查看日志确认启动成功
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 二、Nginx 反向代理
|
||||
|
||||
### 方式 A:Nginx Proxy Manager
|
||||
|
||||
在 Proxy Manager 面板中添加一条 **Custom Location**(在你的 kb 站点 Proxy Host 里):
|
||||
|
||||
| 字段 | 值 |
|
||||
|------|-----|
|
||||
| Location | `/artalk/` |
|
||||
| Scheme | `http` |
|
||||
| Forward Hostname | `127.0.0.1` |
|
||||
| Forward Port | `23366` |
|
||||
|
||||
### 方式 B:手动 Nginx 配置
|
||||
|
||||
在 kb 站点的 `server` 块中添加:
|
||||
|
||||
```nginx
|
||||
location /artalk/ {
|
||||
proxy_pass http://127.0.0.1:23366/;
|
||||
proxy_set_header Host $host;
|
||||
proxy_set_header X-Real-IP $remote_addr;
|
||||
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
|
||||
proxy_set_header X-Forwarded-Proto $scheme;
|
||||
}
|
||||
```
|
||||
|
||||
然后 `nginx -t && nginx -s reload`。
|
||||
|
||||
---
|
||||
|
||||
## 三、初始化 Artalk
|
||||
|
||||
### 3.1 创建管理员
|
||||
|
||||
部署完成后,访问 `https://<你的域名>/artalk/`,会看到 Artalk 的登录界面。
|
||||
|
||||
1. 在服务器上执行命令创建管理员:
|
||||
```bash
|
||||
docker exec -it artalk artalk admin
|
||||
```
|
||||
2. 按提示输入用户名、邮箱和密码
|
||||
3. 在网页端使用刚创建的账号登录
|
||||
|
||||
### 3.2 验证评论功能
|
||||
|
||||
1. 打开 kb 任意文章页面(如技术笔记)
|
||||
2. 滑到页面底部,应该看到 Artalk 评论区
|
||||
3. 发一条测试评论
|
||||
4. 确认评论正常显示
|
||||
|
||||
---
|
||||
|
||||
## 四、可选配置
|
||||
|
||||
### 4.1 邮件通知
|
||||
|
||||
在 Artalk 管理面板(设置 → 邮件)配置 SMTP,用户回复时会收到邮件通知。
|
||||
|
||||
### 4.2 验证码
|
||||
|
||||
管理面板 → 验证码,可开启 reCAPTCHA 或图片验证码,防止垃圾评论。
|
||||
|
||||
### 4.3 Gravatar 头像
|
||||
|
||||
默认启用,用户评论时根据邮箱自动显示 Gravatar 头像。
|
||||
|
||||
### 4.4 图片上传
|
||||
|
||||
可配置本地存储或 S3/OSS 图床,用户在评论中上传图片。
|
||||
|
||||
---
|
||||
|
||||
## 五、日常管理
|
||||
|
||||
```bash
|
||||
# 查看日志
|
||||
docker logs artalk -f
|
||||
|
||||
# 重启
|
||||
docker restart artalk
|
||||
|
||||
# 升级
|
||||
docker compose pull
|
||||
docker compose up -d
|
||||
|
||||
# 备份数据(SQLite 文件)
|
||||
cp /opt/artalk/data/artalk-go.db /backup/artalk-$(date +%Y%m%d).db
|
||||
```
|
||||
|
||||
### 数据迁移
|
||||
|
||||
Artalk 数据存储在 `/opt/artalk/data/` 目录下的 SQLite 文件中。备份只需复制这个文件。
|
||||
|
||||
如需迁移到其他服务器,将整个 `/opt/artalk/` 目录复制过去,重新 `docker compose up -d` 即可。
|
||||
|
||||
---
|
||||
|
||||
## 六、MkDocs 端运作方式
|
||||
|
||||
kb 已通过 Material 主题的 `custom_dir` 机制集成了 Artalk 前端,无需手动在每个页面添加代码。
|
||||
|
||||
- **覆盖文件**:`docs/overrides/partials/comments.html`
|
||||
- **关闭特定页面评论**:在 `.md` 文件头部添加 `comments: false`
|
||||
- **自定义配置**:修改 `docs/overrides/partials/comments.html` 中的 `Artalk.init({...})` 参数
|
||||
|
||||
详细参数说明见 [Artalk 前端配置文档](https://artalk.js.org/guide/frontend/config.html)。
|
||||
@@ -32,3 +32,4 @@
|
||||
## 📝 技术笔记
|
||||
|
||||
- [旁路由 + 去广告 部署](旁路由部署.md) — sing-box + AdGuard Home 旁路由架构、配置路径、已知问题
|
||||
- [Artalk 评论系统](artalk评论系统.md) — 自托管评论系统,Docker 部署 + MkDocs 集成
|
||||
|
||||
@@ -29,6 +29,7 @@ theme:
|
||||
- search.suggest # 搜索建议
|
||||
- search.highlight # 搜索高亮
|
||||
- content.code.copy # 代码块复制按钮
|
||||
custom_dir: docs/overrides # 自定义模板覆盖(评论系统等)
|
||||
|
||||
markdown_extensions:
|
||||
- admonition # 提示框 !!! note
|
||||
@@ -67,6 +68,7 @@ nav:
|
||||
- 技术:
|
||||
- 技术/index.md
|
||||
- 旁路由部署: 技术/旁路由部署.md
|
||||
- Artalk 评论系统: 技术/artalk评论系统.md
|
||||
- 旁路由使用:
|
||||
- Linux: 技术/旁路由使用/Linux.md
|
||||
- Windows: 技术/旁路由使用/Windows.md
|
||||
|
||||
Reference in New Issue
Block a user