
1.为什么设置评论功能
可以帮助大家及时、便利交流,促进开源社区活力~
2.可以采用哪些评论插件
在Hexo中,以本博客网站使用的Volantis主题为例,其目前共支持 14 款评论系统:
- artalk, giscus, beaudar, utterances, twikoo,
valine,waline, discuss, disqus, disqusjs, gitalk,- vssue, livere, isso, hashover
可用通过以下配置,来调用插件本次作业尝试了valine、waline插件的配置。valine是一种serverless的评论服务提供插件,但是因为不存在中转,所以valine并不安全,可以通过前端直接读取所有人评论,并获得权限,攻击博客。waline是valine的升级版,但是在2022年之后貌似不支持国内访问服务了,需要科学上网工具。因此,本次作业选择giscus进行评论系统构建。1
2
3
4
5$ vim blog/_config.volantis.yml
comments:
title: <i class='fas fa-comments'></i> 评论
subtitle:
service: giscus
3.什么是giscus?
- Giscus是一个基于Github Discussion的评论插件,可以为无服务器端的博客运营者提供简易的部署和拓展。根据官网,其存在以下特性:
- 开源!
- 无跟踪,无广告,永久免费;
- 无需数据库。全部数据均储存在 GitHub Discussions 中;
- 支持自定义主题、多种语言、高度可配置;
- 自动从 GitHub 拉取新评论与编辑;
- 可自建服务!
- 工作原理:
Giscus在加载时,会使用 GitHub Discussions 搜索 API 根据选定的映射方式(如 URL、pathname等)来查找与当前页面关联的discussion。如果找不到匹配的discussion,giscus bot就会在第一次有人留下评论或回应时自动创建一个discussion。
在评论时,访客必须按 GitHub OAuth 流程授权 giscus app 代表他发帖。或者访客也可以直接在 GitHub Discussion 里评论。你可以在 GitHub 上管理评论。
4.如何使用giscus?
大家首先要新建一个开放、可以使用Discussion的仓库,命名可以根据自己需要来,不能同网站仓库一致,因为独立存放评论内容。
然后,需要开启仓库的Discussion功能,并安装giscus app ,点击连接并且install到对应新建的仓库就可以了。
最后,我们需要在官网 注册repository,从而得到对应的服务id(哈希码)。先在网页下方,填入已经创建好的代码仓库,并选择对应的映射方式(建议用pathname便于管理评论)。
在完成上述输入后,我们选择Discussion分类,建议使用Announcements的方式,这样可以保证一个网页,一个评论区。
5.如何在Hexo中配置giscus?
在完成上述工作后,我们得到了如下图所示的script代码,接下来就可以通过Hexo覆写评论脚本和配置功能了。
首先,我们要为Hexo安装giscus插件,输入在Hexo文件夹下输入以下命令,完成安装。
本博客使用的是volantis6.0,其对应的脚本templates移动到了volantis/layout/_plugins/comments/giscus/scripts.ejs中,我们需要用上图代码覆盖scripts.ejs,从而实现评论脚本的注入。
最后,我们需要在voltantis的_config.yml中进行评论功能的配置,根据脚本提供的id、映射等信息,填充以下内容
通过Github验证后,所有用户都可以对博客进行评论了~