快速搭建Node.js(Express)用户注册、登录以及授权的方法


Posted in Javascript onMay 09, 2019

项目准备

  1. 建立一个文件夹,这里叫 EXPRESS-AUTH
  2. npm init -y

启动服务

  1. 新建一个server.js 或者 app.js
  2. npm i express
  3. 开启端口,启动服务
// server.js
// 引入 express
const express = require('express')
// 创建服务器应用程序
const app = express()

app.get('/user', async (req, res) => {
 res.send('hello node.js')
})

app.listen(3001, () => {
 console.log('http://localhost:3001')
})

在命令行运行 nodemon .\server.js 命令启动服务

注:nodemon 命令需要全局安装 nodemon( npm install --global nodemon ), 在浏览器访问/user时如下,则说明开启成功

快速搭建Node.js(Express)用户注册、登录以及授权的方法

实现简单的 GET 请求接口

创建处理 get 请求的接口

app.get('/api/get', async (req, res) => {
 res.send('hello node.js')
})

在vscode商店中下载 REST Client

快速搭建Node.js(Express)用户注册、登录以及授权的方法

新建一个 test.http 文件测试接口,点击 Send Request 发送请求

// test.http
@url=http://localhost:3001/api

### 
get {{url}}/user

快速搭建Node.js(Express)用户注册、登录以及授权的方法

如上图,get 请求成功

操作 MongoDB 数据库

连接数据库

  1. 安装 mongodb 数据库
  2. 在需要启动的盘符根目录下新建 data/db 文件夹
  3. 在命令行对应的盘符下输入 mongod 命令,即可开启服务
  4. 有需要可以下载NoSQLBooster for MongoDB软件

建立数据库模型

  • npm i mongoose
  • 新建 model.js 操作数据库
// 引入 mongoose 
const mongoose = require('mongoose')

// 连接数据库,自动新建 ExpressAuth 库
mongoose.connect('mongodb://localhost:27017/ExpressAuth', {
 useNewUrlParser: true,
 useCreateIndex: true
})

// 建立用户表
const UserSchema = new mongoose.Schema({
 username: {
 type: String,
 unique: true
 },
 password: {
 type: String,
 }
})

// 建立用户数据库模型
const User = mongoose.model('User', userSchema)

module.exports = { User }

简单的 POST 请求

创建处理 POST 请求的接口

// server.js
app.post('/api/register', async (req, res) => {
 console.log(req.body);
 res.send('ok')
})
app.use(express.json()) // 设置后可以用 req.body 获取 POST 传入 data

设置 /api/register

###
POST {{url}}/register
Content-Type: application/json

{
 "username": "user1",
 "password": "123456"
}

注册用户

// server.js
app.post('/api/register', async (req, res) => {
 // console.log(req.body);
 const user = await User.create({
 username: req.body.username,
 password: req.body.password
 })
 res.send(user)
})

数据库里多了一条用户数据:

快速搭建Node.js(Express)用户注册、登录以及授权的方法

密码 bcrypt 加密

  • npm i bcrypt
  • 在 model.js 中设置密码入库前加密,这里的 hashSync方法接受两个参数,val 表示传入的 password,10表示加密的等级,等级越高,所需转化的时长越长

快速搭建Node.js(Express)用户注册、登录以及授权的方法

用户登录密码解密

在 server.js 中添加处理 /login 的POST请求

app.post('/api/login', async (req, res) => {
 const user = await User.findOne({
 username: req.body.username
 })
 if (!user) {
 return res.status(422).send({
  message: '用户名不存在'
 })
 }
 // bcrypt.compareSync 解密匹配,返回 boolean 值
 const isPasswordValid = require('bcrypt').compareSync(
 req.body.password,
 user.password
 )
 if (!isPasswordValid) {
 return res.status(422).send({
  message: '密码无效'
 })
 }
 res.send({
 user
 })
})

登录添加 token

安装 jsonwebtoken npm i jsonwebtoken
引入 jsonwebtoken,自定义密钥

// 引入 jwt
const jwt = require('jsonwebtoken')
// 解析 token 用的密钥
const SECRET = 'token_secret'

在登录成功时创建 token

/* 
生成 token
jwt.sign() 接受两个参数,一个是传入的对象,一个是自定义的密钥
*/
const token = jwt.sign({ id: String(user._id) }, SECRET)
res.send({
 user,
 token
})

这样我们在发送请求时,就能看到创建的 token

快速搭建Node.js(Express)用户注册、登录以及授权的方法

解密 token获取登录用户

先在 server.js 处理 token

app.get('/api/profile', async (req, res) => {
 const raw = String(req.headers.authorization.split(' ').pop())
 // 解密 token 获取对应的 id
 const { id } = jwt.verify(raw, SECRET)
 req.user = await User.findById(id)
 res.send(req.user) 
})

