一、个人博客系统中的评论回复通知功能需求
在精心打造个人博客系统的漫长征程中,我不遗余力地设计了一个极为实用的评论小模块。这个精心雕琢的模块拥有一项至关重要的功能:当用户 1 在博客上留下精彩的评论留言之后,用户 2 能够在用户 1 的评论下方,针对其评论展开深入的回复评论。为了确保用户 1 能够在第一时间知晓自己的评论收获了回复,我毅然决然地决定实现一个高效的邮件通知功能。每当有用户对用户 1 的评论进行回复时,系统便会自动且迅速地发送一封邮件,及时通知用户 1。
二、利用 Nodemailer 实现邮件通知功能
为了成功实现这个极具价值的邮件通知功能,我精心挑选了强大无比的 “Nodemailer” 工具。通过运用 Node.js 进行细致入微的编写,我将相关的接口妥善地放置在了云服务器之上。具体的实现细节可以参考 “JavaScript 利用 Nodemailer 发送电子邮件” 这一极具参考价值的文档。在本地服务器环境下,例如在 localhost:3000 进行全面测试时,一切都进展得无比顺利。可以正常地发送请求,并且成功地发送邮件,这一良好的测试结果让我对这个功能的实现充满了坚定的信心。
三、遇到的问题及原因分析
然而,当我将博客项目精心打包成静态页面,并托管在腾讯云开发之上后,再次进行严格测试时,却意外地遇到了棘手的问题。在浏览器控制台(Edge)中,赫然出现了以下令人困扰的错误信息。经过一番深入细致的资料查询与苦苦思索,我终于费尽周折地找到了问题的根源所在。原来,页面是通过 HTTPS 协议进行加载的,而发出的请求却是 HTTP 协议。在这种情况下,这个请求必然会被浏览器果断拦截,从而导致服务器无法顺利收到请求。就如同在旅途中遇到了一座难以跨越的山峰,让人颇感无奈。例如,在 “一路耍旅行博客” 中,[此处可插入博客截图描述或相关示例]。
四、尝试解决问题的过程
为了解决这个令人头疼的问题,我首先灵机一动,想到的办法是将服务器的接口地址配置上 SSL 证书,使得接口也能够通过 HTTPS 协议进行顺畅访问。这样一来,发送的请求也会是 HTTPS 协议,从理论上来说应该就能够完美地解决问题。但是,经过一番艰苦卓绝的努力尝试后,我却发现了一个难以逾越的难题。我仅仅只有一个博客域名,而申请的 SSL 证书是紧密绑定这个域名的,无法再绑定到 IP 地址。这就意味着我的第一次尝试以失败而告终,如同在黑暗中摸索却找不到正确的道路。
不过,我并没有因此而气馁,很快又绞尽脑汁地想到了另一个解决方案。既然只有一个域名,那我可以将博客部署到云服务器上,然后将域名解析到服务器。同时,将 API 接口放置在服务器的另一个端口上。这样一来,博客页面和 API 接口就可以使用同一个域名(只是端口号不同)。如此这般,不就都可以配置 SSL 证书,从而顺利实现 HTTPS 协议了吗!这个新的想法如同黑暗中的一盏明灯,让我充满了无限的期待。
五、具体的解决方案实施步骤
于是,我毫不犹豫地开始行动起来。首先,我将博客页面从腾讯云开发托管改为部署到云服务器,并严格按照 “nginx 下安装 SSL 证书,为页面开启 HTTPS 访问!” 的详细步骤配置 SSL 证书。然后,我对 API 接口进行了全面的修改。在原有的 API 接口(可参考 “JavaScript 利用 Nodemailer 发送电子邮件”)的基础上,我修改了 app.js 文件,添加了 https 模块来精心配置 SSL 证书。具体的代码如下:
const express = require('express');
const app = express();
const email = require('./email');
const https = require('https');
const fs = require('fs');
// 拦截所有请求
app.use ((req, res, next) => {
// 1. 允许哪些客户端访问我
// * 代表允许所有的客户端访问我
// 注意:如果跨域请求中涉及到 cookie 信息传递,值不可以为 * 号,比如是具体的域名信息
res.header ('Access-Control-Allow-Origin', 'https://lzxjack.top');
// 2. 允许客户端使用哪些请求方法访问我
res.header ('Access-Control-Allow-Methods', 'get');
// 允许客户端发送跨域请求时携带 cookie 信息
res.header ('Access-Control-Allow-Credentials', true);
next ();
});
// 博客评论收到回复后的邮件提醒服务
app.use ('/email', email);
const httpsOption = {
key: fs.readFileSync ('./SSL/lzxjack.top.key'), // 配置自己的证书
cert: fs.readFileSync ('./SSL/lzxjack.top.pem'), // 同上
};
https.createServer (httpsOption, app).listen (444);
console.log (' 服务器启动成功,监听 444 端口...');
在客户端调用接口时,也需要进行相应的调整。以 https 协议,并加上端口号 444 进行请求,如下所示:
axios({
url: 'https://lzxjack.top:444/email',
method: 'get',
params: {
name,
owner,
email: replyEmail,
search: props.postTitle,
},
withCredentials: true,
})
六、问题成功解决
经过这些不懈的努力,最终成功地解决了问题。现在,当用户回复评论时,服务器可以正常收到请求,并迅速发送提醒邮件,为用户提供了更加良好的交互体验,如同为用户打造了一个温馨舒适的交流家园。