前言

莫得评论的博客莫得灵魂——鲁迅。

Gitalk是什么

Gitalk 一开始应该是github推出来配合搭建博客而做的评论插件。然而随着其他评论插件的没落，Gitalk 就火起来了。
它基于 Github Issue 和 Preact 开发。
除了支持 Hexo 外，还支持 java，php 等语言开发的博客。

为啥用Gitalk

之前其实还去看了其它的评论插件。一开始是打算用duoshuo或者disqus这两个插件其中一个（apollo主题自带）。然后:

  • duoshuo已经停止服务（还有网易云更贴）
  • disqus的需要科学上网
  • 然后在寻找其它插件的时候碰巧看到了Gitalk，一定是特别的缘分。（其实是看到了git三个字眼）

搭建步骤

  1. 在github搭建一个仓库来存放评论(因为我的hexo博客是和githubPage绑定的，就不创建新的了。直接用的我的博客仓库)
  2. 把仓库Issue开启（这个好像是默认开启的，如果没改的话就不用动了）
  3. 注册申请一个Github Application(点击此处可进入)
    创建好了之后，复制你的ClientID，ClientSecret。
  4. 在hexo主题下的config.yml文件加入这段：
1
2
3
4
5
6
7
8
gitalk:
    enable: true #用来做启用判断可以不用，目前没有写相关逻辑
    owner: #Github 用户名,
    repo:  #储存评论issue的github仓库名
    admin: [] #Github 用户名,
    oauth:
        clientID:  #`Github Application clientID`
        clientSecret:  #`Github Application clientSecret`
  1. 找到hexo主题内的评论模板comment.jade和头部模板head.jade，在里面新加以下代码：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
// 我提前把gitalk的css和js文件下载到本地了
// 同时其中的代码根据不同的模板也不一样，这里用的jade仅供参考

// head
if theme.gitalk.enable
    link(rel="stylesheet", href=url_for("css/gitalk.1.5.0.css"))

// comment
if theme.gitalk.enable
    #gitalk-container
    script(src=url_for("js/gitalk.1.5.0.min.js"))
    script.
        var params = {
            clientID:"#{theme.gitalk.oauth.clientID}",
            clientSecret:"#{theme.gitalk.oauth.clientSecret}",
            repo:"#{theme.gitalk.repo}",
            admin:"#{theme.gitalk.admin}",
            id:window.location.pathname,
            owner:"#{theme.gitalk.owner}",
            distractionFreeMode: false,
        };
        var gitalk = new Gitalk(params)
        gitalk.render('gitalk-container');

遇到的问题
一开始，我发现在调用github的api时总是报错，返回状态码为:422。由于之前422我从来没有碰到过。于是我就去搜索了一下422的含义：
422 Unprocessable Entity：请求格式正确，但是由于含有语义错误，无法响应。422 则表现为请求格式错误，但出现了 语义 错误，以至于服务端无法响应。可以理解为服务端能理解请求资源类型content-type，否则应该返回 415（Unsupported Media Type），也能理解请求实体内容，否则应该返回 400（Bad Request）。
后面我根据接口去慢慢调试，发现是请求体中的label=['Gitalk,location.pathname']参数内包含了location.pathname导致的错误。其实这里我并没想传这个location.pathname,我传的应该是pathname的value才对。 然后我才发现，原来config.yml里面的内容其实都是string类型。于是把params.id写在了comment.jade里。最后成功解决了问题。

总结

所以说，平时还是要细心点才好。不过这波也不亏。学到了http状态码的知识。422（格式正确，语义有错误），415（不支持该请求资源类型）,400（请求实体内容有误。这个一般是请求体内的参数有问题）
That’s all! Thanks for watching!