CORS学习 | 青训营笔记

30 阅读2分钟

这是我参与「第四届青训营」笔记创作活动的第 6 天

CORS

一、cors三个响应头部:

  1. Access-Control-Allow-Origin: | * 其中origin 参数制定了 允许访问该资源的外域URL 例如,下面的字段值只允许来自 'itcast.cn'的请求,`*标识通配符`,任何网站都可访问 2.Access-Control-Allow-Headers 默认情况下,CORS仅支持客服端向服务器发送以下9个请求头: Accept, Accept-Language, Content-Language, DPR, Downlink, Save-Data, View-Width, Width, Content-Type 其中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-Headers','Content-Type, X-Custom-Header')

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

二、cors请求的分类: 1.简单请求: 满足一下条件的都为简单请求: 1.1 请求方式为GET,POST,HEAD三者之一的 1.2 HTTP头部信息不超过一下几种字段:无自定义头部字段,且在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)

2.预检请求: 满足以下条件的都属于预检请求: 2.1 请求方式在GET,POST,HEAD三者之外的 2.2 HTTP头部信息包含自定义头部字段 2.3 向服务器发送了 application/json 格式数据的 在浏览器与服务器通信之前,浏览器会先发送OPTION请求进行预检,以获知服务器是否允许改实际请求服务器成功响应预检请求之后,客户端才会发送真正的请求,并携带真实数据