一、路由
1. 什么是路由
（1）路由就是映射关系。
（2）在 Express 中，路由指的是客户端的请求与服务器处理函数之间的映射关系。
2. express路由的组成
客户端的请求地址、请求方式和服务器的处理函数。
app.get/post( ' URL ' ， function（）{ } ）
3. 路由的匹配过程
（1）每当一个请求到达服务器之后，需要先经过路由的匹配。
（2）只有客户端发送的请求方式和请求地址都匹配成功后，才会调用对应的服务器处理函数。
4. 路由的简单使用
直接将路由挂载到服务器上。
const express = require('express')
const app = express()
// 挂载路由
app.get('/', (req, res) => {
res.send('hello world.')
})
app.post('/', (req, res) => {
res.send('Post Request.')
})
app.listen(80, () => {
console.log('http://127.0.0.1')
})
5. 路由的模块化使用
不要把路由直接挂载到服务器上，而是将路由抽离为单独的模块。
① 创建路由模块对应的 .js 文件
② 调用 express.Router() 函数创建路由对象
③ 向路由对象上挂载具体的路由
④ 使用 module.exports 向外共享路由对象
// 1.导入express包
const express = require('express')
// 2.创建路由的实例对象
const router = express.Router();
// 3.挂载具体的路由
router.get('/user/list', (req, res) => {
res.send('获取列表成功')
})
router.post('/user/add', (req, res) => {
res.send('添加列表成功')
})
// 4.共享路由对象
module.exports = router;
⑤ 创建服务器的js文件，在服务器的js文件中使用 app.use() 函数注册路由模块。
// 导入express包
const express = require('express');
// 创建服务器实例对象
const app = express();
// 5.注册路由模块
const userRouter = require('./2.路由模块');
app.use('/api',userRouter); //为路由添加URL前缀
// 启动服务器
app.listen(80, () => {
console.log('express server running at http://127.0.0.1:80');
});
二、中间件
1. 什么是中间件
（1）定义：中间件（Middleware ），特指业务流程的中间处理环节。
（2）执行：当一个请求到达 Express 的服务器之后，首先会依次调用多个中间件对这次请求进行预处理。然后才会调用路由函数。
2. 中间件的格式
（1）Express中的中间件本质上就是一个function处理函数。
（2）中间件函数的参数有三个req、res、next。
（3）路由函数的参数只有两个req和res。
app.get( ' / ' ，function( req ，res， next ) { next( ) } )
这里的function函数就叫中间件。
const express = require('express');
const app = express();
// 定义一个最简单的中间件函数
var mw = function (req, res, next) {
console.log('这是一个最简单的中间件函数');
// 当前中间件处理结束后必须调用next()函数
next();
};
app.listen(80, () => {
console.log('express running at http://127.0.0.1:80');
});
注意：
①中间件必须有参数next函数，因为上一个中间件的输出会作为下一个中间件的输入。
②当前中间件的业务处理完毕后，必须调用next( )函数。
3. 全局生效的中间件函数
app.use( 中间件函数 ） （是函数，别忘了小括号（））
app.use(function (req, res, next) {
console.log('这是一个最简单的中间件函数');
// 当前中间件处理结束后必须调用next()函数
next();
});
4. 中间件的作用
（1）多个中间件和路由共享相同的req和res对象。
（2）基于此特性，可以在上游的中间件上为req或res对象添加自定义属性或方法，供下游中间件和路由使用。
// 导入express包，创建服务器实例对象
const express = require('express');
const app = express();
// 创建第一个全局生效的中间件
app.use(function (req, res, next) {
const time = +new Date(); //获取当前时间戳
req.time = time; //为req对象挂载自定义属性
console.log('第一个中间件被执行');
next();
});
// 创建第二个全局生效的中间件
app.use(function (req, res, next) {
console.log('第二个中间件被执行');
next();
});
// 路由
app.get('/', function (req, res) {
res.send('根地址的get请求成功' + req.time);
});
// 启动服务器
app.listen(80, () => {
console.log('express server running at http://localhost');
});
5. 局部生效的中间件
不使用app.use( )方法进行注册，而是在指定路由里面调用的中间件叫局部中间件。例如：
app.get( ' /user ' ，mw1 ，mw2 ，(req ，res)=>{ } )
app.get( ' /user ' ，[mw1 ，mw2] ，(req ，res)=>{ } )
const express = require('express');
const app = express();
// 创建第一个局部生效的中间件
const mw1 = function (req, res, next) {
console.log('第一个局部生效的中间件被调用了');
next();
};
// 创建第二个局部生效的中间件
const mw2 = function (req, res, next) {
console.log('第二个局部生效的中间件被调用了');
next();
};
// 创建路由，调用局部中间件
app.get('/user', mw1,mw2, function (req, res) {
res.send('/user地址的get请求成功');
});
app.listen(80, () => {
console.log('express server running at http://localhost');
});
6. 中间件的注意事项
（1）除了错误级别的中间件，其它必须在路由之前注册中间件。
（2）客户端发送的请求，可以连续调用多个中间件。
（3）一个中间件业务处理完成后，必须调用next( )函数。
（4）next( )函数后面不能再写代码。
（5）被调用的中间件以及路由之间共享相同的req和res对象。
特殊场景：服务器暂停服务时，用中间件拦截所有请求，第一个中间件不调用next( )。
三、中间件的分类
1. 应用级别的中间件
绑定到app服务器上的中间件就叫应用级别的中间件。
比如app.use( )绑定的全局中间件；app.get( )和app.post( )绑定的局部中间件。
2. 路由级别的中间件
绑定到路由上的中间件就叫路由级别的中间件。
作用和 应用级别的中间件没有差别。
3. 错误级别的中间件
定义全局生效的错误级别的中间件，专门捕获服务器的错误，防止服务器崩溃。
app.use( function( err ，req ，res，next ）{ next（ ） }
注意：①错误级别的中间件必须写在所有路由的后面。
②错误级别的中间件函数有四个参数。
const express = require('express');
const app = express();
// 1.路由
app.get('/', (req, res) => {
throw new Error('服务器法生了错误');
res.send('get请求成功');
});
// 2.全局生效的错误级别的中间件
app.use(function (err, req, res, next) {
res.send('捕捉到了服务器的错误');
next();
})
app.listen(80, () => {
console.log('express server running at http://localhost');
});
4.Express的内置中间件
（1）express.static()方法可以创建一个静态资源服务器。详情见第三天笔记。
（2）express.json( )方法解析JSON格式的请求体数据。（有兼容性，仅在4.16.0+ 版本中可用）
补充：req.body可以接收客户端提交的数据。
如果没有配置任何解析数据的中间件，req.body默认为underfined
app.use(express.json( ) )
const express = require('express');
const app = express();
// 1.创建用来解析JSON格式数据的内置中间件
app.use(express.json());
// 2.路由
app.post('/user', (req, res) => {
console.log(req.body); //req.body可以接收客户端提交的数据
res.send('post请求发送成功');
});
app.listen(80, () => {
console.log('express server running at http://localhost');
});
（3） express.urlencoded( )方法可以 解析URL-encoded 格式的请求体数据。
也就是form表单提交数据的键值对格式。
（有兼容性，仅在4.16.0+ 版本中可用）
app.use(express.urlencoded( {extended: false}) )
5. 第三方的中间件
非 Express 官方内置的中间件，而是由第三方开发出来的Express 中间件，叫做第三方中间件。在项目中，可以按需下载并配置第三方中间件，从而提高项目的开发效率。
例如：除了使用 express.urlencoded 这个内置中间件来解析请求体数据，还可以使用body-parser 这个第三方中间 件，来解析请求体数据。使用步骤如下：
① 下载 npm install body-parser中间件
② 使用 require 导入中间件
③ 调用 app.use() 将中间件注册为全局生效。
注意：Express 内置的 express.urlencoded中间件，就是基于body-parser 这个第三方中间件进一步封装出来的。
const express = require('express');
const app = express();
// 1.导入第三方中间件
const parse = require('body-parse');
// 2.将第三方中间件注册为全局生效的中间件
app.use(parse.urlencoded({ extended: false }));
// 3.路由
app.post('/user', (req, res) => {
console.log(req.body); //req.body可以接收客户端提交的数据
res.send('post请求发送成功');
});
app.listen(80, () => {
console.log('express server running at http://localhost');
});
四、自定义解析url-encoded（form表单）数据的中间件
1.主体内容的编写：
（1）定义中间件函数。
（2）监听req的data事件。
data事件可以获取到客户端发送地请求体数据。
但是客户端的数据分多次发送，所以要定义一个变量str用来把每次的数据进行拼接。
（3）监听req的end事件。
当客户端最终把所有数据发送到服务器之后，会自动触发 req 的 end 事件。
此时，导入Node.js的内置模块querystring，可以将查询字符串转换成对象格式。
（4）将处理好的数据对象挂载到req对象上。
// 导入querystring模块
const qs = require('querystring');
// 自定义中间件函数
function bodyParse(req, res, next) {
// (1)定义变量str用来接收客户端发送的请求体数据
var str = '';
// (2)监听req的data事件
req.on('data', function (chunk) {
str += chunk;
});
// (3)监听req的end事件
req.on('end', function () {
// (4)使用Node.js的内置模块querystring，将查询字符串转换成对象格式
const body = qs.parse(str);
// (5)将获取到的数据对象挂载到req对象上，供下游路由使用
req.body = body;
next();
});
}
// 将自定义中间件函数对外共享
module.exports = bodyParse;
2.将自定义中间件封装为模块
类似于路由的模块化使用：
（1）创建存放自定义中间件的.js文件。
（2）用module.exports，将写好的自定义中间件函数对外共享。
（3）在服务器的.js文件中导入中间件模块。
（4）使用app.use( )方法，把中间件注册为全局有效。
const express = require('express');
const app = express();
// 导入自定义中间件模块
const p = require('./9.自定义解析数据的中间件');
// 将中间件注册为全局生效
app.use(p);
// 路由
app.post('/user', (req, res) => {
res.send(req.body); //req.body可以接收客户端提交的数据
});
app.listen(80, () => {
console.log('express server running at http://localhost');
});
五、使用 Express 写接口（实现跨域请求）
（1）创建路由模块的.js文件。
（2）在路由模块中挂载响应客户端的路由。
（3）将路由对象对外共享。
// 导入express包
const express = require('express');
// 创建路由实例对象
const apiRouter = express.Router();
// 1.挂载路由,响应get请求
apiRouter.get('/get', (req, res) => {
// (1)获取用户通过查询字符串，发送到服务器的数据
const query = req.query;
// (2)响应客户端
res.send({
status: 0,
msg: 'GET请求成功',
data: query,
});
});
// 2.挂载路由，响应post请求
apiRouter.post('/post', (req, res) => {
// (1获取用户通过请求体，发送到服务器的url-encoded数据
const body = req.body;
// (2)响应客户端
res.send({
status: 0,
msg: 'POST请求成功',
data: body,
});
});
// 把路由对象对外共享
module.exports = apiRouter;
（4）创建基本的服务器。
（5）在服务器.js文件中导入路由模块。
// 导入express包
const express = require('express');
// 创建服务器实例对象
const app = express();
//导入路由模块
const apiRouter = require('./12.创建接口的路由模块');
// 导入解析url-encoded格式数据的内置中间件
app.use(express.urlencoded({ extended: false }));
// 导入cors中间件，解决接口跨域问题
const cors = require('cors');
// 必须在配置cors之前，创建JSONP接口
app.get('api/jsonp', (req, res) => {
// (1)获取客户端发送的回调函数的名称
const funName = req.query.callback;
// (2)定义响应给客户端的数据对象
const data = { name: '吴磊', age: 22 };
// (3)根据前两步，拼接出函数调用的JSON字符串
const scriptStr = `${funName}(${JSON.stringify(data)})`;
// (4)将拼接好的JSON字符串响应给客户端
res.send(scriptStr);
});
// 将cors配置为全局生效
app.use(cors());
// 将路由注册为全局生效
app.use('/api', apiRouter);
// 启动服务器
app.listen(80, () => {
console.log('express server running at http://localhost');
});
六、接口的跨域请求
1. 在线版jQuery
2.使用 cors 中间件解决跨域问题
cors 是 Express 的一个第三方中间件。通过安装和配置cors 中间件，可以很方便地解决跨域问题。
使用步骤分为如下3 步：
① 运行 npm install cors 安装中间件
② 使用 const cors = require('cors') 导入中间件
③ 在路由之前调用app.use( )方法 配置中间件。（注意格式！！！）
app.use（ cors（））
七、 了解cors中间件
1. 什么是 CORS
CORS （Cross-Origin Resource Sharing，跨域资源共享）由一系列传输的HTTP 头组成，这些HTTP 头决定浏 览器是否阻止前端JavaScript 代码获取跨域请求的响应。
同源安全策略默认阻止“跨域”获取资源。但是CORS 给了 web 服务器这样的权限，即服务器可以选择，允许跨 域请求访问到它们的资源。
2. CORS 的注意事项
① CORS 主要在服务器端进行配置。客户端浏览器无须做任何额外的配置，即可请求开启了 CORS 的接口。
② CORS 在浏览器中有兼容性。只有支持XMLHttpRequest Level2 的浏览器，才能正常访问开启了 CORS 的服 务端接口（例如：IE10+、Chrome4+、FireFox3.5+）
3. CORS 响应头部 ：Access-Control-Allow-Origin
（1）响应头部中可以携带一个 Access-Control-Allow-Origin字段。
（2）origin 参数的值指定了允许访问该资源的外域URL。
（3）如果origin参数的值为通配符*，表示允许来自任何域的请求。
res.setHeader( " Access-Control-Allow-Origin " ，" http:www.baidu.com" )
4. CORS 响应头部 ：Access-Control-Allow-Headers
默认情况下，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 对额外 的请求头进行声明，否则这次请求会失败！
res.setHeader( " Access-Control-Allow-Headers " ，"Content-Type，X-Custom-Header" )
5. CORS 响应头部 ：Access-Control-Allow-Methods
默认情况下，CORS 仅支持客户端发起GET、POST、HEAD 请求。
如果客户端希望通过 PUT、DELETE等方式请求服务器的资源，则需要在服务器端，通过Access-Control-Alow-Methods 来指明实际请求所允许使用的 HTTP 方法。
res.setHeader( " Access-Control-Allow-Methods " ，" POST，GET，HEAD，DELETE" )
6. 简单请求
同时满足以下两大条件的请求，就属于简单请求：
① 请求方式：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）
简单请求的特点：客户端与服务器之间只会发生一次请求。
7. 预检请求
只要符合以下任何一个条件的请求，都需要进行预检请求：
① 请求方式为 GET、POST、HEAD 之外的请求Method 类型
② 请求头中包含自定义头部字段
③ 向服务器发送了application/json 格式的数据
在浏览器与服务器正式通信之前，浏览器会先发送OPTION 请求进行预检，以获知服务器是否允许该实际请求，所以这一 次的 OPTION 请求称为“预检请求”。服务器成功响应预检请求后，才会发送真正的请求，并且携带真实数据。
预检请求的特点：OPTION 预检请求成功之后，才会发起真正的请求。
八、 JSONP接口的定义与使用
1. JSONP 的概念与特点
概念：浏览器端通过 <script> 标签的 src 属性，请求服务器上的数据，同时，服务器返回一个函数的调用。这种请求数据 的方式叫做 JSONP。
特点：JSONP 仅支持 GET 请求，不支持POST、PUT、DELETE 等请求。
2. 实现 JSONP 接口的步骤
如果项目中已经配置了 CORS 跨域资源共享，为了防止冲突，必须在配置CORS 中间件之前声明JSONP的接口。否则 JSONP 接口会被处理成开启了CORS 的接口。
① 获取客户端发送过来的回调函数的名字
② 得到要通过 JSONP 形式发送给客户端的数据
③ 根据前两步得到的数据，拼接出一个函数调用的字符串
④ 把上一步拼接得到的字符串，响应给客户端的<script> 标签进行解析执行
// 必须在配置cors之前，创建JSONP接口
app.get('api/jsonp', (req, res) => {
// (1)获取客户端发送的回调函数的名称
const funName = req.query.callback;
// (2)定义响应给客户端的数据对象
const data = { name: '吴磊', age: 22 };
// (3)根据前两步，拼接出函数调用的JSON字符串
const scriptStr = `${funName}(${JSON.stringify(data)})`;
// (4)将拼接好的JSON字符串响应给客户端
res.send(scriptStr);
});
3.使用jQuery调用JSONP接口
具体格式见Ajax第四天笔记。
补充
（1）服务器的app.use( )方法专门用来注册全局有效的中间件或者路由。
（2）express.static( )内置中间件和路由在用app.use( )注册时，可以添加前缀。
（3）req.query可以获取客户端通过查询字符串，发送到服务器的数据。
（4）req.body客户获取客户端通过请求体，发送到服务器的数据。数据格式为JSON、url-encoded等，获取后需要通过中间件解析后才能读取。
