一、背景

之前评论系统使用的是 Artalk，需要维护的东西太多了，如下：

  • Artalk 版本，butterfly 主题更新后需要更新 Artalk
    • 前端 Artalk 插件版本
    • Aliyun 服务器中部署的 Artalk Docker 后端容器版本
  • artalk.z2huo.cn 域名 HTTPS 证书维护。用的是免费的证书，证书有效期为 3 个月，过期了还需要更新
  • Artalk 评论持久化存储，需要用到数据库，数据库有两种存放方式，一种是内嵌数据库，文件存储在 Aliyun 服务器的某个目录下，另一种使用外置数据库，使用外置数据库时，还需要在服务器上部署 PostgreSQL

感觉特别费事，需要自己管理所有的东西。

继续做了 Gitalk 的尝试，这次成功了。

二、配置

1、Hexo butterfly 配置

修改 _config.butterfly.yml 文件中的内容如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
comments:
  use: Gitalk
  text: true
  lazyload: false
  count: false
  card_post_count: false

gitalk:
  client_id: Ov23liDBzZYXZTwXzjrs
  client_secret: 1478a2307ed9b7c42066338bd6d5b449d76d4df5
  repo: z2huo-gitalk-comments
  owner: z2huo
  admin: ['z2huo']
  option:
    language: zh-CN
    perPage: 10
    #  是否是聚精会神模式，即评论框在写评论的时候，周围是否变成黑
    distractionFreeMode: false
    # GitHub issue 的标签
    labels: ['Gitalk']

修改 comments.use 为 Gitalk，即开启 Gitalk 评论。

client_id、client_secret、repo、owner、admin 都为 github 的配置：

  • client_id，GItHub Application Client ID
  • client_secret，GitHub Application Client Secret
  • repo，GitHub repository
  • ower ，GitHub repository 所有者
  • admin ，列表，GitHub repository 的所有者和合作者，即对这个 repository 有写权限的用户

Gitalk 给出了好多可选项，可以参考 gitalk readme cn | github.com 中的配置，但是 butterfly 这里的 option 几乎不需要做过多额外的配置。

2、GitHub OAuth Apps

图片加载失败

GitHub OAuth Apps 中的 Homepage URL 和 Authorization callback URL 填写博客地址。

3、Repository Issues

GitHub 存储库 Issues 列表如下：

图片加载失败

可以看到，每篇文章对应一个 Issue，通过两个 Label 来匹配：Gitalk 和 文章唯一 ID，Label 是可以自定义的，通过 Gitalk 的 labels 配置。

Issues 详细内容如下图，会将文章的链接和文章的描述填写到 Issues 中，另外 Issues 的标题是博客文章的标题，取的是 document.title，这个可以在浏览器的控制台中查看。

图片加载失败

三、评论截图

查看 GitHub 中不存在 Issues 的文章的评论

查看 GitHub 中不存在 Issues 的文章的评论

未登录用户查看 GitHub 中已存在 Issues 的文章的评论

未登录用户查看 GitHub 中已存在 Issues 的文章的评论

用户评论

相关链接

gitalk readme cn | github.com

OB tags

#Hexo