Node.js学习分享（下）

Express

express的基本用法

创建基本的web服务器

const express = require('express') //导入express模块
//创建服务器
const app = express()
//启动web服务器
app.listen(80,()=>{console.log('express server running at http://127.0.0.1');
})

监听GET请求

• 通过app.get()方法，可以监听客户端的GET请求
• 语法格式：

app.get("请求URL"，(req,res)=>{})

监听POST请求

• 通过app.post()方法，可以监听客户端的POST请求
• 语法格式：

app.post("请求URL"，(req,res)=>{})

把内容响应给客户端

• 通过res.send()方法，可以把处理好的内容发送给客户端
  //使用res.send()方法，向客户端响应一个JSON对象

app.get('/user',(req,res)=>{res.send({name:"zhengbo",age:19,hobby:"badminton"})
})

获取URL中携带的查询参数

• 通过req.query对象，可以访问到客户端通过查询字符串的形式，发送到服务器的参数

获取URL中的动态参数

• 通过req.params对象，可以访问到URL中，通过:匹配到的动态参数

托管静态资源

express.static()

• 通过express.static()，我们可以非常方便地创建一个静态资源管理器

app.use(express.static("文件名"))

托管多个静态资源目录

• 多次调用express.static()函数

挂载路径前缀

• 如果希望在托管的静态资源路径之前，挂载路径前缀，可以使用下面的方式

app.use('路径前缀',express.static('文件名'))

Express路由

• 广义上来讲，路由就是映射关系
• 在express中，路由指的是客户端请求与服务器处理函数之间的映射关系
• express中路由分为三部分：
  • 请求的类型
  • 请求的URL地址
  • 处理函数
    app.method(“path”,“Handler”)
    路由的使用
• 在express中使用路由最简单的方法，就是把路由挂载到app上

const express = require('express')
const app = express()//挂载路由
app.get('/',(req,res)=>{res.send('Hello,World!')
})app.listen(80,()=>{console.log("server running at http://127.0.0.1");
})

路由模块化

1. 创建路由模块对应的js文件
2. 调用express.Router()函数创建路由对象
3. 向路由对象上挂载具体的路由
4. 使用module_exports向外共享路由对象
5. 使用app.use()函数注册路由模块
   app.use()函数的作用，就是来注册全局中间件

Express中间件

Express中间件的调用流程

• 当一个请求到达Express服务器之后，可以连续调用多个中间件，从而对这次请求进行预处理

Express中间件的格式

• Express的中间件，本质上就是一个function处理函数。
• 注意：中间件函数的形参列表中，必须包含next参数。而路由处理函数中只包含req和res

next函数的作用

• next函数是实现多个中间件连续调用的关键，它表示把流转关系转交给下一个中间件或路由
  定义一个最简单的中间件函数
  //定义一个中间件函数
  const middleFun = (req,res,next)=>{
  console.log(“这是一个中间件函数”);
  //把流转关系，转交给下一个中间件或者路由
  next()
  }

全局生效的中间件

• 客户端发起的任何请求，到达服务器之后，都会触发的中间件，叫做全局生效的中间件
• 通过调用app.use(中间件函数)，即可定义一个全局生效的中间件

//全局生效的中间件
app.use(middleFun)

中间件的作用

• 多个中间件之间，共享同一份req和res。基于这样的特性，我们可以在上游的中间件中，统一为req和res对象添加自定义的属性和方法，供下游的中间件或者路由进行使用

//全局生效的中间件
app.use((req,res,next)=>{const time = Date.now()req.startTime = timenext()
})

局部生效的中间件

• 不使用app.use()定义的中间件，叫做局部生效的中间件
• 在路由参数URL和Handler中间加上该中间件函数即可局部生效

中间件的注意事项

1. 一定要在路由之前注册中间件
2. 客户端发送过来的请求，可以连续调用多个中间件进行处理
3. 执行完中间件的业务代码之后，不要忘记调用next()函数
4. 为了防止代码逻辑混乱，调用next函数之后不要再写额外的代码
5. 连续调用多个中间件时，多个中间件之间，共享req和res对象

中间件的分类

应用级别的中间件

• 通过app.use()或者app.get()等，绑定到app实例上的中间件，叫做应用级别的中间件
  路由级别的中间件
