Hexo-更换valine评论到waline

Valine作为一款无后端的评论系统的安全性是很难保证的,waline相比valine更安全。

背景

Valine和Waline，感觉上就相差肯定不多。Waline其实就是一个带后端的Valine，可以进行一些反垃圾和校验操作。

更换步骤

以下步骤基于原有系统为Valine系统的简单迁移方法。

Vercel 部署（服务端）

deploy

点击上方跳转至Vercel部署。

1. 未登录需要注册或登录，使用Github快捷登录。
2. 输入名称创建项目，Vercel会根据Waline模板新建并初始化仓库。
3. 几分钟后，满屏烟花部署成功。
4. 转到Dashboard-Setting-Environment Variables，进行环境变量配置。

环境变量配置

• 必备
  • LEAN_ID —— LeanCloud中获得的APP ID
  • LEAN_KEY —— LeanCloud中获得的APP KEY
  • LEAN_MASTER_KEY —— LeanCloud中获得的Master Key

　

以上默认LeanCloud国际版，如果是LeanCloud国内版，还要配置LEAN_SERVER环境变量，值为绑定好的域名。
点击Deployments-Redeploy重新部署。当STATUS变为Ready后，点击Visit跳转的地址即为服务端地址。

邮件提醒

• SMTP_SERVICE: SMTP 邮件发送服务提供商。支持的服务提供商列表(如果运营商不受支持，必须填写 SMTP_HOST 和 SMTP_PORT。

• SMTP_HOST: SMTP 服务器地址，一般可以在邮箱的设置中找到。

• SMTP_PORT: SMTP 服务器端口，一般可以在邮箱的设置中找到。

• SMTP_USER: SMTP 邮件发送服务的用户名，一般为登录邮箱。

• SMTP_PASS: SMTP 邮件发送服务的密码，一般为邮箱登录密码，部分邮箱(例如 163)是单独的 SMTP 密码。

• SITE_NAME: 网站名称，用于在消息中显示。

• SITE_URL: 网站地址，用于在消息中显示。

• AUTHOR_EMAIL: 博主邮箱，用来接收新评论通知。如果是博主发布的评论则不进行提醒通知。

选填:

• SENDER_NAME: 自定义发送邮件的发件人
• SENDER_EMAIL: 自定义发送邮件的发件地址
• MAIL_SUBJECT: 自定义评论回复邮件标题
• MAIL_TEMPLATE: 自定义评论回复邮件内容
• MAIL_SUBJECT_ADMIN: 自定义新评论通知邮件标题
• MAIL_TEMPLATE_ADMIN: 自定义新评论通知邮件内容

HTML 引入 (客户端)

在pure主题中，需要修改\hexo\themes_pure\layout_script_comment\valine.ejs文件。
去掉

<script src="//code.bdstatic.com/npm/leancloud-storage@4.12.0/dist/av-min.js"></script>
<script src="//unpkg.com/valine@latest/dist/Valine.min.js"></script>

加上

<script src="https://unpkg.com/@waline/client@v2/dist/waline.js"></script>
<link
  rel="stylesheet"
  href="https://unpkg.com/@waline/client@v2/dist/waline.css"
/>

去掉

new Valine({
    el: '#vcomments',
    verify: <%= theme.comment.valine.verify %>,
    notify: <%= theme.comment.valine.notify %>,
    appId: '<%= theme.comment.valine.appid %>',
    appKey: '<%= theme.comment.valine.appkey %>',
    placeholder: '<%= theme.comment.valine.placeholder %>',
    avatar: '<%= theme.comment.valine.avatar %>',
    meta: meta,
    pageSize: '<%= theme.comment.valine.pageSize %>' || 10,
    serverURLs: '<%= theme.comment.valine.serverURLs %>',
    visitor: <%= theme.comment.valine.visitor %>
  });

更换为

Waline.init({
      el: '#comments',
      serverURL: 'https://your-domain.vercel.app',
});

此时评论服务已能在博客成功运行。

评论管理（管理端）

部署完成后，在/ui/register进行注册。第一个注册的人被设定为管理员。
管理员可管理评论。
用户可通过评论框注册账号，登录后可跳转至自己的评论页。

其它

如果无法发布评论，比如报错说格式不对（要求Number结果是String）之类的，建议查看LeanCloud数据中的单元格式是否正确。

Waline配置邮件通知

Waline官网邮件通知
邮件通知模板样式

参考资料

Waline官网