博客中引入了gitment评论系统
官方github地址:https://github.com/imsun/gitment
官方中文说明地址:https://imsun.net/posts/gitment-introduction/
官方地址已经很详细了,这里只是针对搭建过程做个总结。自己第一次搭用了半天(碰到坑),后帮别人搭建用了三分钟。
github端
gitment评论系统基于github的issue,所以需要做以下几点:
1.注册一个github的Oauth服务 注册地址。
2.新建一个仓库(使用现有仓库忽略)。
3.保证开启了仓库的issue功能。
应用端
把以下资源放到模板即可,有一点需要注意(也是第一次搭建踩坑的教训),如果用的是vue作为前端框架建站,一定要把代码放到渲染(如默认的'<div id='app'></div>')外边,否则会初始化失败。具体原因没有深究(关键是技术不到家),解决了的可以在下方gitment留言讨论一下。
1.引入css/js
<link rel='stylesheet' href='https://imsun.github.io/gitment/style/default.css'>
<script src='https://imsun.github.io/gitment/dist/gitment.browser.js'></script>
2.引入代码
const gitment = new Gitment({
id: 'Your page ID', // optional
owner: 'Your GitHub ID',
repo: 'The repo to store comments',
oauth: {
client_id: 'Your client ID',
client_secret: 'Your client secret',
},
})
gitment.render('comments')
页面端
做好上边几个准备后,如果是仓库所有者和github登录着是一个人的话,页面会出现一个用于初始化的按钮,点击后,就可以评论了。