nodejs實現(xiàn)發(fā)送郵箱驗證碼功能

更新時間：2022年04月26日 16:54:13 作者：YmwWow

這篇文章主要為大家詳細介紹了nodejs實現(xiàn)發(fā)送郵箱驗證碼功能，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下

本文實例為大家分享了nodejs實現(xiàn)發(fā)送郵箱驗證碼的具體代碼，供大家參考，具體內(nèi)容如下

今天做了個小demo，是用nodejs實現(xiàn)注冊時（當(dāng)然在別的地方也是可以用的）的郵箱驗證功能，大體就是往指定的郵箱發(fā)送六位驗證碼。以下是詳細步驟。

1、使用模塊：nodemailer

安裝：npm install nodemailer --save

2、首先是來寫一下前臺注冊界面，不說了，先上圖。（不想看這一段的話直接跳到最后看郵箱驗證碼的實現(xiàn)）

然后實現(xiàn)以下以下效果（看圖先）,就是點擊發(fā)送驗證碼時出現(xiàn)一分鐘后再試的倒計時。

那現(xiàn)在先上代碼先

（1）form表單

<form role="form" action="doRegister" method="post" class="login-form">
? ?<div class="form-group">
? ? ? <label class="sr-only" for="form-username">Username</label>
? ? ? ?<input type="text" name="username" placeholder="請輸入賬號..." ?class="form-username form-control" id="form-username">
? ? </div>
? ? <div class="form-group">
? ? ? ?<label class="sr-only" for="form-password">Password</label>
? ? ? ?<input type="password" name="password" placeholder="請輸入密碼..." ?class="form-password form-control" id="form-password">
? ? </div>
? ? <div class="form-group">
? ? ? ?<label class="sr-only" for="form-password">Email</label>
? ? ? ?<input type="text" name="email" placeholder="請輸入郵箱..." class="form-password form-control" id="email"><br>
? ? ? ?<input type="button" ?onclick="abc()" class="btn btn-danger" id="emialcore" value="發(fā)送驗證碼">
? ? ? ?<input type="text" name="code" placeholder="請輸入驗證碼..." id="code">
? ? </div>
? ? <input type="submit" class="btn">
</form>

（2）倒計時函數(shù)

<script>
? ? ? function abc() {
? ? ? ? ? ? ? ? var time = 60;//定義60秒的倒計時
? ? ? ? ? ? ? ? var email = $('#email').val();//獲取輸入框的郵箱
? ? ? ? ? ? ? ? var user_name = $('#form-username').val();//獲取輸入的賬戶名
? ? ? ? ? ? ? ??
? ? ? ? ? ? ? ? //這里我用的是ajax將用戶名和郵箱發(fā)到后臺
? ? ? ? ? ? ? ? $.get('/api/email',
? ? ? ? ? ? ? ? ? ? {
? ? ? ? ? ? ? ? ? ? ? ? email:email,
? ? ? ? ? ? ? ? ? ? ? ? user_name:user_name
? ? ? ? ? ? ? ? ? ? },
? ? ? ? ? ? ? ? ? ? function (data) {
? ? ? ? ? ? ? ? ? ? ? ? console.log(data)
? ? ??
? ? ? ? ? ? ? ? ? ? }
? ? ? ? ? ? ? ? )
? ? ? ? ? ? ? ??
? ? ? ? ? ? ? ? //設(shè)置一個定時，一秒執(zhí)行一次
? ? ? ? ? ? ? ? var mytime = setInterval(function () {
? ? ? ? ? ? ? ? ? ? subs();
? ? ? ? ? ? ? ? },1000)
?
? ? ? ? ? ? ? ??
? ? ? ? ? ? ? ? function subs(){
? ? ? ? ? ? ? ? ? ? time--;
? ? ? ? ? ? ? ? ? ? $('#emialcore').attr("value","請"+time+"秒后再試");
? ? ? ? ? ? ? ? ? ? if(time===0){
? ? ? ? ? ? ? ? ? ? ? ? clearInterval(mytime);
? ? ? ? ? ? ? ? ? ? ? ? $('#emialcore').attr("value","發(fā)送驗證碼");
? ? ? ? ? ? ? ? ? ? ? ? $('#emialcore').attr("disabled",false);//按鍵可用
? ? ? ? ? ? ? ? ? ? } else{
? ? ? ? ? ? ? ? ? ? ? ? $('#emialcore').attr("disabled",true);//按鍵不可用
? ? ? ? ? ? ? ? ? ? }
? ? ? ? ? ? ? ? }
?
? ? ? ? ? ? ? ?
? ? ? ? ? ? }
</script>

現(xiàn)在前臺的注冊頁面就可以用了。

（2）發(fā)送郵箱

第一步：前往郵箱設(shè)置，以163郵箱為例，開啟POP3/SMTP/IMAP，若不會，自行百度

第二步：新建一個nodemailer.js文件寫發(fā)送郵件的配置信息，上代碼

