今晚下班，不用回家带娃娃，赶紧抽时间码下hexo的评论接入，话说期间遇到的坑也不少，典型的几个问题下边会重点提一下，话不多说，直接码。。

一、评论系统选型

  • 多说——>2017年已经关闭了服务
  • 畅言——>应该是响应国家言论自由的方针，需要备案，没错需要备案，你没看错
  • 友言——>无奈也已经关闭了
  • gitment–> 是由基于github issues的系统评论，需要有github账号，考虑到看技术博客的同行，应该都有github吧.
  • Hypercomments—->大体喵了几眼，看着比较麻烦，没有深入去了解

    综上，我选择了gitment，对我来说已经足够可用了，点赞，评论都支持的。

二、gitment简介

  • 基于github issues，实际上是为每一篇博客文章都关联一个issue，所有相关的评论都是对这个issue的评论。
  • 每写好一篇博客文章，都需要进行初始化
  • 需要有github账号，考虑到受众，其实还是可以接收的。
  • 接入工作量小
  • 界面清爽，不是华而不实的那种

三、接入流程

1.创建repo用于存储评论

获取repo地址：git@github.com:xxx/xxx.git

2.授权 OAuth Application

注册OAuth


进入application

 

 

注册成功后，你会得到 clientId、Client Secret接下来会使用到

3.配置MIHO相关gitment

1
2
3
4
5

gitment:
  owner: Sunltyy   #你的 GitHub ID
  repo: 'my-blog-comments'   #存储评论的 repo
  client_id: '第2步获取到的clientId' #client ID
  client_secret: '第2步获取到的secret'  #client secret

4.发布

1

hexo g -d

5.登录初始化评论

需要登录你第一步创建的repo的owner用户,然后点击Initialize Comments即可
初始化

7.收工

镇楼

遇到的坑点

gitment评论接入虽然不麻烦，但是还是遇到了不少坑点，几个比较影响效率的地方整理，发给后来人。

登录后Object ProgressEvent

登录后，跳出这个报错，实际上gitment的作者已经停掉了自己的服务器，可以找到gitemnt.ejs里的

1
2
3
4
5
6

找到 gitment.ejs里的这段引用。
<link rel="stylesheet" href="//imsun.github.io/gitment/style/default.css">
<script src="//imsun.github.io/gitment/dist/gitment.browser.js"></script>
替换为：
<link rel="stylesheet" href="https://jjeejj.github.io/css/gitment.css">
<script src="https://jjeejj.github.io/js/gitment.js"></script>

亲测试可用，如果你想自己搭建，可以这里https://github.com/imsun/gitment/issues/170

初始化评论Invalid Error

gitment创建github issue的时候，标签长度不能大于50个字符。但查看browser.js，我们可以看到lable是如何取值的
js
js2
因此，我们需要初始化id，不能使用默认的当前页面的url， 修改gitment.ejs,添加id初始化为当前页的标题即可

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

<link rel="stylesheet" href="https://jjeejj.github.io/css/gitment.css">
<script src="https://jjeejj.github.io/js/gitment.js"></script>
<div id="comments">
    <script>
        var gitment = new Gitment({
            id :'<%=page.title%>',
            owner: 'Sunltyy',
            repo: 'my-blog-comments',
            oauth: {
                client_id: '你申请的Id',
                client_secret: '你申请的密钥',
            },
        })
        gitment.render('comments')
    </script>
</div>

希望，这篇文章能帮助到你 【- -】

Logo
AtomGit 开源协作平台测评赛

瓜分20万奖金 获得内推名额 丰厚实物奖励 易参与易上手

更多推荐

ADS1292R 使用 过程 心电图 高精度ADC模块

文章目录1 Fundamentals ofPrecision ADC Noise Analysis 精密模数转换器噪声分析基础1 Fundamentals ofPrecision ADC Noise Analysis 精密模数转换器噪声分析基础https://www.ti.com.cn/cn/lit/wp/slyy192/slyy192.pdf?ts=1600659610730&ref_u

avatar 开放原子开发者工作坊
cover

实现一个家庭安防与环境监测系统（一）

avatar 开放原子开发者工作坊

【cf】Codeforces Round #774 (Div. 2) 前4题

题目A. Square Counting 简单数学题目大意题解代码B. Quality vs Quantity 排序题目大意题解代码C. Factorials and Powers of Two 状态压缩dp+位运算题目大意题解代码D. Weight the Tree 树形dp+dfs题目大意题解代码E. Power Board 看起来像是数论？许多年没打cf了，偶尔打了一盘，恢复紫名了。A. S

avatar 开放原子开发者工作坊