[//]: #

“Tranquilpeak中使用gitment评论系统”

目录

1. “Tranquilpeak中使用gitment评论系统”
   1. 设置OAuth app授权
   2. 配置文件设置
   3. 问题
      1. object ProgressEvent
      2. Comments Not Initialized、
      3. validation failed
   4. 参考链接

设置OAuth app授权

要使用github的gitment评论系统，需要一个repository和一个访问github的授权应用。在Personal setting->Developer settings->OAuth Apps->New OAuth Appp。

1. Application name：app的名字，随便写

2. Homepage URL：填写自己的主页地址即可

3. Application description：随便填

4. Authorization callback URL：这一步最重要，也是填写自己的博客地址，这里要注意到底是http与https，填写的一定要与自己的博客使用的一致。github会使用callback url回调传你一个code参数。

建立完成之后就可以看到其中的client_id和client_secret了。

配置文件设置

Tranquilpeak主题中已经集成了gitment的评论系统，所以直接修改这部分代码：

gitment:
    # Switch
    enable: true
    # Your Github ID (Github username):
    github_id: crotoc
    # The repo to store comments:
    repo: crotoc.github.io
    # Your client ID:
    client_id: **********
    # Your client secret:
    client_secret: **********

问题

object ProgressEvent

因为gitment开发者的一些原因，到这里使用的时候会出现object ProgressEvent的错误，需要修改tranquilpeak\layout_partial\scripts.ejs中的两处地方:

gc.src = '//imsun.github.io/gitment/dist/gitment.browser.js';
gcs.href = '//imsun.github.io/gitment/style/default.css';

修改成

gc.src = '//jjeejj.github.io/js/gitment.js';
gcs.href = '//jjeejj.github.io/css/gitment.css';

Comments Not Initialized、

这一般是Authorization callback URL配置错误或者在这一个评论区没有登录github账号。

validation failed

这是由于github issue的Label的长度限制小于50字符，我们可以将tranquilpeak\layout_partial\scripts.ejs的id由post.permalink改为post.date：

function render() {
    new Gitment({
    id: '<%= post.permalink %>'
    owner: '<%- theme.gitment.github_id %>',
    repo: '<%- theme.gitment.repo %>',
    oauth: {
    client_id: '<%- theme.gitment.client_id %>',
    client_secret: '<%- theme.gitment.client_secret %>',
    }
    }).render('gitment');
}

改成

function render() {
    new Gitment({
    id: '<%= post.date %>'
    owner: '<%- theme.gitment.github_id %>',
    repo: '<%- theme.gitment.repo %>',
    oauth: {
    client_id: '<%- theme.gitment.client_id %>',
    client_secret: '<%- theme.gitment.client_secret %>',
    }
    }).render('gitment');
}

参考链接

https://blog.csdn.net/du_milestone/article/details/83048444
https://blog.csdn.net/yen_csdn/article/details/80142392
https://github.com/imsun/gitment/issues/170