//nodemailer.js
const nodemailer = require('nodemailer');
?
//創(chuàng)建一個smtp服務(wù)器
const config = {
? ? host: 'smtp.163.com',
? ? port: 465,
? ? auth: {
? ? ? ? user: '這里寫你自己的163郵箱@163.com', //注冊的163郵箱賬號
? ? ? ? pass: 'xxxxxxx' //郵箱的授權(quán)碼，不是注冊時的密碼,等你開啟的stmp服務(wù)自然就會知道了
? ? }
};
// 創(chuàng)建一個SMTP客戶端對象
const transporter = nodemailer.createTransport(config);
?
//發(fā)送郵件
module.exports = function (mail){
? ? transporter.sendMail(mail, function(error, info){
? ? ? ? if(error) {
? ? ? ? ? ? return console.log(error);
? ? ? ? }
? ? ? ? console.log('mail sent:', info.response);
? ? });
};

第三步：發(fā)送驗證碼

router.get('/email',async (ctx)=>{
?
? ? var email = ctx.query.email;//剛剛從前臺傳過來的郵箱
? ? var user_name = ctx.query.user_name;//剛剛從前臺傳過來用戶名
? ? var code = await tools.createSixNum();//這里是我寫的生成的隨機六位數(shù)，等等下面給代碼
? ? var date = new Date();//獲取當(dāng)前時間
? ? var isLive = "no";
? ? //去數(shù)據(jù)庫中找有沒有同名的用戶名，這里就要自己寫了，不同的數(shù)據(jù)庫查詢方法不同
? ? var result =await DB.find('user',{user_name:user_name});
?
? ? //console.log(result);
?
? ? if(result.length>0){
? ? ? ? ctx.body ={success:false,message:"賬號已經(jīng)存在"}
? ? }else{
? ? ? ? ctx.body ={success:true,message:"賬號可行"};//數(shù)據(jù)傳回前臺
? ? ? ? var mail = {
? ? ? ? ? ? // 發(fā)件人
? ? ? ? ? ? from: '<你自己的163郵箱@163.com>',
? ? ? ? ? ? // 主題
? ? ? ? ? ? subject: '接受憑證',//郵箱主題
? ? ? ? ? ? // 收件人
? ? ? ? ? ? to:email,//前臺傳過來的郵箱
? ? ? ? ? ? // 郵件內(nèi)容，HTML格式
? ? ? ? ? ? text: '用'+code+'作為你的驗證碼'//發(fā)送驗證碼
? ? ? ? };
?
? ? ? ? var json = {user_name,email,code,date,isLive};
? ? ? ? await DB.insert('user',json);//將獲取到的驗證碼存進數(shù)據(jù)庫，待會提交時要檢查是不是一致
? ? ? ? await nodemail(mail);//發(fā)送郵件
? ? }
})

因為發(fā)的是六位數(shù)字的驗證碼，這里我寫了一個隨機生成六位隨機數(shù)的函數(shù)：

createSixNum(){
? ? ? ? var Num="";
? ? ? ? for(var i=0;i<6;i++)
? ? ? ? {
? ? ? ? ? ? Num+=Math.floor(Math.random()*10);
? ? ? ? }
? ? ? ? return Num;
? ?}

接下來就可以正常發(fā)送了，見下圖

發(fā)送完了驗證碼，輸入完驗證碼還要驗證一下是否真確

router.post('/doRegister',async (ctx)=>{?
?
? ? //console.log(ctx.request.body);
?
? ? var username = ctx.request.body.username;//獲取用戶名
? ? var password = ctx.request.body.password;//獲取密碼
? ? var code = ctx.request.body.code;//獲取你輸入的驗證碼
? ??
? ? //去數(shù)據(jù)庫把剛剛在存驗證碼的時候一起存的那條記錄找出來
? ? var result =await DB.find('user',{"user_name":username});
?
? ? var nowDate = (new Date()).getTime();//獲取當(dāng)前時間
?
? ? 判斷驗證碼是否正確，時間是否超過10分鐘
? ? if(result[0].code===code && (result[0].date.getTime()) - nowDate <600000){
? ? ? ? //更新數(shù)據(jù)庫的用戶信息，把用戶密碼深的也存進去
? ? ? ? await DB.update('user',{user_name:username},{
? ? ? ? ? ? "password":password,
? ? ? ? ? ? "status":1,
? ? ? ? ? ? "isLive":"yes",//注冊成功啦
? ? ? ? ? ? "add_time":tools.getTime()
? ? ? ? });
? ? ? ??
? ? }else{
? ? ? ? ctx.render('admin/error',{
? ? ? ? ? ? //驗證碼過期或者是驗證碼錯誤，要寫點什么的話自己再去寫寫吧。
? ? ? ? })
?
? ? }
?
});

期間你會遇到很多錯誤，不過都是有代碼的，主義自己debug一下，看什么錯誤，然后查看163的返回錯誤代碼文件或者是自行百度。

以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章: