Gitalk 是一个基于 GitHub Issue 和 Preact 开发的评论插件。
特性
使用 GitHub 登录
支持多语言 [en, zh-CN, zh-TW, es-ES, fr, ru, de, pl, ko, fa, ja]
支持个人或组织
无干扰模式（设置 distractionFreeMode 为 true 开启）
快捷键提交评论 （cmd|ctrl + enter）
项目地址：https://github.com/gitalk/gitalk/blob/master/readme.md
在线示例：https://gitalk.github.io
安装部署
准备一个github公共库
已存在或创建一个新的github存储库均可，用于存储评论。
比如我博客是这个：https://github.com/ChangSZ/blogtalk
创建Github应用
如果没有，点击这里申请：https://github.com/settings/applications/new
Authorization callback URL 填写当前使用插件页面的域名。
创建完成后你将获取Client ID 与 Client Secret。
应用Gitalk
注意：方法有很多种，大同小异，本文只介绍"在HTML页面中使用 link 与 script 标签引入"的方式，因为当前博客使用了该方式。其他方式可参考官网
<div style="text-align: center;width: 45%;margin: auto;">
<div id="gitalk-container"></div>
</div>
<link rel="stylesheet" href="https://unpkg.com/gitalk/dist/gitalk.css">
<script src="https://unpkg.com/gitalk/dist/gitalk.min.js"></script>
<script>
const gitalk = new Gitalk({
clientID: 'GitHub Application Client ID', // 78c8**********6b63d
clientSecret: 'GitHub Application Client Secret', // f0a78***************54bc749a2
repo: 'GitHub repo', // blogtalk
owner: 'GitHub repo owner', // ChangSZ
admin: ['GitHub repo owner and collaborators, only these guys can initialize github issues'], // ChangSZ
id: location.pathname, // Ensure uniqueness and length less than 50 PostID
distractionFreeMode: false, // Facebook-like distraction free mode
labels: ['Gitalk'], // [GithubLabels]
title: document.title, // PostTitle
body: location.href,
proxy: "/github/login/oauth/access_token" // 代理
});
gitalk.render('gitalk-container');
</script>踩坑
Error: Network Error
如果没有科学上网的方式，proxy是一定要设置的，默认是https://cors-anywhere.azm.workers.dev/https://github.com/login/oauth/access_token（被墙了）， 我们需要设置成
/github/login/oauth/access_token，那么实际访问会是http://water-melon.top/github/login/oauth/access_token
建议设置nginx代理转发下：
location /github {
if ($request_method = 'OPTIONS') {
return 204;
}
proxy_pass https://github.com/;
}届时，服务将访问https://github.com/login/oauth/access_token，建议你在设置之前ping github.com看能否Ping通。我的服务器是阿里云，可以Ping通。