开始配置

配置好github账号
npm i --save gitalk # 安装插件
github 创建一个用于存放评论的空仓库备用,需要启用issue功能
然后需要创建 GitHub Application 如果没有 点击这里申请,
Authorization callback URL 填写GithubPages的域名 https://xxx.github.io 有专属域名的填专属域名,否则会跳转到主界面无法登陆

记录好Client ID Client secrets 等会要用

配置themes/_config.yml (巨坑 因为资料比较乱挨个测试,将近卡了一天)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
插件默认配置:

gitalk:
# 是否启用评论功能
enable: true
# 是否自动展开评论框
autoExpand: false
# 应用编号
clientID: '7e2a5d7410f4fd6a167c'
# 应用秘钥
clientSecret: '9de6847c58b787e15f1148ec4e844b3690bb8e31'
# issue仓库名
repo: ' blog-comments'
# Github名
owner: 'xiaoxindada'
# Github名
admin: ['xiaoxindada']
# Ensure uniqueness and length less than 50
id: location.pathname
# Facebook-like distraction free mode
distractionFreeMode: true

遇到问题

Error: Not Found.


通过查资料得知是_config.yml配置问题
但是检查了无数遍发现并没有配置填错
然后直到遇到这篇文章的配置

1
2
3
4
5
6
gitalk:
owner: qinggee
repo: blog-comments
clientID: 11a6f252f6224761
clientSecret: 3d1722301d3ecfc3828d137c9ea50c00a7
# 参数需要改成你自己的

替换默认的配置后奇迹般的能用了
然后遇到了 未找到相关的Issues进行评论

通过查资料得知是issues仓库没有初始化需要如下所示:

先初始化一下就好了,但是手动初始化实属浪费时间且容易出错
于是遇到了相关配置 参考文章

1
2
3
4
perPage: 15 #每页多少个评论
pagerDirection: last #排序方式是从旧到新(first)还是从新到旧(last)
createIssueManually: true #如果当前页面没有相应的 isssue ,且登录的用户属于 admin,则会自动创建 issue。如果设置为 true,则显示一个初始化页面,创建 issue 需要点击 init 按钮。
distractionFreeMode: false #是否启用快捷键(cmd|ctrl + enter) 提交评论.

添加上理论是没有问题的但是还是没用
然后通过仔细查看文章还有一个管理员用户登陆配置项

1
adminUser: "['iosite']" #管理员用户,下文也会详细讲

这个有点映像然后在官方文档中发现了此配置的修改

官方解释:

admin Array

必须. GitHub repository 的所有者和合作者 (对这个 repository 有写权限的用户)。

1
2
admin: ['xiaoxindada']  # 管理员用户登陆
createIssueManually: true # 如果 issue 仓库没有当前页面的 issue 且登陆的用户为管理员,则显示一个初始化按钮创建

加上以后完美解决

完整的配置

1
2
3
4
5
6
7
8
9
10
11
12
gitalk:
enable: true # 是否启用评论功能
autoExpand: false # 是否自动展开评论框
owner: xiaoxindada # 仓库所有者
repo: blog-comments # issue仓库名
clientID: 7e2a5d7410f4fd6a167c # 应用编号
clientSecret: 9de6847c58b787e15f1148ec4e844b3690bb8e31 # 应用秘钥
perPage: 15 # 每页多少个评论
pagerDirection: last # 排序方式是从旧到新(first)还是从新到旧(last)
admin: ['xiaoxindada'] # 管理员用户登陆
createIssueManually: true # 如果 issue 仓库没有当前页面的 issue 且登陆的用户为管理员,则显示一个初始化按钮创建issue 需要点击 init 按钮。
distractionFreeMode: false # 是否启用快捷键(cmd|ctrl + enter) 提交评论.

效果预览

最后使用 hexo deploy 部署到github
至此踩坑结束, 感觉真的很糟糕