Express知识总结

最新推荐文章于 2024-01-12 17:22:42 发布

valentinelzt

最新推荐文章于 2024-01-12 17:22:42 发布

阅读量534

点赞数 1

分类专栏： Express

本文链接：https://blog.csdn.net/valentinelzt/article/details/106483358

版权

Express 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

创建服务器

// 引入express
const express = require('express')
// 创建服务器
const app = express()

// 监听80端口
app.listen(80, ()=>{
	console.log('服务器启动成功')
})

GET请求

// 引入express
const express = require('express')
// 创建服务器
const app = express()

app.get('/get', (req, res)=>{
  // req-->>请求对象
  // res-->>响应对象
})

// 监听80端口
app.listen(80, ()=>{
	console.log('服务器启动成功')
})

POST请求

// 引入express
const express = require('express')
// 创建服务器
const app = express()

app.post('/post', (req, res)=>{
  // req-->>请求对象
  // res-->>响应对象
})

// 监听80端口
app.listen(80, ()=>{
	console.log('服务器启动成功')
})

响应内容给客户端`res.send()`

// 引入express
const express = require('express')
// 创建服务器
const app = express()

app.get('/get', (req, res)=>{
  // req-->>请求对象
  // res-->>响应对象
  res.send({name:'lzt', age:18})
})

// 监听80端口
app.listen(80, ()=>{
	console.log('服务器启动成功')
})

获取get请求的参数

通过req.query对象获取

app.get('/get', (req, res)=>{
  // req-->>请求对象
  // res-->>响应对象
  res.send(req.query)
})

获取post请求的参数

调用express.urlencoded({ extended: false })
通过req.body获取

app.use(express.urlencoded({ extended: false }))
app.post('/post', (req, res)=>{
  // req-->>请求对象
  // res-->>响应对象
  res.send(req.body)
})

获取url动态参数

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

app.post('/user/:id', (req, res)=>{
  // req-->>请求对象
  // res-->>响应对象
  res.send(req.params.id)
})

托管静态资源

通过express.static()，开放静态资源

app.use(express.static(path.join(__dirname, 'public')))
// 挂在路径前缀
app.use('/public', express.static(path.join(__dirname, 'public')))

访问静态资源的时候，express.static()函数会根据目录的添加顺序来查找所需的文件

express中的路由

在 Express 中，路由指的是客户端的请求与服务器处理函数之间的映射关系。
Express 中的路由分 3 部分组成，分别是请求的类型、请求的 URL 地址、处理函数，格式如下：

// 匹配get请求，且请求地址为/get
app.get('/get', (req, res)=>{
  res.send(req.body)
})
// 匹配post请求，且请求地址为/post
app.post('/post', (req, res)=>{
  res.send(req.body)
})

路由匹配过程

每当一个请求到达服务器之后，需要先经过路由的匹配，只有匹配成功之后，才会调用对应的处理函数。
在匹配时，会按照路由的顺序进行匹配，如果请求类型和请求的 URL 同时匹配成功，则 Express 会将这次请求，转
交给对应的 function 函数进行处理。
按照定义的先后顺序进行匹配
请求类型和请求url同时匹配成功才会调用相应的处理函数

模块化路由

创建路由模块对应的 .js 文件
调用 express.Router() 函数创建路由对象
向路由对象上挂载具体的路由
使用 module.exports 向外共享路由对象
使用 app.use() 函数注册路由模块

const express = require('express')
const router = express.Router()

router.get('/get', (req, res)=>{
	res.send('hello world')
})
router.post('/post', (req, res)=>{
	res.send('hello world')
})
module.exports = router

注册路由模块

const userRouter = require('./router/user.js')
app.use('/api', userRouter)

中间件

中间件（Middleware ），特指业务流程的中间处理环节。
Express 的中间件，本质上就是一个 function 处理函数，Express 中间件的格式如下：

app.get('/', (req, res, next)=>{
	next()
})

注意：中间件函数的形参列表中，必须包含 next 参数。而路由处理函数中只包含 req 和 res

定义多个全局中间件

可以受用app.use()连续定义多个全局中间件，客户端请求达到服务器后，会按照中间件定义的先后顺序一次进行调用

