[Gitalk] 集成Gitalk时踩过的那些坑

gitalk的集成看起来很简单，一共就以下三步。

1. 登录github，进入Setting/Developer settings，新创建一个OAuth App,填写应用名，主页url，回调url;

2. 在使用gitalk的页面里引用官方提供的gitalk js 和 css

<link rel="stylesheet" href="//cdn.bootcss.com/gitalk/1.5.0/gitalk.min.css">
<script src="//cdn.bootcss.com/gitalk/1.5.0/gitalk.min.js"></script>

3. 在页面上创建占位html标签，创建gitalk对象并渲染

<div id="gitalk-container" style="margin: 30px;padding-bottom: 30px;"></div>
         <script>
            var gitalk = new Gitalk({
                clientID: '', // GitHub Application Client ID
                clientSecret: '', // GitHub Application Client Secret
                repo: '',      // 存放评论的仓库
                owner: '',          // 仓库的创建者，
                admin: [],        // 如果仓库有多个人可以操作，那么在这里以数组形式写出
                id: md5(location.pathname),      // 用于标记评论是哪个页面的，确保唯一，并且长度小于50
                title: document.title,
                body:  '文章链接：'+ decodeURIComponent(location.origin+location.pathname),
            })
            gitalk.render('gitalk-container');    // 渲染Gitalk评论组件
        </script>

但是其中有些坑，还是需要注意的

1. 你是给自己账号下的仓库创建App还是给组织账号下的仓库创建App

如果是给自己用，直接从Developer settings进去建App,如果是给组织建，就要从Organization settings 进到组织账号下的Developer settings建App。

2. gitalk的第一次登录

把gitalk加好后，第一次进入页面，会显示需要用github账号登录，从控制台里看，浏览器访问 https://api.github.com/user 返回 401。这是因为需要给github账号授权使用gitalk，这个时候，只有当前页面的域名和之前配置的Authorization callback URL 在同一个域下，才能成功进入授权页面。例如，在开发时，我的页面链接是http://localhost:8080/article/1，那Authorization callback URL 和 Home Page URL都要用http://localhost:8080。上线之后再改回正确的域名。成功登陆后，设置页面会显示有了第一位用户。

3. 实例化Gitalk对象时repo、owner、admin的设置

找到你想创建gitalk的那个仓库，比如：

owner就是 Windower ，repo 就是 Lua,admin是个数组，里面一定要有创建者登陆github用的名字，如果填错了，评论框会报错

4. repo下如果一个issues都没有，就手动创建一条issues

5. id要填能区分页面唯一性的字符串，比如页面链接，但是要注意长度限制，所以可以用md5转换一下。如果是单页应用，请找出每个路由下能区分页面唯一性的字符串，并且在路由切换的时候重新设置此id

6. title会被用作创建issue的标题，body会被用作issue的第一条评论