• 绑定到express.Router()实例上的中间件，叫做路由级别的中间件

错误级别的中间件

• 作用：专门用来捕获整个项目中发生的异常错误，从而防止项目异常崩溃的问题
• 必须有四个形参，分别是(err,req,res,next)
  注意：错误级别的中间件，必须注册在所有路由之后
  Express内置的中间件
• express.static()
• express.json解析JSON格式的请求体数据（有兼容性）
• express.urlencoded解析URL-encoded格式的请求体数据（有兼容性）

第三方中间件

1. 安装中间件：npm install + 中间件
2. 使用require导入中间件
3. 调用app.use注册并使用中间件
   注意：如果没有配置任何的解析表单数据的中间件，则req.body默认为undefined

自定义中间件

• 手动模拟一个类似于express.urlencoded这样的中间件，来解析POST提交到服务器的
• 实现步骤：

1. 定义中间件
2. 监听req的data事件
3. 监听req的end事件
4. 使用querystring模块解析请求体数据
5. 将解析出来的数据挂载为req.body
6. 将自定义中间件封装为模块

const express = require('express')
const app = express()
const qs = require('querystring')//解析表单数据的中间件
app.use((req,res,next)=>{//定义一个字符串，专门存储客户端发送过来的请求体数据let str = ''//监听req的data事件req.on('data',(chunk)=>{str+=chunk})//监听req的end事件req.on('end',()=>{//将字符串解析为对象格式const body = qs.parse(str)req.body = bodynext()})})//在POST请求接口中返回上面中间件挂载到req.body的数据
app.post('/user',(req,res)=>{res.send(req.body)
})app.listen(80,()=>{console.log('server running at http://127.0.0.1');
})

使用Express写接口

编写GET接口

//GET接口
apirouter.get('/get',(req,res)=>{//获取客户端通过查询字符串发送到服务器的数据const query = req.query//向客户端响应数据res.send({status:0,msg:'GET请求成功',data:query})
})

编写POST接口

//POST接口
apirouter.post('/post',(req,res)=>{const body = req.bodyres.send({status:0,msg:'POST请求成功',data:body})
})

CORS跨域资源共享

解决跨域问题的两种方案

1. CORS：主流的解决方案，推荐使用
2. JSONP：有缺陷，只支持GET请求

cors中间件解决跨域问题

• cors是Express的一个第三方中间件，通过它可以很方便的解决跨域问题
  使用步骤：
  1. npm install cors

2. const cors = require("cors")，导入中间件
3. 在路由之前调用app.use(cors())配置中间件

什么是CORS

• CORS（跨域资源共享）由一系列http响应头组成，这些http响应头决定浏览器是否组织前端JS代码跨域获取资源
• 浏览器的同源安全策略默认会阻止网页跨域获得资源。但如果接口服务器配置了CORS相关的http响应头，就可以解决浏览器端的跨域访问限制

CORS响应头部

• Access-Control-Allow-Origin: <origin> | *

• origin参数的值指定了允许访问该资源的外域URL

• Access-Control-Allow-Headers

• 如果客户端向服务端发送了额外的请求头，则需要通过该请求头对额外的请求头进行声明

• Access-Control-Allow-Methods

• 默认情况下，CORS仅支持客户端发起GET、POST、Head请求

• 如果需要别的请求方式，则需要通过该请求头来指明实际请求所允许使用的http方法

CORS请求的分类

• 根据请求方式和请求头的不同，可以把CORS请求分为两类
• 简单请求和预检请求

简单请求

• 同时满足以下两大条件的请求

1. 请求方式：GET 、POST、HEAD三者之一
2. HTTP 头部信息不超过以下几种字段：无自定义头部宇段、Accept. Accept-Language、Content-Language、DPR、Downlink、 Save-Data, Viewport-Width、Width、Content-Type

预检请求

• 不是简单请求的请求就是预检请求
  简单请求和预检请求的区别
• 简单请求特点：客户端与服务器之间只会发生一次请求
• 预检请求特点：客户端与服务器之间会发生两次请求，OPTION预检请求成功之后，才会发起真正的请求

web开发模式

服务端渲染的web开发模式

• 服务器发送给客户端的HTML页面，是在服务器通过字符串的拼接，动态生成的。因此，客户端不需要使用Ajax这样的技术额外请求页面的数据

优缺点：

优点：

1. 前端耗时少
2. 有利于SEO

缺点：

1. 占用服务器端资源
2. 不利于前后端分离，开发效率低

前后端分离的web开发模式

• 后端只负责提供API接口，前端使用Ajax调用接口

优缺点：

优点：

1. 开发体验好
2. 用户体验好
3. 减轻了服务器端的渲染压力

缺点：

1. 不利于SEO

session认证机制

http协议的无状态性

• 指的是客户端的每次http请求都是独立的，连续多个请求之间没有直接的关系，服务器不会主动保留每次http的状态

Cookie

什么是cookie

• cookie是存储在用户浏览器中的一段不超过4KB的字符串。它由一个名称、一个值和其他几个用于控制cooker有效期、安全性、使用范围的可选属性组成
• 不同域名下的cookie各自独立，每当客户端发起请求时，会自动把当前域名下所有未过期的cookie一同发送到服务器

cookie的四大特性

1. 自动发送
2. 域名独立
3. 过期时限
4. 4KB限制

cookie不具有安全性

• 由于cookie是存储在浏览器中的，而且浏览器也提供了读写cookie的API，因此cookie很容易被伪造，不具有安全性。因此不建议服务器将重要的隐私数据，通过cookie的形式发送给浏览器。

session的工作原理

向session中存储数据

• 当express-session中间件配置成功后，即可通过req.session来访问和使用session对象，从而存储用户的关键信息

//登录的api接口
app.post('/api/login',(req,res)=>{if(req.body.username !== 'admin' || req.body.password !== '000000'){return res.send({status:1,msg:'登录失败'})}//将登录成功后的用户信息，存储到session中req.session.user = req.body //用户信息req.session.islogin = true //用户的登录状态res.send({status:0,msg:'登录成功'})
})

从session中取数据

• 可以直接从req.session对象上获取之前存储的数据

//获取用户用户名的接口
app.get('/api/username',(req,res)=>{if(!req.session.islogin){return res.send({status:1,msg:'fail'})}res.send({status:0,msg:'success',username:req.session.username})
})

清空session

• 调用req.session.destroy()函数，即可清空服务器保存的session信息

//退出登录的接口
app.post('/api/loginout',(req,res)=>{//清空当前客户端对应的session信息req.session.destroy()res.send({status:0,msg:'退出登录成功'})
})

JWT认证机制

• session认证机制需要配合cookie才能实现，由于cookie默认不支持跨域访问，所以当涉及前端跨域访问后端接口时，所以需要做很多额外的配置，才能实现跨域session认证
• 当前端请求后端接口不存在跨域问题时，推荐使用session身份认证机制

什么是JWT

• JSON Web Token 是目前最流行的跨域认证解决方案
  JWT的工作机制
  

• 用户的信息通过token字符串的形式，保存在客户端浏览器中。服务器通过还原token字符串的形式来认证用户的身份

JWT的组成

• JWT通常由三部分组成，分别是Header（头部），Payload（有效荷载），Signature（签名）
• Payload部分才是真正的用户信息，它是用户信息经过加密之后生成的字符串
• Header和Signature是安全性相关的部分，只是为了保证token的安全性

JWT的使用方式

• 推荐的做法是把JWT放在HTTP请求头的Authorization字段中

在Express中使用JWT

安装JWT相关的包

npm install jsonwebtoken express-jwt

• jsonwebtoken：用于生成JWT字符串
• Express-jwt：用于将JWT字符串解析还原成JSON对象
  导入包
• 使用require函数
  const jwt = require(‘jsonwebtoken’)
  const expressJWT = require(‘express-jwt’)
  定义secret密钥
• 保证JWT字符串的安全性
  const secretKey = ‘yaoyao No1’
  再登录成功后生成JWT字符串
• 调用jsonwebtoken包提供的sign()方法，将用户的信息加密成JWT字符串，响应给客户端

将JWT字符串还原为JSON对象

• 服务器可以通过express-jwt这个中间件，自动将客户端发送过来的token解析成JSON对象
  

注意：只要配置好了express-jwt这个中间件，就可以把解析出来的用户信息，挂载到req.user属性上