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 进行评论

这个当时弄了好久,在网上看各种方法,都解决不了,网上说出现这情况的原因:

  1. 当时 Authorization callback URL 没设 https ——>不可能啊,直接复制浏览器上的,肯定是 https 的
  2. 配置 gitalk 选项时 admin 填错了——>这个也没错
  3. 存放评论的仓库没有 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,并设置上 labels

每个页面使用到 gitalk,应该单独设置一条 issue

按上面那样设置好页面对应的 issue 后,然后刷新页面,就解决问题了。

posted @ 2021-04-30 18:32  夜光星空  阅读(532)  评论(3编辑  收藏  举报