与世界分享世界

饮夏


  • 首页
  • 归档
  • 分类
  • 标签
  • 关于
  •    

© 2025 饮夏

评论系统的又一次折腾

发布于 2020-07-19 blog  blog插件 

评论系统的又一次折腾

这次主要添加了这些功能:

  • 如果填写的是QQ邮箱,评论的头像将自动拉取QQ头像。(valine更新了昵称处填写QQ号自动拉取昵称与头像,该方法已废弃)
  • 现在回复可以收到邮件提醒了。

可以点击这里 看看前情提要,因为用的主题比较小众的原因,许多造轮子大佬都没眷顾到这里,所以一些简单的功能也还是得自己来做。就像网站右下角新加的aplayer 一样,不过谁让这个主题这么好看呢!

而且其实现在开源社区也使得技术下沉到大部分问题都可以百度解决。自己搞定一个需求的快乐也是玩博客的一部分。所以废话结束,笔记开始。

识别QQ邮箱并拉取QQ头像

这部分功能参考了cungudafa的文章。

主要用到的是这个接口:

http://q1.qlogo.cn/g?b=qq&nk=QQ号&s=100

逻辑是

  1. 判断是否为QQ邮箱
  2. 将QQ号提取出来
  3. 将头像地址改为上面的接口

1.快速使用

将hexo\themes\typography\layout\partial\comments.jade中引用Valine的位置更改为:

script(src="http://git.yocoh.cn/Valine.min.js")

2.修改过程

之前的Valine是直接通过jsdelivr引用的,这次需要对js文件进行修改,所以先将Valine.min.js下载到本地。

然后打开文件,使用Ctrl+F 查找:

t.get("url")+"</a>";

定位到头像位置,在上面的;后回车,添加以下内容:

var qq_img = E.cdn+(0,s.default)(t.get("mail"))+E.params;
    if (t.get("mail").indexOf("@qq.com") >= 0) {
        var prefix = t.get("mail").replace(/@.*/, "");//前缀
        var pattern = /^\d+$/g;  //正则表达式
        var result = prefix.match(pattern);//match 是匹配的意思
        if (result !== null) {
            qq_img = "http://q1.qlogo.cn/g?b=qq&nk=" + prefix + "&s=100";
        }
    }

这段代码表示当邮箱为QQ邮箱时,通过上面的接口将头像存储在qq_img中。接下来修改后文的调用为qq_img就完成修改啦。

存放头像的元素class为vimg ,查找<img class="vimg" src=,将src中内容修改成+(qq_img)+。

image.pngfile

之后调用js文件就可以了,我准备将js、css文件整理一下全部放在一个域名下,然后通过cdn加速,不过是一个大工程呀。

这是效果图:

评论效果图

收到评论与回复时邮件提醒

提醒效果图

实现流程如下:

  1. 阿里云的邮件服务
  2. Valine-admin的配置

阿里云邮件推送

邮件服务看了很多,绕了一圈又回到了阿里云。毕竟免费实在是太香了。阿里云的配置也比较简单,官网流程引导很细致,直接跟着走应该就没问题了。

阿里云邮件服务

如果遇到问题也可以在下方给我留言。

既然都已经安装了hexo,安装了主题,安装了valine走到这里了,应该也不可能会有问题吧。

Valine-admin配置

Valine-admin是zhaojun大神为Valine写的一个拓展应用,专门用于增强邮件通知。

快速配置

首先最重要的是Valine已经可以正常使用了,然后进入 Leancloud对应的应用中。

点击云引擎 -> 部署,填写代码库https://github.com/zhaojun1998/Valine-Admin

配置设置

git部署

环境变量

在云引擎 -> 设置中设置环境变量:

环境变量设置

以下是各参数含义:

  • SITE_NAME : 网站名称。
  • SITE_URL : 网站地址, 最后不要加 / 。
  • SMTP_USER : SMTP 服务用户名,一般为邮箱地址。
  • SMTP_PASS : SMTP 密码,一般为授权码,而不是邮箱的登陆密码,请自行查询对应邮件服务商的获取方式
  • SMTP_SERVICE : 邮件服务提供商,支持 QQ、163、126、Gmail、"Yahoo"、...... ,全部支持请参考 : Nodemailer Supported services。
  • SENDER_NAME : 寄件人名称。
  • TO_EMAIL: 指定站长收信邮箱,默认值为 SITE_USER。用于 SMTP 发件人与站长收件人不一致的情况下使用。

因为我使用的是阿里云,所以设置自定义邮件服务器:

  • SMTP_HOST : 邮件服务提供商 SMTP 地址,如 阿里云 : smtpdm.aliyun.com,此项需要自行查询或询问其服务商。
  • SMTP_PORT : 邮件服务提供商 SMTP 端口, 此项需要自行查询或询问其服务商。阿里云默认为25,80
  • SMTP_SECURE : 是否启用加密, 默认为 true,一般不需要设置,如有特殊请自行配置。 此项需要自行查询或询问其服务商。

注: 配置自定义邮件服务器的话,请不要同时配置 SMTP_SERVICE。当 SMTP_SERVICE 未配置时才会启用自定义邮件服务

主题:

分别为默认主题和 rainbow 彩虹主题,我直接选用rainbow了。

  • TEMPLATE_NAME:rainbow/default

还能绑定管理域名:

如果是国内版的Lean Engine的话,绑定的域名需要备案。在设置->域名绑定界面填写想要绑定的域名,然后在域名提供商填写一条新的CNAME解析。等待验证通过后,再添加一条环境变量:ADMIN_URL,参数填域名。

之后在管理域名配置

这里填写邮箱,用户名和密码。

为了安全考虑,email 必须为配置中的 SMTP_USER 或 TO_EMAIL, 否则不允许登录

这样子就能用自己的域名访问管理评论啦。

休眠

LeanCloud免费版是会强制休眠的:

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

为了出现这种情况,我们使用定时器让其在7-23点之间每20分钟访问一次,这样就可以保持每天绝大多数时间是正常的。

定时任务

点击云引擎->定时任务->创建定时任务,名称可以随意填写,函数选择self_wake,Cron表达式写为0 */20 7-23 * * ?之后就可以在日志中看到提示了。

日志提示

最后,使用resend-mails函数,Cron写为0 59 7 * * *,表示每天早上检查漏发的通知邮件并补发。这样子的话就可以最大限度地保证不会出现漏发的情况了。当然,为了稳定最好还是升级至标准版。

写在最后

如果需要微信或QQ进行通知,请参阅:antmoe的文章

如果需要阅读Valine官方文档,请参阅:Valine

如果需要阅读Valine-admin的文档,请参阅:Valine-admin

如果想要体验评论或者有其他问题,请随时在下方评论骚扰。

peace yo~

分享到 

 上一篇: 偶尔也想好好的过完一生 下一篇: 不用命令行给自己搭一个图床吧 

© 2025 饮夏