用 Valine.min.js 配置一个独立博客评论系统

配置后台管理、邮件通知等功能请转至 Valine Admin 配置文档

安装

安装过程非常简单，这里引用 Valine 原作者 @云淡风轻 的安装教程，稍作修改。

1. 获取 APP ID 和 APP KEY

点击这里登录或注册 Leancloud，如没有备案的话，一定要用国际版。未备案域名，2019年10月1日后将不再可用。

点这里创建应用，应用名看个人喜好。

选择刚刚创建的应用>设置>选择应用 Key，然后你就能看到你的 APP ID 和 APP KEY 了，参考下图：

为了您的数据安全，请填写应用>设置>安全设置中的 Web 安全域名，如下图：

2.  修改主题模板

在主题模板的文章页中引入相应的 js 即可，几乎所有程序适用。只需要在要调用的模板页面文件中 </body> 前插入下方的代码即可。

 <!--评论显示区，请插入合适的位置-->
    <div class="comment"></div>

<!--载入js，在</body>之前插入即可-->
    <!--Leancloud 操作库:-->
    <script src="//cdn1.lncld.net/static/js/3.0.4/av-min.js"></script>
    <!--Valine 的核心代码库-->
    <script src="你托管的Valine路径./dist/Valine.min.js"></script>
    <script>
        new Valine({
            // AV 对象来自上面引入av-min.js(老司机们不要开车➳♡゛扎心了老铁)
            av: AV, 
            el: '.comment',
            emoticon_url: 'https://cloud.panjunwen.com/alu',
      emoticon_list: ["狂汗.png","不说话.png","汗.png","坐等.png","献花.png","不高兴.png","中刀.png","害羞.png","皱眉.png","小眼睛.png","暗地观察.png"],
      app_id: '你的id',
      app_key: '你的key',
      placeholder: 'Write a Comment'
        });
    </script>

Valine.min.js 你可以使用别人的或者上传到自己的服务器或主机：Valine Ex

需要修改的只有：el、app_id 和 app_key。如果之前有用原版 Valine，请将邮件通知和验证码关掉：notify: false, verify: false，避免重复发通知。算术验证码反人类，强烈建议停用。

此外，如果你的主题没有引入  jQuery 也请引入。

<script src="https://cdnjs.loli.net/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

至此，你的评论系统已经可以工作了！是不是很简单?

如果想要后台管理评论、评论自动发邮件、防垃圾评论的话，可参考 Valine Admin 配置手册。如果想用我博客的评论界面，可用自己右键把我博客的 Valine.min.js 保存下来。

效果

前端效果：

后台演示

后台截图：

邮件通知：

小结

Valine 『无后端』已经可以很好的运行，但反垃圾评论和邮件通知还得靠后台来做，正好 LeanCloud 提供免费的云引擎和云 Hook，得以实现上述功能。LeanCloud 实在太好用了，借助官方的示例程序，连 JavaScript 语法都不懂就硬着头皮用 Nodejs 了，代码虽然很丑还是放出来，Github：Valine-Admin。另外数据迁移是用 Flask 写的，也是第一次用，所以就不放源码献丑了。

关于免费云引擎自动休眠的补充说明：

关于自动休眠的官方说法：点击查看；休眠后只影响邮件通知功能，可以在评论管理后台补发。

详见 Valine Admin 配置文档

我的做法是在 VPS 上添加一个定时任务，每天 6:00 ~ 23:00 每 20 分钟访问一次我的 leanapp 网址，防止云引擎进入休眠，保证通知邮件的及时发送。cron 定时任务：*/20 6-23 * * * curl