node+mysql+bcryptjs+vue实现一个注册、登录

给大家分享一个我最近写一个自己的博客也用到的登录注册,很多人刚入门就是对登录注册觉得很困难,其实这个不是很困难的,相对来说是比较简单的。
只要安装流程把代码复制好放进接口里面,配置一下就可以跑起来了
在这里插入图片描述

注册流程:

请求方式:post
一、客户端发送参数到服务端。
二、服务端拿到客户端的登录ID进行查重,如果有相同ID了则返回错误给客户端。
三、注册成功后返回个成功信息给客户端

登录流程:

请求方式:get
一、客户端发送用户输入登录ID以及密码给服务端。
二、服务端进行校验密码是否正确
三、密码正确返回个token。
四、客户端拿到了token后将token保存在本地缓存并且利用token获取用户数据。

需要注意

res.rr是我自己封装的一个消息回调处理,按理你们应该res.send的不要搞错了

await 需要配合 async使用

封装——复制直接用(记住需要npm 安装一下库)

mysql封装

const mysql = require('mysql');

// 创建数据库连接对象
const dbConfig = mysql.createPool({
	host: '',// 链接
	user: '',// 用户名
	password: '', // 密码填写你们自己的
	port: '3306',// 端口
	database: '', // 填写你们自己的数据库名称
})

const db = (sql) =>{
    return new Promise((resolve, reject) =>{
        dbConfig.getConnection((error, connection) =>{
            if(error){
                // 连接失败
                reject(error);
            } else {
                // 连接成功
                connection.query(sql, (err, results) =>{
                    if(err){
                        // 查询失败
                        reject(err);
                    } else {
                        // 查询成功
                        resolve(results);
                    }
                    // 执行完一次后将连接放回连接池
                    connection.release();
                })
            }
        })
    })
}

module.exports = db;

bcryptjs加密以及密码校验

const bcryptjs = require('bcryptjs');
// 幂次
const saltRounds = 10;// 2^10

module.exports = {
    /**
     * 加密方式
     * @param {加密} password 
     * @returns 
     */
    bcryptjs_Hash(password){
        return new Promise((resolve, reject) =>{
            bcryptjs.hash(password, saltRounds, (err, cryped) =>{
                if(err){
                    // 加密失败
                    reject('bcryptjs加密失败',err);
                } else {
                    // 加密成功
                    resolve(cryped);
                }
            })
        })
    },
    /**
     * 校验密码
     * is_password:数据库里密码
     * password:用户传过来密码
     * 两者进行对比true密码正确,false密码错误
     */
    bacypter_Compare(is_password, password){
        return new Promise((resolve, reject) =>{
            bcryptjs.compare(password, is_password, function(err, result){
                if(err){
                    reject('密码错误')
                } else {
                    resolve(result)
                }
            })
        })
    }
}

time获取当前时间

module.exports = {
    getTime(){
        let date = new Date()
        //以下代码依次是获取当前时间的年月日时分秒
        let yy = date.getFullYear();
        let mm = date.getMonth()+1;
        let dd = date.getDate();
        let hh = date.getHours();
        let mf = date.getMinutes()<10 ? '0'+date.getMinutes() : date.getMinutes();
        let ss = date.getSeconds()<10 ? '0'+date.getSeconds() : date.getSeconds();

        var time = yy+'-'+mm+'-'+dd+' '+hh+':'+mf+':'+ss;
        return time
    }
}

注册

需要引入的封包

const db = require('../config/db.config');// 引入数据库连接池
const { bcryptjs_Hash, bacypter_Compare } = require('../utils/bcryptjs.utils');
const time = require('../utils/time.utils')
let {
    userID,// 数据库
     password,// 密码
 } = req.body// 接收内容
 /**
  * 一、查重
  */
 let getSql = `select * from user Where id = '${userID}'`
 let getSqlData = await db(getSql)
 if(getSqlData.length > 0){
     return res.rr('id已存在 ')
 }
 /**
  * 二、添加
  */
 password = await bcryptjs_Hash(password)// 进行加密
 // insert into user values(这里面可以改成你们的数据库表的格式,这个是我的数据库用户表格式)
 let addSql = `insert into user values("${userID}","${password}","${userID}_博客","",0,"","","",0,"${time.getTime()}")`
 db(addSql)
 var token = encrypt(jwt.sign({userID}, 'userid'))
 /**
  * 三、返回注册成功
  */
 res.rr("注册成功", 0)

登录

需要引入封包

const db = require('../config/db.config');// 引入数据库连接池
const { bcryptjs_Hash, bacypter_Compare } = require('../utils/bcryptjs.utils');
let {
    userID,
    password
} = req.query
/**
 * 一、获取账号数据
 * 拿到数据后进行密码匹配是否正确
 */
let getSql = `select * from user Where id = '${userID}'`
let getSqlData = await db(getSql)
if(getSqlData.length === 0){
    return res.rr('账号不存在')
} else {
    /**
     * 校验密码
     */
    userList = getSqlData[0]
    let bacypter_password = await bacypter_Compare(userList.password, password)
    if(bacypter_password === false){
        return res.rr('密码错误')
    } else {
        // 返回一个token
        const token = jwt.sign({userID}, 'userid')
        res.rr(token, 0)
    }
}

token获取用户数据

需要引入的库

const jwt = require('jsonwebtoken');// 校验token
let {
    token
} =req.headers
/**
 * 校验token
 */
let tokenVerify = jwt.verify(token, 'userid')
/**
 * 查询相关数据
 */
var sql = `select * from user where id = ${tokenVerify.userID}`
let UserData = await db(sql)
if(UserData.length === 0){
    return res.rr('token存在异常操作')
}
/**
 * 为了数据安全,把需要返回的数据进行添加进一个对象返回出去
 */
let data = {
    id: UserData[0].id,// 登录id
    name: UserData[0].name,// 名称
    gender: UserData[0].gender,// 性别
    image: UserData[0].image,// 用户头像
    text: UserData[0].text,// 个性签名
    birthdate: UserData[0].birthdate,// 生日
    authority: UserData[0].authority,// 权限
    time: UserData[0].time,// 注册时间
}
res.rr(data, 0)

效果

我就直接用postman工具测试了,客户端也就是调取一下接口就可以用了
在这里插入图片描述
在这里插入图片描述
密码输入正确拿到token
在这里插入图片描述
拿token去访问解析token的接口拿用户数据这里需要在headers里携带token
在这里插入图片描述
一个完整的登录就出来啦

后面有惊喜

大家可以进我博客里面观摩一下橙子cms博客
里面有自己写的一些免费接口还是挺有意思的
在这里插入图片描述

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

橙子cms

node+express扫码获

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值