cors中间件解决跨域问题的三个步骤
1、 npm install cors 安装中间件
2、使用const cors =require(‘cors’)导入中间件
3、在路由之前调用app.use(cors())配置中间件
CORS的注意事项
1. cors 主要在服务器端进行配置,客户端浏览器无需做任何额外的配置,即可请求开启了cors的接口
2.cors早浏览器中有兼容性,只有支持XMLHTTPRequiest Level的浏览器,才能正常访问开启了cors的服务端接口
1、cors响应头部-Access-Control-Allow-Origin
origin 控制允许那些网址可以请求我们的服务器
通配符 * 表示允许来自任何域的请求
res.serHeader('Access-Control-Allow-Origin','*')
2、cors响应头部-Access-Control-Allow-Headers
作用:如果客户端向服务器发送了额外的请求头信息,字需要在服务器,通过Access-Control-Allow-Headers对额外的请求头进行声明,否则这次请求会失效
3、cors响应头部-Access-Control-Allow-Methods
cors 默认仅支持客户端发起GET\POST
HEAD请求,Access-Control-Allow-Methods来指明实际请求所允许使用的HTTP方法。
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)
简单请求的特点:客户端与服务器之间只会发生一次请求。
CORS 预检请求
① 请求方式为 GET、POST、HEAD 之外的请求Method 类型
② 请求头中包含自定义头部字段
③ 向服务器发送了application/json 格式的数据