app.use(function (req, res, next) {
  console.log('调用了第一个全局中间件')
  next()
})

app.use(function (req, res, next) {
  console.log('调用了第二个全局中间件')
  next()
})

app.get('/user', (req, res) => {
  // 请求这个路由，会依次触发上述两个全局中间件
  res.send('home page')
})

局部生效中间件

不使用app.use()定义的中间件，叫做局部生效中间件，

const mw1 = function (req, res, next) {
  console.log('这是中间件函数')
  next()
}
// mw1这个中间件只是在当前路由中生效，这种用法属于局部生效的中间件
app.get('/', mw1, function (req, res) {
  res.send('Home page')
})
// mw1中间件不会影响下面这个路哟
app.get('/user', function (req, res) {
  res.send('User page')
})

定义多个局部中间件

可以在路由中，通过如下两种等价的方式，使用多个局部中间件

const mw1 = function (req, res, next) {
  console.log('这是中间件1函数')
  next()
}
const mw2 = function (req, res, next) {
  console.log('这是中间件2函数')
  next()
}
// 以下两种写法完全等价，可根据自己的喜好，选择任意一种方式进行使用
app.get('/', mw1, mw2, function (req, res) {
  res.send('Home page')
})
app.get('/', [mw1, mw2], function (req, res) {
  res.send('Home page')
})

中间件五个注意事项

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

中间件的分类

应用级别的中间件
路由级别的中间件
错误级别的中间件
Express内置的中间件
第三方中间件

应用级别的中间件

通过app.use()或app.get()或app.post() 绑定到app实例的中间件上，叫做应用级别的中间件

// 应用级别的中间件（全局中间件）
app.use((req, res, next)=>{
	next()
})
// 应用级别的中间件（局部中间件）
app.get('/', mw1, (req, res)=>{
	res.send('home page')
})

路由级别中间件

绑定到express.Router()实例上的中间件，叫做路由级别的中间件。它的用法和应用级别中间件没有任何区别，只不过，应用级别中间件时绑定到app实例上，路由级别中间件绑定到router实例上

var express = require('express')
var router = express.Router()

// 路由级别中间件
router.use(function(req, res, next)=>{
	console.log('Time', Date.now())
	next()
})

错误级别的中间件

错误级别的中间件的作用：专门用来捕获整个项目中发生的异常错误，从而防止项目异常崩溃的问题
格式：错误级别中间件的function处理函数中，必须有4个形参，形参顺序从前到后，分别时（err, req, res, next）

app.get('/', function(req, res){
	throw new Error('服务器内部发生了错误')
	res.send('Home Page')
})

app.use(function(err, req, res, next){
	console.log('发生了错误' + err.message)
	res.send('Error' + err.message)
})

错误级别的中间件，必须注册在所有路由之后

express内置中间件

express.static快速托管静态资源的内置中间件，例如：HTML文件、图片、CSS样式等
express.json解析JSON格式的请求体数据（有兼容性，@4.16.0版本中使用）
express.urlencoded解析URL-encoded格式的请求体数据（有兼容性，@4.16.0版本中使用）

// 配置解析 application/json格式数据的内置中间件
app.use(express.json())
// 配置解析application/x-www-form-urlencoded 格式数据的内置中间件
app.use(express.urlencoded({ extended: false }))

第三方中间件

非 Express 官方内置的，而是由第三方开发出来的中间件，叫做第三方中间件。在项目中，大家可以按需下载并配置
第三方中间件，从而提高项目的开发效率。
例如：在 express@4.16.0 之前的版本中，经常使用 body-parser 这个第三方中间件，来解析请求体数据。使用步
骤如下：

npm install body-parser
require
app.use

Express 内置的 express.urlencoded 中间件，就是基于 body-parser 这个第三方中间件进一步封装出来的。

模拟`express.urlencoded`中间件，来解析post请求的数据

定义中间件
监听req的data事件
监听req的end事件
使用querystring模块解析请求体数据
将解析出来的数据对象挂在为req.body
将自定义中间件封装为模块

在中间件中，需要监听 req 对象的 data 事件，来获取客户端发送到服务器的数据。
如果数据量比较大，无法一次性发送完毕，则客户端会把数据切割后，分批发送到服务器。所以 data 事件可能会触
发多次，每一次触发 data 事件时，获取到数据只是完整数据的一部分，需要手动对接收到的数据进行拼接。

