您好,登錄后才能下訂單哦!
這篇文章主要講解了“nodejs怎么實現發送郵箱驗證碼功能”,文中的講解內容簡單清晰,易于學習與理解,下面請大家跟著小編的思路慢慢深入,一起來研究和學習“nodejs怎么實現發送郵箱驗證碼功能”吧!
1、使用模塊:nodemailer
安裝:npm install nodemailer --save
2、首先是來寫一下前臺注冊界面,不說了,先上圖。(不想看這一段的話直接跳到最后看郵箱驗證碼的實現)
然后實現以下以下效果(看圖先),就是點擊發送驗證碼時出現一分鐘后再試的倒計時。
那現在先上代碼先
(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="發送驗證碼"> <input type="text" name="code" placeholder="請輸入驗證碼..." id="code"> </div> <input type="submit" class="btn"> </form>
(2)倒計時函數
<script> function abc() { var time = 60;//定義60秒的倒計時 var email = $('#email').val();//獲取輸入框的郵箱 var user_name = $('#form-username').val();//獲取輸入的賬戶名 //這里我用的是ajax將用戶名和郵箱發到后臺 $.get('/api/email', { email:email, user_name:user_name }, function (data) { console.log(data) } ) //設置一個定時,一秒執行一次 var mytime = setInterval(function () { subs(); },1000) function subs(){ time--; $('#emialcore').attr("value","請"+time+"秒后再試"); if(time===0){ clearInterval(mytime); $('#emialcore').attr("value","發送驗證碼"); $('#emialcore').attr("disabled",false);//按鍵可用 } else{ $('#emialcore').attr("disabled",true);//按鍵不可用 } } } </script>
現在前臺的注冊頁面就可以用了。
(2)發送郵箱
第一步:前往郵箱設置,以163郵箱為例,開啟POP3/SMTP/IMAP,若不會,自行百度
第二步:新建一個nodemailer.js文件寫發送郵件的配置信息,上代碼
//nodemailer.js const nodemailer = require('nodemailer'); //創建一個smtp服務器 const config = { host: 'smtp.163.com', port: 465, auth: { user: '這里寫你自己的163郵箱@163.com', //注冊的163郵箱賬號 pass: 'xxxxxxx' //郵箱的授權碼,不是注冊時的密碼,等你開啟的stmp服務自然就會知道了 } }; // 創建一個SMTP客戶端對象 const transporter = nodemailer.createTransport(config); //發送郵件 module.exports = function (mail){ transporter.sendMail(mail, function(error, info){ if(error) { return console.log(error); } console.log('mail sent:', info.response); }); };
第三步:發送驗證碼
router.get('/email',async (ctx)=>{ var email = ctx.query.email;//剛剛從前臺傳過來的郵箱 var user_name = ctx.query.user_name;//剛剛從前臺傳過來用戶名 var code = await tools.createSixNum();//這里是我寫的生成的隨機六位數,等等下面給代碼 var date = new Date();//獲取當前時間 var isLive = "no"; //去數據庫中找有沒有同名的用戶名,這里就要自己寫了,不同的數據庫查詢方法不同 var result =await DB.find('user',{user_name:user_name}); //console.log(result); if(result.length>0){ ctx.body ={success:false,message:"賬號已經存在"} }else{ ctx.body ={success:true,message:"賬號可行"};//數據傳回前臺 var mail = { // 發件人 from: '<你自己的163郵箱@163.com>', // 主題 subject: '接受憑證',//郵箱主題 // 收件人 to:email,//前臺傳過來的郵箱 // 郵件內容,HTML格式 text: '用'+code+'作為你的驗證碼'//發送驗證碼 }; var json = {user_name,email,code,date,isLive}; await DB.insert('user',json);//將獲取到的驗證碼存進數據庫,待會提交時要檢查是不是一致 await nodemail(mail);//發送郵件 } })
因為發的是六位數字的驗證碼,這里我寫了一個隨機生成六位隨機數的函數:
createSixNum(){ var Num=""; for(var i=0;i<6;i++) { Num+=Math.floor(Math.random()*10); } return Num; }
接下來就可以正常發送了,見下圖
發送完了驗證碼,輸入完驗證碼還要驗證一下是否真確
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;//獲取你輸入的驗證碼 //去數據庫把剛剛在存驗證碼的時候一起存的那條記錄找出來 var result =await DB.find('user',{"user_name":username}); var nowDate = (new Date()).getTime();//獲取當前時間 判斷驗證碼是否正確,時間是否超過10分鐘 if(result[0].code===code && (result[0].date.getTime()) - nowDate <600000){ //更新數據庫的用戶信息,把用戶密碼深的也存進去 await DB.update('user',{user_name:username},{ "password":password, "status":1, "isLive":"yes",//注冊成功啦 "add_time":tools.getTime() }); }else{ ctx.render('admin/error',{ //驗證碼過期或者是驗證碼錯誤,要寫點什么的話自己再去寫寫吧。 }) } });
感謝各位的閱讀,以上就是“nodejs怎么實現發送郵箱驗證碼功能”的內容了,經過本文的學習后,相信大家對nodejs怎么實現發送郵箱驗證碼功能這一問題有了更深刻的體會,具體使用情況還需要大家實踐驗證。這里是億速云,小編將為大家推送更多相關知識點的文章,歡迎關注!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。