nodejs/express 实现邮箱发送验证码

简介: nodejs/express 实现邮箱发送验证码

目录

前言


  • 开发个人网站时,注册页面可以使用邮箱验证,于是记录一下如何用nodejs/express服务器实现邮箱发送验证码,不仅可以在邮箱注册时使用,还可以拓展用于各种安全验证。

依赖包


  • nodejs服务器需要express,另外就是我们发送邮箱的包nodemailer
$ npm i express nodemailer

nodejs服务端代码


首先封装nodemailer.js文件,添加基本配置,配置前需要得到邮箱类型的port和secure还有邮箱stmp授权码。


//node_modules/nodemailer/lib/well-known/services.json可以查看相关的配置,比如这里是qq邮箱,port为465,secure为true。


image.png

邮箱—设置–账户–POP3/SMTP服务—开启—获取stmp授权码


image.png

//nodemailer.js
import nodemailer from 'nodemailer'
let nodeMail = nodemailer.createTransport({
    service: 'qq', //类型qq邮箱
    port: 465,//上文获取的port
    secure: true,//上文获取的secure
    auth: {
        user: 'xxxxx@qq.com', // 发送方的邮箱,可以选择你自己的qq邮箱
        pass: 'xxxxxxxx' // 上文获取的stmp授权码
    }
});
export default nodeMail

引入写好的nodemailer.js完成nodejs服务器app.js,掌握发送邮件对象mail的各种属性。

//app.js
import express from 'express'
import nodeMail from './nodemailer.js'
const app = express()
app.use(express.json())
app.post('/api/email', async (req, res) => {
    const email = req.body.email
    const code = String(Math.floor(Math.random() * 1000000)).padEnd(6, '0') //生成6位随机验证码
    //发送邮件
    const mail = {
        from: `"月亮前端开发"<xxxxxx@qq.com>`,// 发件人
        subject: '验证码',//邮箱主题
        to: email,//收件人,这里由post请求传递过来
        // 邮件内容,用html格式编写
        html: `
            <p>您好!</p>
            <p>您的验证码是:<strong style="color:orangered;">${code}</strong></p>
            <p>如果不是您本人操作,请无视此邮件</p>
        ` 
    };
    await nodeMail.sendMail(mail, (err, info) => {
        if (!err) {
            res.json({msg: "验证码发送成功"})
        } else {
            res.json({msg: "验证码发送失败,请稍后重试"})
        }
    })
});
app.listen(3000, () => {
    console.log("服务开启成功");
})

前端代码测试


<body>
<button onclick="test()">发送邮件</button>
<script>
    const test = async () => {
        const res = await fetch('/api/email', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json'
            },
            body: JSON.stringify({
                email: 'xxxxxxxx@qq.com'
            })
        })
        const data = await res.json()
        console.log(data)
    }
</script>
</body>

image.png

image.png

image.png

封装自己的短信发送依赖包


我们发现这个实现起来虽然不难,但是需要分将入参内容分开配置,看过去挺麻烦的。


我们不如封装属于自己的短信依赖包。有兴趣可以看看我之前的两篇文章:


nodejs npm使用攻略(如何发布属于自己的npm包)

nodejs ES6模块使用 以及 ES6代码转ES5兼容性处理

于是我封装了一个包node-send-email,npm包地址:node-send-email。不过没有测试不同邮箱的兼容性,感兴趣下个发发邮件试试,当然也建议自己DIY。

