Hexo 博客之 valine 评论实现邮箱提醒的方法

发表于 2019-03-04 更新于 2024-05-15 分类于技术分享阅读次数：

valine 是我用过最好的博客评论系统了，非常喜欢这种不用注册帐号就可以直接使用的方式并且还支持 Markdown 语法，简直是完美。现在我要说的就是如何让评论后，博主可以第一时间用邮箱收到游客评论，而游客评论时，只要写上自己的邮箱地址，也会在第一时间收到博主的回复邮件。让 valine 更加井上添花。
作者项目地址：https://github.com/DesertsP/Valine-Admin

具体实现步骤：

1. 在 Leancloud 云引擎设置界面，填写代码库并保存：`https://github.com/DesertsP/Valine-Admin.git`

2. 接着在设置里添加环境变量。

变量	示例	说明
SITE_NAME	思想就是武器	[必填] 博客名称
SITE_URL	https://zealot.top	[必填] 首页地址
SMTP_SERVICE	QQ	[新版支持] 邮件服务提供商，支持 QQ、163、126、Gmail 以及更多
SMTP_USER	xxxxxx@qq.com	[必填] SMTP 登录用户
SMTP_PASS	ccxxxxxxxxch	[必填] SMTP 登录密码（QQ 邮箱需要获取独立密码）
SENDER_NAME	思想就是武器	[必填] 发件人
SENDER_EMAIL	xxxxxx@qq.com	[必填] 发件邮箱
ADMIN_URL	https://xxx.leanapp.cn/	[建议] Web 主机二级域名，用于自动唤醒
BLOGGER_EMAIL	xxxxx@gmail.com	[可选] 博主通知收件地址，默认使用 SENDER_EMAIL
AKISMET_KEY	xxxxxxxxxxxx	[可选] Akismet Key 用于垃圾评论检测，设为 MANUAL_REVIEW 开启人工审核，留空不使用反垃圾

3. 切换到部署标签页，分支使用 master，点击部署。

第一次部署时间比较长，耐心等待他完成。

4. 等待部署完成后，如果有人在你的博客上留言，你的邮箱将会收到一封邮件。

定时任务设置

因为免费版的 LeanCloud 容器，是有强制性休眠策略的，不能 24 小时运行：

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

所以我们需要设置一个定时任务让容器一直保持在运行状态。

实现方法：
进入云引擎 - 定时任务中，创建定时器，创建两个定时任务。
1、新建定时器，选择 self-wake 云函数，Cron 表达式为 0 0/30 7-23 * * ?，表示每天早 6 点到晚 23 点每隔 30 分钟访问云引擎。

2、新建定时器，选择 self-wake 云函数，Cron 表达式为 0 0 8 * * ?，表示每天早 8 点检查过去 24 小时内漏发的通知邮件并补发：

设置完后运行定时器，这样就完美的解决了休眠策略的问题！

邮箱回执格式的设置。

邮件通知模板在云引擎环境变量中设定，可自定义通知邮件标题及内容模板。
还是在设置里的环境变量里添加下表的 4 个变量。

环境变量	示例	说明
MAIL_SUBJECT	叮咚，${PARENT_NICK}，您在『${SITE_NAME}』上的评论收到了回复：	[可选]@通知邮件主题（标题）模板
MAIL_TEMPLATE	见下文	[可选]@通知邮件内容模板
MAIL_SUBJECT_ADMIN	叮咚，『${SITE_NAME}』上有新评论了	[可选] 博主邮件通知主题模板
MAIL_TEMPLATE_ADMIN	见下文	[可选] 博主邮件通知内容模板

邮件通知包含两种，分别是被 @通知和博主通知，这两种模板都可以完全自定义。默认使用经典的蓝色风格模板（样式来源未知）。

默认被 @通知邮件内容模板如下：

<div style="border-top:2px solid #12ADDB;box-shadow:0 1px 3px #AAAAAA;line-height:180%;padding:0 15px 12px;margin:50px auto;font-size:12px;"><h2 style="border-bottom:1px solid #DDD;font-size:14px;font-weight:normal;padding:13px 0 10px 8px;">您在<a style="text-decoration:none;color: #12ADDB;" href="${SITE_URL}" target="_blank">            ${SITE_NAME}</a>上的评论有了新的回复</h2> ${PARENT_NICK} 同学，您曾发表评论：<div style="padding:0 12px 0 12px;margin-top:18px"><div style="background-color: #f5f5f5;padding: 10px 15px;margin:18px 0;word-wrap:break-word;">            ${PARENT_COMMENT}</div><p><strong>${NICK}</strong>回复说：</p><div style="background-color: #f5f5f5;padding: 10px 15px;margin:18px 0;word-wrap:break-word;"> ${COMMENT}</div><p>您可以点击<a style="text-decoration:none; color:#12addb" href="${POST_URL}" target="_blank">查看回复的完整內容</a>，欢迎再次光临<a style="text-decoration:none; color:#12addb" href="${SITE_URL}" target="_blank">${SITE_NAME}</a>。<br></p></div></div>

我根据自己的喜好修改成下面这句。

<div style="width:600px; border-top:2px solid #12ADDB;box-shadow:0 1px 3px #AAAAAA;line-height:180%;padding:0 15px 12px;margin:50px auto;font-size:12px;"><h2 style="border-bottom:1px solid #DDD;font-size:14px;font-weight:normal;padding:13px 0 10px 8px;">您在<a style="text-decoration:none;color: #12ADDB;" href="${SITE_URL}" target="_blank">            ${SITE_NAME}</a>  上的评论有了新的回复</h2> ${PARENT_NICK} 同学，您曾发表评论：<div style="padding:0 12px 0 12px;margin-top:18px"><div style="background-color: #f5f5f5;padding: 10px 15px;margin:18px 0;word-wrap:break-word;">            ${PARENT_COMMENT}</div><p><strong>${NICK}</strong>回复说：</p><div style="background-color: #f5f5f5;padding: 10px 15px;margin:18px 0;word-wrap:break-word;"> ${COMMENT}</div><p>您可以点击<a style="text-decoration:none; color:#12addb" href="${POST_URL}" target="_blank">查看回复的完整內容</a>，欢迎再次光临<a style="text-decoration:none; color:#12addb" href="${SITE_URL}" target="_blank">${SITE_NAME}</a>。<br></p></div></div>

效果如图：

默认博主通知邮件内容模板如下：

<div style="border-top:2px solid #12ADDB;box-shadow:0 1px 3px #AAAAAA;line-height:180%;padding:0 15px 12px;margin:50px auto;font-size:12px;"><h2 style="border-bottom:1px solid #DDD;font-size:14px;font-weight:normal;padding:13px 0 10px 8px;">您在<a style="text-decoration:none;color: #12ADDB;" href="${SITE_URL}" target="_blank">${SITE_NAME}</a>上的文章有了新的评论</h2><p><strong>${NICK}</strong>回复说：</p><div style="background-color: #f5f5f5;padding: 10px 15px;margin:18px 0;word-wrap:break-word;"> ${COMMENT}</div><p>您可以点击<a style="text-decoration:none; color:#12addb" href="${POST_URL}" target="_blank">查看回复的完整內容</a><br></p></div></div>