发送请求,这里的请求头是复制之前测试用的 token

### 个人信息
get {{url}}/profile
Authorization: Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6IjVjZDI5YjFlMTIwOGEzNDBjODRhNDcwMCIsImlhdCI6MTU1NzM2ODM5M30.hCavY5T6MEvMx9jNebInPAeCT5ge1qkxPEI6ETdKR2U

服务端返回如下图,则说明解析成功

快速搭建Node.js(Express)用户注册、登录以及授权的方法

配套完整代码和注释见 Github

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JS input 数字验证代码
Jul 30 Javascript
JS定时关闭窗口的实例
May 22 Javascript
jquery实现无限分级横向导航菜单的方法
Mar 12 Javascript
javascript css红色经典选项卡效果实现代码
May 17 Javascript
JQuery.validate在ie8下不支持的快速解决方法
May 18 Javascript
Highcharts入门之简介
Aug 02 Javascript
微信小程序 MINA文件结构
Oct 17 Javascript
微信小程序左右滑动切换页面详解及实例代码
Feb 28 Javascript
在node.js中怎么屏蔽掉favicon.ico的请求
Mar 01 Javascript
PHP7新特性简述
Jun 11 Javascript
bootstrap switch开关组件使用方法详解
Aug 22 Javascript
layUI的验证码功能及校验实例
Oct 25 Javascript
uni-app之APP和小程序微信授权方法
May 09 #Javascript
详解使用uni-app开发微信小程序之登录模块
May 09 #Javascript
D3.js的基础部分之数组的处理数组的排序和求值(v3版本)
May 09 #Javascript
JS原型与继承操作示例
May 09 #Javascript
详解微信小程序回到顶部的两种方式
May 09 #Javascript
jquery登录的异步验证操作示例
May 09 #jQuery
D3.js(v3)+react 实现带坐标与比例尺的散点图 (V3版本)
May 09 #Javascript
You might like
Yii调试SQL的常用方法
2014/07/09 PHP
php实现通过ftp上传文件
2015/06/19 PHP
PHP实现深度优先搜索算法(DFS,Depth First Search)详解
2017/09/16 PHP
PHP使用Nginx实现反向代理
2017/09/20 PHP
php 多个变量指向同一个引用($b = &$a)用法分析
2019/11/13 PHP
jquery 模式对话框终极版实现代码
2009/09/28 Javascript
JavaScript高级程序设计 客户端存储学习笔记
2011/09/10 Javascript
javascript学习(二)javascript常见问题总结
2013/01/02 Javascript
jquery checkbox实现单选小例
2013/11/27 Javascript
jQuery固定浮动侧边栏实现思路及代码
2014/09/28 Javascript
js强制把网址设为默认首页
2015/09/29 Javascript
使用jQuery Mobile框架开发移动端Web App的入门教程
2016/05/17 Javascript
基于Marquee.js插件实现的跑马灯效果示例
2017/01/25 Javascript
JS交互点击WKWebView中的图片实现预览效果
2018/01/05 Javascript
(模仿京东用户注册)用JQuery实现简单表单验证,初学者必看
2018/01/08 jQuery
基于casperjs和resemble.js实现一个像素对比服务详解
2018/01/10 Javascript
Vue 之孙组件向爷组件通信的实现
2019/04/23 Javascript
vue-video-player实现实时视频播放方式(监控设备-rtmp流)
2020/08/10 Javascript
Python实现字典依据value排序
2016/02/24 Python
Django框架模板介绍
2019/01/15 Python
Python线程之定位与销毁的实现
2019/02/17 Python
pandas计算最大连续间隔的方法
2019/07/04 Python
wxpython+pymysql实现用户登陆功能
2019/11/19 Python
Python创建一个元素都为0的列表实例
2019/11/28 Python
Python绘制二维曲线的日常应用详解
2019/12/04 Python
Python实现ATM系统
2020/02/17 Python
CSS3中新增的对文本和字体的设置
2020/02/03 HTML / CSS
香港草莓网土耳其网站:Strawberrynet TR
2017/03/02 全球购物
加拿大拼图大师:Puzzle Master
2020/12/28 全球购物
介绍一下Make? 为什么使用make
2013/12/08 面试题
商务英语广告词大全
2014/03/18 职场文书
2014镇党委班子对照检查材料思想汇报
2014/09/23 职场文书
2015年学校党建工作总结
2015/05/19 职场文书
西部计划志愿者工作总结
2015/08/11 职场文书
python实现腾讯滑块验证码识别
2021/04/27 Python
SQL 聚合、分组和排序
2021/11/11 MySQL