$ npm i node-send-email
// test.js
import {sendMail} from 'node-send-email'
const test = async () => {
    const code = String(Math.floor(Math.random() * 1000000)).padEnd(6, '0') //生成随机验证码
//发送邮件需要的入参
    const params = {
        //邮箱类型,@qq.com就传qq,@163.com就是传163,不传的话默认为qq,
        //其余类型可以在node_modules/node-send-email/service.js中找到。
        type: 'qq',
        // 发件人
        name: '月亮',
        // 发件箱,要与收件箱邮箱类型一致
        from: 'xxxxxxx@qq.com',
        // 发件箱smtp,需要去邮箱—设置–账户–POP3/SMTP服务—开启—获取stmp授权码
        smtp: 'xxxxxx',
        // 发送的邮件标题
        subject: '验证码',
        // 收件箱,要与发件箱邮箱类型一致
        to: 'xxxxxxx@qq.com',
        // 邮件内容,HTML格式
        html: `
            <p>您好!</p>
            <p>您的验证码是:<strong style="color:orangered;">${code}</strong></p>
            <p>如果不是您本人操作,请无视此邮件</p>
        `
    };
    await sendMail(params, (result) => {
        if (result) {
            console.log('发送成功')
        } else {
            console.log('发送失败')
        }
    })
}
test()
$ node test.js
发送成功
相关文章
|
1月前
|
JavaScript 前端开发 中间件
探索后端技术:Node.js与Express框架的完美融合
【10月更文挑战第7天】 在当今数字化时代,Web应用已成为日常生活不可或缺的一部分。本文将深入探讨后端技术的两大重要角色——Node.js和Express框架,分析它们如何通过其独特的特性和优势,为现代Web开发提供强大支持。我们将从Node.js的非阻塞I/O和事件驱动机制,到Express框架的简洁路由和中间件特性,全面解析它们的工作原理及应用场景。此外,本文还将分享一些实际开发中的小技巧,帮助你更有效地利用这些技术构建高效、可扩展的Web应用。无论你是刚入门的新手,还是经验丰富的开发者,相信这篇文章都能为你带来新的启发和思考。
|
1月前
|
开发框架 JavaScript 前端开发
使用 Node.js 和 Express 构建 Web 应用
【10月更文挑战第2天】使用 Node.js 和 Express 构建 Web 应用
|
2月前
|
Web App开发 JavaScript 前端开发
构建高效后端服务:Node.js与Express框架的实战指南
【9月更文挑战第6天】在数字化时代的潮流中,后端开发作为支撑现代Web和移动应用的核心,其重要性不言而喻。本文将深入浅出地介绍如何使用Node.js及其流行的框架Express来搭建一个高效、可扩展的后端服务。通过具体的代码示例和实践技巧,我们将探索如何利用这两个强大的工具提升开发效率和应用性能。无论你是后端开发的新手还是希望提高现有项目质量的老手,这篇文章都将为你提供有价值的见解和指导。
|
17天前
|
JavaScript 中间件 关系型数据库
构建高效的后端服务:Node.js 与 Express 的实践指南
在后端开发领域,Node.js 与 Express 的组合因其轻量级和高效性而广受欢迎。本文将深入探讨如何利用这一组合构建高性能的后端服务。我们将从 Node.js 的事件驱动和非阻塞 I/O 模型出发,解释其如何优化网络请求处理。接着,通过 Express 框架的简洁 API,展示如何快速搭建 RESTful API。文章还将涉及中间件的使用,以及如何结合 MySQL 数据库进行数据操作。最后,我们将讨论性能优化技巧,包括异步编程模式和缓存策略,以确保服务的稳定性和扩展性。
|
24天前
|
Web App开发 JavaScript 中间件
构建高效后端服务:Node.js与Express框架的完美结合
【10月更文挑战第21天】本文将引导你走进Node.js和Express框架的世界,探索它们如何共同打造一个高效、可扩展的后端服务。通过深入浅出的解释和实际代码示例,我们将一起理解这一组合的魅力所在,并学习如何利用它们来构建现代Web应用。
45 1
|
12天前
|
Web App开发 JavaScript 前端开发
探索后端开发:Node.js与Express的完美结合
【10月更文挑战第33天】本文将带领读者深入了解Node.js和Express的强强联手,通过实际案例揭示它们如何简化后端开发流程,提升应用性能。我们将一起探索这两个技术的核心概念、优势以及它们如何共同作用于现代Web开发中。准备好,让我们一起开启这场技术之旅!
29 0
|
12天前
|
Web App开发 JavaScript 前端开发
构建高效后端服务:Node.js与Express框架的实践
【10月更文挑战第33天】在数字化时代的浪潮中,后端服务的效率和可靠性成为企业竞争的关键。本文将深入探讨如何利用Node.js和Express框架构建高效且易于维护的后端服务。通过实践案例和代码示例,我们将揭示这一组合如何简化开发流程、优化性能,并提升用户体验。无论你是初学者还是有经验的开发者,这篇文章都将为你提供宝贵的见解和实用技巧。
|
14天前
|
Web App开发 JavaScript 中间件
构建高效后端服务:Node.js与Express框架的融合之道
【10月更文挑战第31天】在追求快速、灵活和高效的后端开发领域,Node.js与Express框架的结合如同咖啡遇见了奶油——完美融合。本文将带你探索这一组合如何让后端服务搭建变得既轻松又充满乐趣,同时确保你的应用能够以光速运行。
24 0
|
1月前
|
JSON JavaScript 前端开发
Node.js Express 框架
10月更文挑战第7天
30 2
|
1月前
|
JSON JavaScript 前端开发
使用 Node.js 和 Express 构建 RESTful API 服务器
【10月更文挑战第3天】使用 Node.js 和 Express 构建 RESTful API 服务器