给博客添加评论功能

今天突发奇想想给博客添加一个评论功能,其实以前就有这个想法,但是我记得注册一个第三方平台账户的时候要求我拍什么身份证照片,直接就放弃了。后来看到一个gitment,就是一个用github账号登陆的评论系统,试了一试也失败了,今天重新弄费了九牛二虎之力终于搞好了,写篇博客记录下。

安装gitment

安装模块

在你的博客根目录安装

1
npm i --save gitment

申请应用

首先去New OAuth App为你的博客申请一个密钥。
申请密钥
申请好之后点注册,然后就可以看到两个东西ClientID和Client Secret,后面会用到.

配置

下面就是配置Gitment,主要编辑在themes/next/_config.yml:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
# Gitment
# Introduction: https://imsun.net/posts/gitment-introduction/
gitment:
enable: true
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: {you github user id}
github_repo: 随便写一个你的公开的git仓库就行,到时候评论会作为那个项目的issue
client_id: {刚才申请的ClientID}
client_secret: {刚才申请的Client Secret}
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

开通评论

到这里原则上就ok了,只要在每篇博客下登陆并初始化就行了,如果你运气好的话。。。。。但是因为这个东西的插件好像没人维护所以会出各种问题,在下面我总结一下会出现的问题。

问题

Error: Validation Failed

issue的Label有长度限制,对于中文博客来说,中文标题很容易就超过长度限制,所以需要做一下特殊处理,修改blog/_config.yml把permalink: :year/:month/:day/:title/ 改成:year/:month/:day/:id/ 可以解决这个问题.

Error: [Object ProgressEvent]

出现这个问题是由于作者在gitment.browser.js中硬编码了自己的服务器人证域名:https://gh-oauth.imsun.net,现在域名过期了,要么自己搭一个认证服务器,要么可以用其他人的,在gitment的issues里面找到了答案:#175,需要把Hexo你所用的主题中的引用文件给改一下,我用的是next主题,改动方法如下:
修改blog/themes/next/layout/_third-party/comments/gitment.swig,找到下面这部分代码

1
2
<link rel="stylesheet" href="https://imsun.github.io/gitment/style/default.css">
<script src="https://imsun.github.io/gitment/dist/gitment.browser.js"></script>

改为:

1
2
<link rel="stylesheet" href="https://billts.site/extra_css/gitment.css">
<script src="https://billts.site/js/gitment.js"></script>

Error: Not Found问题

owner或者repo配置错误了,注意名字和仓库名字的大小写。

其它问题

多尝试 hexo clean 后再试试,有可能是缓存没清楚的问题。
退出github再登陆,有的时候也可以解决问题。

-------------本文结束感谢您的阅读-------------
+ +