Gitalk 评论插件使用指南
更详细用法看官网https://github.com/gitalk/gitalk/blob/master/readme-cn.md ,这里只是记录下有诱惑的具体操作。
1.申请秘钥
申请一个 OAuth application https://github.com/settings/applications/new
获取 ID 和 secrets,必须要保存好,然后以后就看不到了,忘记了只能重建。
2.Gitalk 的参数
我这里是 react,其他的安装官网使用即可。
import React from 'react';
import 'gitalk/dist/gitalk.css';
import GitalkComponent from 'gitalk/dist/gitalk-component';
export default ({ id }) => {
return (
<GitalkComponent
options={{
clientID: '0259e9879ce2154fa035', // 上面申请到的
clientSecret: 'bcxxxxxxxxxxx',
repo: 'lucas270.github.io', //存放评论的仓库名称,可以是随便一个仓库,这里就用博客仓库好了。
owner: 'lucas270', //github用户名
admin: ['lcuas270'], //这博客仓库可以操作的用户名
id: id, //唯一值,用来标记是哪个页面的评论,可以用window.location.pathname,我这里用到的地方不多,所以就为每个页面手动设置了
}}
/>
);
};
问题 1:Error: Not Found
这是repo填错了,导致说没有找到这个仓库,当时填了完整的仓库地址,这只要填具体名称即可
- repo: 'https://github.com/lucas270/lucas270.github.io' X
- repo: 'lucas270.github.io' √
问题 2:未找到相关的 Issues 进行评论
这个当时弄了好久,在网上看各种方法,都解决不了,网上说出现这情况的原因:
- 当时 Authorization callback URL 没设 https ——>不可能啊,直接复制浏览器上的,肯定是 https 的
- 配置 gitalk 选项时 admin 填错了——>这个也没错
- 存放评论的仓库没有 issue ——> 最坑就是这了,网上只是说去手动建一条 issue 即可,但没说 那条 issue 的 label 必须同时是 gitalk 的 label 和你在页面使用时配置的 id
我们可以在示例中https://github.com/gitalk/gitalk/issues/1 看到它的 labels 是 Gitalk 和 Demo (插件默认的 labels 是 Gitalk),然后在源码第 138 行https://github.com/gitalk/gitalk.github.io/blob/master/index.html 看到设的 id 是 Demo
按上面那样设置好页面对应的 issue 后,然后刷新页面,就解决问题了。