Disqus vs Valine 静态网页评论框

目录


Disqus vs Valine


Disqus


很多人都用Disqus 来做静态网页的评论系统。Disqus其实还挺不错的。 但是它有一样我不太喜欢的就是它要你登陆后才能发表评论。假如你刚好浏览到一个网页又刚好心血来潮想评论一下,谁会这么不怕麻烦去专程登陆一个平时都不怎么用的账号或者如果连这个账号没有还要注册一个Disqus的账号。更不用说加载这个评论插件很可能会拖慢这个网页的速度,这个对搜索引擎优化和用户体验都有很大的影响。



Valine


我碰巧看到这个叫Valine 。如果发评论就会发现,这个评论系统不需要登陆, 可以匿名评论。而且它提供各条博文的点击计数和评论数给你调用。最后它是异步所以不会拖慢网页加载速度。但是Valine也有缺点。国际账号注册调用API不太稳定,有时会有不能调取评论的问题。


如何设置Valine


leancloud.cn 注册一个账号并且创建一个应用。你会获得appId和appKey,然后需要把你的域名加到安全中心的Web安全域名。然后只需在你的网页上加入下面的代码就可以调用它的API然后自动在id为vcomment的

里生成评论框:


 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
<head>
    ...
    <script src='//unpkg.com/valine/dist/Valine.min.js'></script>
    ...
</head>
<body>
    ...
    <div id="vcomment"></div>
    <script>
        new Valine({
            el: '#vcomment' ,
            appId: 'Your appId',
            appKey: 'Your appKey'
        });
    </script>
</body>

注意

重要的一步


我发现这一步几乎在所有文档里都找不到。如果你漏掉这部,Chrome开发者console里会有两条比较奇怪的错误信息 “xxx site has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.” 你的counter是用不了的。这个还需要自己添加一个叫Counter的类(如下图所示)。 这里不得不吐槽一句,自动创建就这么难吗,就算不是自动创建,文档写清楚点就不行吗..