Hexo博客添加Gitment评论系统

之前我的Hexo博客中使用的是 多说 的评论插件，后来多说停止运营了之后就直接把评论功能去掉了，而后一直使用的是邮件的方式。但邮件也是很不方便的，是一种不得已的选择。

最近，看到好多博客中都添加了一个名为 Gitment 的评论插件，直接使用GitHub的 Issues 作为评论内容的存储位置，也是非常方便的。

Update:2019-04-30

Gitment 评论插件已经长时间不更新了，另外由于插件内引用的域名Https证书已经过期，导致无法提交评论。建议更换为更好用的 Gitalk 评论插件。

配置方法见：Hexo博客添加Gitalk评论系统 | IT范儿

Next主题版本

我的hexo主题使用的是 Next 主题,当前版本为 v5.1.3 。这一版是直接内置支持 gitment 功能的。关于如何升级 Next 主题，可以看我之前的文章：Hexo博客添加搜索功能

另外我发现，当前 Next 主题的最新版本为 v6.4.1，而 v6.x.x 版本和 v5.x.x 版本又有所不同，不能平滑的升级，所以这里我就没有升级 Next 到最新，直接使用的 v5.1.3 版本。

添加Gitment评论

创建GitHub OAuth Apps

打开链接 OAuth Apps – New OAuth App 。按要求填写相应内容即可。

其中，Homepage URL 表示站点的网址。Authorization callback URL 为站点的回调地址，一般也默认为站点的网址。

最后，得到 Client ID 和 Client Secret 备用。

修改配置

~~在 themes/next 目录下，找到 _config.yml 配置文件，找到 gitment 配置段：~~

# Gitment
# Introduction: https://imsun.net/posts/gitment-introduction/
gitment:
  enable: false
  mint: true # RECOMMEND, A mint on Gitment, to support count, language and proxy_gateway
  count: true # Show comments count in post meta area
  lazy: false # Comments lazy loading with a button
  cleanly: false # Hide 'Powered by ...' on footer, and more
  language: # Force language, or auto switch by theme
  github_user: # MUST HAVE, Your Github Username
  github_repo: # MUST HAVE, The name of the repo you use to store Gitment comments
  client_id: # MUST HAVE, Github client id for the Gitment
  client_secret: # EITHER this or proxy_gateway, Github access secret token for the Gitment
  proxy_gateway: # Address of api proxy, See: https://github.com/aimingoo/intersect
  redirect_protocol: # Protocol of redirect_uri with force_redirect_protocol when mint enabled

~~设置 enable 为 true ，表示启用 gitment 评论插件。~~

Update:2019-04-30

Gitment 评论插件已经长时间不更新了，另外由于插件内引用的域名Https证书已经过期，导致无法提交评论。建议更换为更好用的 Gitalk 评论插件。

配置方法见：Hexo博客添加Gitalk评论系统 | IT范儿

其他的必需项是 github_user ，表示你的github账号名称。 github_repo 表示保存评论数据的仓库名称，这里可以使用当前博客所在的仓库名称，也可以单独设置一个专门的仓库。client_id 和 client_secret 为上面创建的值。

修改完成后，将hexo博客文件上传到github。因为gitment功能必需在线上才能进行操作。

注意事项

点击登录github发现一直显示loading

在创建 OAuth Apps 中填写 Authorization callback URL 时，网站的地址末尾不能带有 / 。

某些文章不能生成Issues

当点击文章页面底部的 初始化本文的评论页 按钮时，页面会弹出错误信息：Error:Validation Failed 信息。

通过查看操作请求，gitment会在生成Issues时创建两个 label 标签。

一个是文章标题的路径: window.location.pathname 值，如 /2018/09/05/pip-install-locale-error-unsupported-locale-setting/ ；另一个是定值 gitment 。

而由于 github 中 Issues 的 label 长度限制为最大 50 个字符，当文章标题长度过长时，该label就会生成失败，而导致初始化错误，弹出 Validation Failed 的提示。

通过网上的搜索，发现可以使用文章创建时的时间来代替文章标题，作为这个唯一的label标签。

找到giment的配置：/themes/next/layout/_third-party/comments/gitment.swig 文件：

找到如下部分：

var gitment = new {{CommentsClass}}({
    id: window.location.pathname,
    owner: '{{ theme.gitment.github_user }}',
    repo: '{{ theme.gitment.github_repo }}',
    ...

修改为：

var gitment = new {{CommentsClass}}({
    id: 'itfanr_blog_{{ date(page.date, "YYYYMMDDhhmmss") }}',
    owner: '{{ theme.gitment.github_user }}',
    repo: '{{ theme.gitment.github_repo }}',
    ...

这样，在初始化时就不会出错了。

有新的Issues时发送钉钉提醒

上面我们添加了评论功能，但是在使用中会出现不能及时响应的问题。当有人对文章做了评论或提出什么疑问后，我们并不能及时的知道或者回复，这样给人的感觉是不好的。虽然添加了评论功能，但反而不如使用邮件的方式高效了。

经过一番思考后，我发现平时工作中用到的钉钉中是可以添加GitHub的钉钉机器人的。而手机端的钉钉也能做到有新提醒后立即响应。所以，可以设置当GitHub的Issues有变动时，通过钉钉机器人提醒我们查看新的评论或作出回复。

生成Github机器人WebHook地址

钉钉机器人只有在群中才能添加，个人是无法添加的。但是一个人又无法创建群。那么该如何添加一个钉钉群机器人呢？

Update:2019-05-05

我采用的方法是 “偷梁换柱” 的方式。首先呢，在手机或PC端选择 “发起群聊”，至少选择二个人进来，此时注意不要在群里发任何信息。然后在 群设置 中的 群成员 选项中移除其他人就可以了，整个过程其他人不会接收到任何消息（有点类似于微信清理联系人的操作）。就这么简单。这样，这个群里就只有你一个人了，添加群机器人后也不会打扰到别人。

之前钉钉中组建群组至少必须是二个人，最近测试发现组建群组至少必须是三个人了。也就是必须选择另外两个好友才能组成一个群组。如果只选择一个好友，那进入的就是 “发消息” 的界面了。

然后在 群 设置中选择 群机器人 选项，选择 GitHub机器人 ，按照设置流程生成GitHub机器人，即可获取到相应群的WebHook地址，其格式如下：

1	https://oapi.dingtalk.com/robot/send?access_token=xxxxxxxx

在GitHub中设置项目的webhook

进入 GitHub 的 Hexo 博客仓库，依次点击 Settings – Webhooks & Services – Add Webhook ，新增一项。

在 payload URL 中填写刚才获得的钉钉WebHook地址；

在 Content type 选项下选择 application/json 项；

在 Secret 中不填写内容，保持空值即可；

在 Event 选项下，我这里选择了 issues 相关的所有 event 事件，也可以按照自己的需求自定义。

然后，点击 Add webhook 按钮即可。

至此，当 Issues 中有新的评论时，在钉钉手机客户端就能立即接收到提醒了。