邮件激活流程

  • 创建一个邮件激活文件夹

在文件夹下创建一个public文件夹来存放前端代码,再在激活邮件文件夹下创建一个index.js文件,初始化npm init,引入express模块npm install express,引入multer模块npm install nodemulter。

  • 首先想将后端的固定代码写上
var express = require('express')
var web = express()
web.use(express.static('public'))
var bodyPArser = require('body-parser')
web.use(bodyParser.urlencoded({extended:false}))

web.listen(function(req,res){
console.log('8080启动........')
}
复制代码
  • 前端给注册按钮添加一个点击事件,使用Ajax请求,
 <h1>注册页面</h1>
    <label for=""></label><input id="user" type="text"><br>
    <label for=""></label><input id="psw" type="text"><br>
    <button onclick="clickRegist()">注册</button>
    <script src="https://juejin.cn/post/jquery.js"></script>
    <script>
        function clickRegist(){ 
            var user = document.getElementById('user').value 
            var psw = document.getElementById('psw').value 
            
            $.ajax({
                url:"/regist" , 
                method:"post",
                data:{
                    account : user , 
                    psw : psw  
                } ,
                success(res){
                    console.log(res);
                }
            })
        }
    </script>
复制代码
  • 后端接收注册信息,先判断后端是否存在一个user.txt数组用来存放注册的信息,
var allUsers = []
fs.access('user.txt' , function(noExists){
    if(noExists){
        fs.writeFileSync("user.txt" , '[]')
    }
    else {
        fs.readFile("user.txt" , 'utf-8' , function(err, data){
            allUsers = JSON.parse(data)
        })
    }
})
复制代码

在后端引用nodemuiler模块,创捷一个配置对象

var nodemailer = require('nodemailer')

var config = {
    host:"SMTP.QQ.com" ,
    port: 25  ,
    auth:{
        user:"834684478@qq.com",
        pass:"cjeockzjjiaubbac"
    }
}

var postMail = nodemailer.createTransport(config)
复制代码

接收前端ajax请求,利用for循环和allUsers数组内存的账号信息来判断账号是否已注册,若未注册,将最新的账户信息push进allUsers数组内,,并将最新的数组内的信息写入user.txt文件内,请求发送postMail

postMail.sendMail({
        from:"834684478@qq.com" , 
        to:req.body.account  , 
        subject:"XXX网账户激活通知" ,
        html:`尊敬的XXX用户,请点击<a href='http://localhost:8080/active?account=${account}'>以下链接,进行账户激活</a>`
    })
复制代码

使用一个get请求来激活邮箱,首先接收到需要激活的已注册的账号,在allUsers数组里找到当前激活账号的索引值,将该账号定义为user,给盖章号新增一个激活属性,返回给前端一个跳转信息,直接跳转到登录界面。

web.get("/active" , function(req ,res){
    console.log(req.query.account);
    var index = allUsers.findIndex(function(el){
        return el.account == req.query.account 
    })
    var user = allUsers[index]   // user = {account , psw}
    user.isActive = true 
    res.send(`
    <script>
            location.href="https://juejin.cn/post/login.html"
    </script>`)
})
复制代码
  • 给前端的登录界面设置基本信息,将注册界面复制修改一下接口,点击事件即可。
<h1>登录</h1>
    <label for=""></label><input id="user" type="text"><br>
    <label for=""></label><input id="psw" type="text"><br>
    <button onclick="clickLogin()">登录</button>
    <script src="https://juejin.cn/post/jquery.js"></script>
    <script>
        function clickLogin(){ 
            var user = document.getElementById('user').value 
            var psw = document.getElementById('psw').value 
            
            $.ajax({
                url:"/login" , 
                method:"post",
                data:{
                    account : user , 
                    psw : psw  
                } ,
                success(res){
                    console.log(res);
                }
            })
        }
    </script>
复制代码
  • 在后端接收登录的post请求,接收到前端发送的账号和密码,将接收到的信息在数组allUsers里进行循环对比,账号相同密码相同已激活,则返回给前端“登陆成功”。
web.post('/login',function(req , res){
    
    var account = req.body.account 
    var psw = req.body.psw 
    for(var index = 0 ; index < allUsers.length; index ++){
        var user = allUsers[index] 
        if( user.account == account){
            if(user.psw == psw){
                if(user.isActive == true){
                    res.cookie('user',)
                    res.send('登录成功')
                }
                else{
                    res.send('未激活')
                }
                return
            }
            else{
                res.send('密码错误')
                return
            }
        }

    }
    res.send('账号未注册')
})
复制代码
© 版权声明
THE END
喜欢就支持一下吧
点赞0 分享