返回

使用 Gitalk 作为网站评论功能

参考1:https://huanghg.github.io/posts/ghcomment/

参考2:https://github.com/gitalk/gitalk/blob/master/readme-cn.md

申请 GitHub Application

如果没有 点击这里申请, 填写内容:

a

引入配置

js:

  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/gitalk@1/dist/gitalk.css">
  <script src="https://cdn.jsdelivr.net/npm/gitalk@1/dist/gitalk.min.js"></script>
  <div id="gitalk-container"></div>

  var gitalk = new Gitalk({
  clientID: 'GitHub Application Client ID',
  clientSecret: 'GitHub Application Client Secret',
  repo: 'GitHub repo',
  owner: 'GitHub repo owner',
  admin: ['GitHub repo owner and collaborators, only these guys can initialize github issues'],
  id: location.pathname,      // Ensure uniqueness and length less than 50
  
  distractionFreeMode: false  // Facebook-like distraction free mode
})

gitalk.render('gitalk-container')

其中 clientID 去 Github: Settings Developer-settings tzou24-gitalk 中获取。

问题记录

1、Error: Issues are disabled for this repo.

打开你的仓库:Settings->General->Features 勾选 Issues 即可。

2、Error: Validation Failed.

原因是:id: location.pathname, // Ensure uniqueness and length less than 50 引入时已经说明了中文和长度有限制。解决方案是增加 MD5 对 pathname 进行加密,从而避免长度和中文问题。将 https://github.com/blueimp/JavaScript-MD5/blob/master/js/md5.min.js 其加密 js 拷贝至自己的项目中。然后进行引用和修改:

  <script src="https://tzou24.github.io/assets/js/md5.min.js"></script>
  
  //...
  
  //id: location.pathname,      // Ensure uniqueness and length less than 50
   id: md5(location.pathname),

查看成果