专栏首页赵俊的Java专栏Hexo 优化 --- 支持邮件通知的评论 Valine 增强版

Hexo 优化 --- 支持邮件通知的评论 Valine 增强版

已有更简单的方式来实现,请参考: Hexo 优化 — Valine 扩展之邮件通知

前言

关于之前的 Hexo优化 --- 一款极简的评论系统,它满足了我对评论系统的一些基本要求。

但这个评论系统有一个痛点。虽然它虽然支持邮件提醒,但这个功能却很弱,无法提示到具体文章,也无法给评论者进行有效的回复通知,通常别人留完言,怎么还会再来你的博客看你是否回复了呢?。

而这款 Valine 的增强版,满足了这几个条件:

  • 完善的邮件通知,自定义 SMTP 发件频率和内容不再受限
  • 基于 Akismet 的垃圾评论自动标注和过滤
  • 评论管理,避免直接操作数据库
  • ……

邮件通知展示:

如果评论者还留下了邮箱,那么点击下面回复的时候,这个评论这也会收到相应的邮件通知:

同时会与评论者留下的邮箱发送邮件:

废话不多说了,开始配置吧。

配置

获取 APP ID 和 APP KEY

点击这里登录或注册 Leancloud 点这里创建应用,应用名看个人喜好。 选择刚刚创建的应用 > 设置 > 选择应用 Key,然后你就能看到你的 App IDApp Key 了,参考下图:

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

修改主题

可 Valine 增强版的作者,使用的并不是 Hexo 博客,更不可能 Next 主题了。所以要自己动手了。

为了不影响原版的 Valine,这里我们需要修改几个文件,使两者共存,且可随意切换。

  • 步骤一:下载 Valine.min.js 到文件夹 themes/next/source/js/src 下。
  • 步骤二:在 themes/next/layout/_third-party/comments 目录下新建文件 valine-modify.swig
{% if theme.valine_modify.enable and theme.valine_modify.appid and theme.valine_modify.appkey %}  
  <script src="//cdn1.lncld.net/static/js/3.0.4/av-min.js"></script>
  <script src="/js/src/Valine.min.js"></script>
  
  <script type="text/javascript">
    var GUEST = ['nick','mail','link'];
    var guest = '{{ theme.valine.guest_info }}';
    guest = guest.split(',').filter(item=>{
      return GUEST.indexOf(item)>-1;
    });
    new Valine({
        av: AV, 
        el: '#comments' ,
        appId: '{{ theme.valine_modify.appid }}',
        appKey: '{{ theme.valine_modify.appkey }}',
        placeholder: '{{ theme.valine_modify.placeholder }}',
    });
  </script>
{% endif %}
  • 步骤三:在 themes/next/layout/_third-party/comments 目录下修改 index.swig 文件,在最后一行添加:
  • {% include 'valine-modify.swig' %}
  • 步骤四:在 themes/next/layout/_partials 目录下修改 comments.swig 文件的最后几行: 原内容:
  • . {% elseif theme.valine.appid and theme.valine.appkey %} <div class="comments" id="comments"> </div> {% endif %} {% endif %}

修改后:

  {% elseif theme.valine.appid and theme.valine.appkey %}
    <div class="comments" id="comments">
    </div>

  {% elseif theme.valine_modify.appid and theme.valine_modify.appkey %}
    <div class="comments" id="comments">
    </div>
  {% endif %}

{% endif %}

  • 步骤五:修改 next 主题配置文件 _config ,添加以下内容:

valine_modify:

enable: true

appid: 'Your APP ID', # 这里填写上面得到的APP ID

appkey: 'Your APP KEY', # 这里填写上面得到的APP KEY

placeholder: ヾノ≧∀≦)o来啊,快活啊! # 留言框占位提示文字

同时记得把原来的 Valine 禁用

valine:

enable: false

配置后台

虽然 Valine 是无后端的,但为了实现邮件通知和垃圾评论过滤,需要部署少量的 LeanEngine 代码。不用担心,代码我都写好了,不需要本地开发环境,只要在网页点两下就能完成。

  1. 打开 LeanCloud 后台,进入云引擎设置页。 填写代码库并保存:https://github.com/panjunwen/Valine-Admin.git

注:推荐使用 https://github.com/zhaojun1998/Valine-Admin 这个库,功能一致,就是我美化了下邮件样式(见上图)。

切换到部署标签页,分支使用 master,点击部署即可:

然后默默等待部署完成。

  1. 此外,你需要设置云引擎的环境变量以提供必要的信息,如下示例:

Akismet Key 申请链接,如果你不需要反垃圾评论,Akismet Key 可以忽略。

  1. 设置二级域名后你可以访问评论管理后台。

后台登录需要账号密码,需要在这里设置,只需要填写 email、password、username,这三个字段即可,使用 usernmae 或 email 登陆即可。

  1. 设置完成后重启一下云引擎实例一切就正常工作啦!

LeanCloud 休眠策略

免费版的 LeanCloud 容器,是有强制性休眠策略的,不能 24 小时运行:

  • 每天必须休眠 6 个小时
  • 30 分钟内没有外部请求,则休眠。
  • 休眠后如果有新的外部请求实例则马上启动(但激活时发送邮件会失败)。

分析了一下上方的策略,如果不想付费的话,最佳使用方案就设置定时器,每天 7 - 23 点每 20 分钟访问一次,这样可以保持每天的绝大多数时间邮件服务是正常的。

最后附定时器代码:

1

*/20 7-23 * * * curl https://你配置的域名前缀.leanapp.cn

结语

最后感谢下 Valine 的作者和增强 Valine 的作者,本文参考: Valine: 独立博客评论系统 原 Valine 项目地址 增强版 Valine 项目地址

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • Shiro 集成 Spring

    本章我们来学习 Shiro 集成 Spring,即在 Web 环境下如何使用 Shiro 来进行权限控制。

    一份执着✘
  • Hexo优化 --- 一款极简的评论系统

    一份执着✘
  • LeetCode 929 Unique Email Addresses

    按照题意,先取 local name 的第一个字符到第一个加号之前的内容, 然后删除其中的所有 ., 并与 @ 后的 domain name 拼接, 将结果放入...

    一份执着✘
  • MongoDB 客户端 MongoVue

    今天在同事那里看到了一个很不错的MongoDB的客户端工具MongoVue,地址是http://www.mongovue.com/。做的不错,1.0版本的开始收...

    张善友
  • 中断向量 中断向量表

    1、中断标识码(中断类型号):由硬件(通常是中断控制器)产生,以标识不同的中断源。

    week
  • Joomla 3.4.6 RCE复现及分析

    前几天看了下PHP 反序列化字符逃逸学习,有大佬简化了一下joomla3.4.6rce的代码,今天来自己分析学习一下。

    徐焱
  • 基于Hadoop生态圈的数据仓库实践 —— 进阶技术(七)

    版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.n...

    用户1148526
  • 京东jos 获取授权及php-sdk的使用示例

    版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/u011415782/article/de...

    泥豆芽儿 MT
  • 加载指定bundleName照片

    - (UIImage *)imageNamed:(NSString *)name ofBundle:(NSString *)bundleName {

    ZY_FlyWay
  • Python Flask-web表单

    Flask-WTF扩展可以把处理web表单的过程变成一种愉悦的体验。 ? 一、跨站请求伪造保护 默认情况下,Flask-WTF能够保护所有表单免受跨站请求伪造的...

    用户1173509

扫码关注云+社区

领取腾讯云代金券