最近在Github Pages上使用Jekyll搭建了個人博客( jacobpan3g.github.io/cn ),當需要添加評論系統時,找了一下國內的幾個第三方評論系統,如“多說”,“暢言”,“友言”,“新浪雲跟貼”:
- 多說,曾經較火的評論系統,網上介紹文章比較多,但已關閉,無法再用了
- 暢言,sohu旗下的,但是需要個人博客備案后才能使用,但github pages個人博客感覺備案比較難
- 友言,jiaThis旗下的,由於時http請求,github pages現在都是https了, 在https站點無法調用http請求,故也無法使用
- 網易雲跟貼,曾被當作“多說”的替代品,可惜官方通報說也將在2017.08.01關閉了
再看看disqus,國外比較火的評論系統,但在國內牆了,故也不考慮。
綜上,國內幾個比較主流的評論系統目前都無法在Github Pages上的個人博客使用, 后面我發現了gitment,一款由國內大神imsun開發的基於github issues的評論系統, 具體介紹請看項目主頁( github.com/imsun/gitment )。
目前我已經成功把gitment應用到了自己的Github pages個人博客里,過程中碰了一些壁, 同時發現網上關於gitment的介紹並不多,故寫一篇總結,希望可以幫助到大家。
1. 申請一個Github OAuth Application
Github頭像下拉菜單 > Settings > 左邊Developer settings下的OAuth Application > Register a new application,填寫相關信息:
Application name
,Homepage URL
,Application description
都可以隨意填寫Authorization callback URL
一定要寫自己Github Pages的URL
(ps: 之前我自己就是在這里碰壁了,調試半天才發現)- 填寫完上述信息后按
Register application
按鈕,得到Client ID
和Client Secret
2. 在jekyll博客調用gitment
如gitment項目頁Readme所示,在你需要添加評論系統的地方,一般是_layout/
目錄下的 post.html
, 添加一下代碼
<div id="gitmentContainer"></div>
<link rel="stylesheet" href="https://imsun.github.io/gitment/style/default.css">
<script src="https://imsun.github.io/gitment/dist/gitment.browser.js"></script>
<script>
var gitment = new Gitment({
owner: 'Your GitHub username',
repo: 'The repo to store comments',
oauth: {
client_id: 'Your client ID',
client_secret: 'Your client secret',
},
});
gitment.render('gitmentContainer');
</script>
需要修改的有4個地方
- Your GitHub username:填寫你的Github Pages博客所在的github賬戶名
- The repo to store comments:填寫用來存放評論的github倉庫,由於評論是 通過issues來存放的,個人建議這里可以直接填Github Pages個人博客所在的倉庫
- Your client ID:第1步所申請到的應用的Client ID
- Your client secret:第1步所申請到的應用的Client Secret
填寫完這4項把代碼保存上傳到github就可以了。
3. 為每篇博文初始化評論系統
由於gitment的原理是為每一遍博文以其URL作為標識創建一個github issue, 對該篇博客的評論就是對這個issue的評論。因此,我們需要為每篇博文初始化一下評論系統, 初始化后,你可以在你的github上會創建相對應的issue。
接下來,介紹一下如何初始化評論系統
-
上面第2步代碼添加成功並上傳后,你就可以在你的博文頁下面看到一個評論框,還 有看到以下錯誤
Error: Comments Not Initialized
,提示該篇博文的評論系統還沒初始化 -
點擊
Login with GitHub
后,使用自己的github賬號登錄后,就可以在上面錯誤信息 處看到一個Initialize Comments
的按鈕
(ps: 由於要求回調URL和當前地址一樣,故第2步不能在本地調試, 需把代碼先上傳再調試) -
點擊
Initialize Comments
按鈕后,就可以開始對該篇博文開始評論了, 同時也可以在對應的github倉庫看到相應的issue
4. 一些問題
- 安全問題
有些讀者擔心github oauth application的client secret這樣明文寫在頁面上會不會有安全 隱患,我也考慮到這個問題,目前我能想到比較好的解決方法是:注冊一個github小號, 在小號里注冊oauth application,使用小號app的client secret
- 回調URL
有些讀者反映登錄不成功,請大家一定要確認github oauth application里的回調URL一定要 填寫要使用gitment的博客的URL,這一點十分重要
好了,gitment使用介紹到這里,大家若遇到什么問題盡管在下面留言,或者在我的個人博客 ( jacobpan3g.github.io/cn )留言,上面使用的評論系統就是gitment,我會抽空 一一作出回答。