当请求体数据接收完毕之后，会自动触发 req 的 end 事件。
因此，我们可以在 req 的 end 事件中，拿到并处理完整的请求体数据

// 解析表单数据的中间件
app.use((req, res, next) => {
  // 定义中间件具体的业务逻辑
  // 定义一个str字符串，专门用来存储客户端发送过来的请求体数据
  let str = ''
  // 监听req对象的data事件（客户端发送过来的新的请求体数据）
  req.on('data', chunk => {
    // 拼接请求体数据，隐士转换为字符串
    str += chunk
  })
  // 监听req的end事件
  req.on('end', () => {
    // 在str中存放的是完整的请求体
    // 把字符串格式的请求数据，解析成对象格式
    const body = qs.parse(str)
    req.body = body
    next()
  })
})

CORS跨域资源共享

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

npm install cors
const cors = require('cors')
app.use(cors())

CORS响应头部-Access-Control-Allow-Oringin

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

其中，origin参数的值指定了允许访问该资源的外域URL
例如，下面的资源值只允许来自http://www.valzt.cn的请求

res.setHeader('Access-Control-Allow-Origin', 'http://www.valzt.cn')

如果指定了Access-Control-Allow-Origin字段的值为通配符*，标识允许来自任何域的请求

res.setHeader('Access-Control-Allow-Origin', '*')

默认情况下，CORS 仅支持客户端向服务器发送如下的 9 个请求头：
Accept、Accept-Language、Content-Language、DPR、Downlink、Save-Data、Viewport-Width、Width 、
Content-Type （值仅限于 text/plain、multipart/form-data、application/x-www-form-urlencoded 三者之一）
如果客户端向服务器发送了额外的请求头信息，则需要在服务器端，通过 Access-Control-Allow-Headers 对额外
的请求头进行声明，否则这次请求会失败！

// 允许客户端额外向服务器发送Content-Type请求头和x-Custom-Header请求头
//多个请求头使用英文逗号进行分割
res.setHeader('Access-Control-Allow-Origin', 'Content-Type', 'X-Custom-Header')

CORS响应头部 Access-Control-Allow-Methods

默认情况下， CORS仅支持客户端发起的GET、POST、HEAD请求
如果客户端希望通过 PUT、DELETE 等方式请求服务器的资源，则需要在服务器端，通过 Access-Control-Alow-Methods
来指明实际请求所允许使用的 HTTP 方法。

// 只允许post、get、delete、head请求方法
res.setHeader('Access-Control-Allow-Methods', 'POST, GET, DELETE, HEAD')
// 允许所有的http请求方法
res.setHeader('Access-Control-Allow-Methods', '*')

CORS请求的分类

客户端在请求CORS接口时，根据请求方式和请求头的不同，可以将CORS的请求分为两大类
简单请求
预检请求

简单请求

同时满足以下两大条件的请求，就属于简单请求：

请求方式：GET、POST、HEAD 三者之一
HTTP 头部信息不超过以下几种字段：无自定义头部字段、Accept、Accept-Language、Content-Language、DPR、
Downlink、Save-Data、Viewport-Width、Width 、Content-Type（只有三个值application/x-www-formurlencoded、multipart/form-data、text/plain）

预检请求

只要符合以下任何一个条件的请求，都需要进行预检请求：

请求方式为 GET、POST、HEAD 之外的请求 Method 类型
请求头中包含自定义头部字段
向服务器发送了 application/json 格式的数据
在浏览器与服务器正式通信之前，浏览器会先发送 OPTION 请求进行预检，以获知服务器是否允许该实际请求，所以这一
次的 OPTION 请求称为“预检请求”。服务器成功响应预检请求后，才会发送真正的请求，并且携带真实数据。

valentinelzt

关注

1
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
Express知识总结

创建服务器// 引入expressconst express = require('express')// 创建服务器const app = express()// 监听80端口app.listen(80, ()=>{ console.log('服务器启动成功')})GET请求// 引入expressconst express = require('express')// 创建服务器const app = express()app.get('/get', (req,
复制链接

扫一扫