6-1express-cors-jsonp

最新推荐文章于 2025-06-03 10:44:55 发布

敲啊敲9527

最新推荐文章于 2025-06-03 10:44:55 发布

阅读量978

点赞数 24

分类专栏： node 文章标签： node.js

本文链接：https://blog.youkuaiyun.com/weixin_44423378/article/details/144697526

版权

node 专栏收录该内容

5 篇文章

订阅专栏

文章目录

目标
定义
Express能做什么
1.2.Express基本使用
1.3.托管静态资源
- 1.3.1.express.static()
- 1.3.2.挂载路径前缀的方式
1.4.nodemon
- 1.4.1.安装
2.路由的概念
3.中间件(middleware)

目标

可以用express.static()快速托管静态资源
express路由精简项目结构
express中间件
express创建API接口
express中启用cors跨域资源共享

定义

🍕是基于node.js平台，快速、开发、极简的web开发框架。

思考：不使用Express能否创建Web服务器
能，使用node.js提供的原生http模块(用起来较复杂，效率低，Express是基于http模块封装的，能够极大的提高开发效率)

Express能做什么

Web网站服务器：专门对外提供web网页资源的服务器
API接口服务器：专门对外提供API接口的服务器

1.2.Express基本使用

1.2.1.安装

🍔在项目所处的目录中，运行如下的终端命令，即可将express安装到项目中使用

npm i express@4.17.1

1.2.2.创建基本的Web服务器

//1.导入express
const express = require('express');
//2.创建web服务器
const app = express()
//监听get请求 通过app.get()方法,可以监听客户端的GET请求，
//参数1，请求的url 参数2，回调函数，回调函数中可以处理请求并返回响应 req请求对象(请求相关的属性和方法) res响应对象(响应相关的属性和方法)
app.get('/user', (req, res) => {
    //返回JSON格式数据
    res.send({
        name: '张三',
        age: 20,
        gender: '男'
    })
})
//监听post请求 通过app.post()方法,可以监听客户端的POST请求，
app.post('/login', (req, res) => {
    res.send('登录成功')
})
//3.调用app.listen(端口号,启动成功后的回调函数)，启动服务器
app.listen(3000,()=>{
	console.log('端口3000启动啦，快闪开')
})

1.2.3.获取url中携带的查询参数

🚜在回调中req参数对象中获取，默认是一个空对象

app.get('/', (req, res) => {
    const name = req.query
    const age = req.query
    res.send(`你好，${name}，你今年${age}岁了`)
})

1.2.4.url中动态参数，在路径中以:自定义字段的形式

app.get('/user/:id',()=>{
	
})

1.3.托管静态资源

1.3.1.express.static()

🚕调用.static()方法，对外创建一个静态资源服务器

const express = require('express');
const app = express();
app.use(express.static('./clock'));
app.listen(90, () => {
    console.log('Server is running on port 90');
})

1.3.2.挂载路径前缀的方式

const express = require('express');
const app = express();
//app.use()方法第二个参数
app.use('/clock', express.static('./clock'));
app.listen(90, () => {
    console.log('Server is running on port 90');
})

1.4.nodemon

1.4.1.安装

🍕 在编写调试nodejs时，如果修改了项目的代码，则需要重新启动项目，较为繁琐。nodemon工具能够监听项目文件的变动，当代码修改了，它会重启项目，方便调试

npm install -g nodemon

2.路由的概念

2.1.什么是路由

🍕简单来说路由就是映射关系。一个客户端的请求与服务器处理函数之间的映射关系。
🍟在express中路由是由三部分组成，分别是请求类型、url地址、处理函数。

2.1.路由匹配过程

🌮当一个请求到达服务器后，需要先经过路由的匹配，成功之后调用对应的处理函数。
注意点：1.安照定义的先后顺序进行匹配 2.请求类型和请求的url同时匹配成功，才会调用对应的处理函数。

2.2.路由的使用

2.2.1.最简单用法

🍟直接把路由挂载到app上，示例如下

const express = require("express");
const app = express()
app.get('/',function(req,res){
	
})
app.listen(3000,function(
){
	console.log('服务已启动！')
})

2.2.2.路由模块化

🍞不建议把路由之间挂载到app上，推荐将路由抽离为单独的模块文件中

1.创建路由模块对应的.js文件
2.调用express.Router()函数创建路由对象
3.向路由对象上挂着具体的路由
4.使用module.exports向外共享
5.使用app.use()函数注册路由
🌮注册路由模块
1.导入对应模块文件
2.调用app.use()注册路由

3.中间件(middleware)

3.1.定义：特指`业务流程`的`中间处理环节`

🎉比如污水处理时，要经过一些处理环节，从而保证处理过的废水达到排放标准

3.2.`调用流程`

🥙当一个请求到达express的服务器之后，可以连续调用多个中间件，从而对这次请求进行预处理
在这里插入图片描述

3.3.`格式`

在这里插入图片描述

3.4.`定义`中间件函数

const function = function(req,res,next){
	console.log('这是一个中间件函数')
	//注意：next函数必须在业务处理完毕后，调用一次 表示把流转关系转交给下一个中间件或路由
	next()
}

3.5.`全局`中间件

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

const getInfo = function(req,res,next){
	console.log('这是一个中间件函数')
	//注意：next函数必须在业务处理完毕后，调用一次 表示把流转关系转交给下一个中间件或路由
	next()
}
//注册全局生效的中间件 简写 可以把整个函数传入
app.use(getInfo)

3.6.作用

在这里插入图片描述

3.7.定义`多个`全局中间件

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

3.8.`局部生效`中间件

🥟不使用app.use()定义的中间件，称之为局部生效中间件

3.9.定义多个局部中间件

第二个参数可以传入多个

app.get('url',[mw1,mw2],()=>{
	
})

注意点

在这里插入图片描述

4.分类

在这里插入图片描述

4.1.应用级别

🧀绑定到app实例上的中间件，称之为应用级别的中间件；绑定路由实例上的中间件，称之为路由级别的中间件。二者用法相同。

4.2.错误级别中间件

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

4.3.`内置`的中间件

🧇自Express4.16.0版本开始，内置了3个常用的中间件

express.static快速托管静态资源
express.json解析JSON格式的请求体数据(有兼容性，仅在4.16.0+版本中可用)
express.urlencoded解析URL-encoded格式的请求体数据(有兼容性，仅在4.16.0+版本中可用)

第三方中间件

🐱‍🏍第三方开发出来的中间件，按需下载并配置第三方中间件，可以提高项目的开发效率
如在express@4.16.0之前的版本中，使用body-parser这个第三方中间件，解析请求体数据。

自定义中间件

🥪需求描述与实现步骤
模拟一个类似于express.urlencoded中间件，来解析POST提交到服务器的表单数据

1.定义中间件
2.监听req的data事件
3.监听req的end事件
4.使用querystring模块解析请求体数据
5.将解析出来的数据对象挂载为req.body
🧨监听req对象的data事件，来获取客户端发送到服务器的数据，当数据量过大时，无法一次性发送完毕，客户端会把数据切割后，分批发送到服务器。data事件可能会触发多次，每一次触发data事件时，获取到数据只是完整数据的一部分，需要手动对接收到的数据进行拼接。
🥪监听req对象的end事件，获取到的是完整数据
🎉node内置了一个querystring模块，用来处理查询字符串。通过提供的parse()函数，把查询字符串解析成对象的格式。
🚗
新建自定义解析表单的中间件.js文件

const express = require('express');
const qs = require('querystring')
const app = express()
app.use(express.json())
app.use(express.urlencode(
{
	extended:true
}
))
//自定义中间件
app.use((req,res,next)=>{
   //监听req.data事件
let strbody = '';//请求体数据
//监听req.on开始事件
req.on('data',function(chunk){
	strbody+=chunk;
})
    //监听req.end结束事件
    req.on('end', function () {
        console.log('请求体数据：' + str);
        const body = qs.parse(strbody);
        next();
    })
    
})
app.post('/user',(req,res)=>{
console.log('请求成功');
 //服务器端，使用req.body属性 接收客户端发送的请求体
    // 默认情况下，如果不配置解析表单数据的中间件，则req.body默认为undefined
    console.log(req.body)
	res.send(req.body)
})
app.listen(8080,()=>{
	console.log('8080端口启动成功')
})