CORS跨域

Yukino 581 2021-12-29

简介

同源安全策略(相同协议、端口和主机被看作同源) 默认阻止“跨域”获取资源。但是 CORS 给了web服务器这样的权限,即服务器可以选择,允许跨域请求访问到它们的资源。
CORS (Cross-Origin Resource Sharing,跨域资源共享)是一个系统,它由一系列传输的HTTP头组成,这些HTTP头决定浏览器是否阻止前端 JavaScript 代码获取跨域请求的响应。

CORS组成

  1. Access-Control-Allow-Origin:指示请求的资源能共享给哪些域。
  2. Origin:指示获取资源是从什么域发起的。
  3. Access-Control-Allow-Credentials:指示当请求的凭证标记为 true 时,是否响应该请求。
  4. Access-Control-Allow-Headers:用在对预请求的响应中,指示实际的请求中可以使用哪些 HTTP 头。
  5. Access-Control-Allow-Methods:指定对预请求的响应中,哪些 HTTP 方法允许访问请求的资源。
  6. Access-Control-Allow-Methods:指定对预请求的响应中,哪些 HTTP 方法允许访问请求的资源。
  7. Access-Control-Max-Age:指示预请求的结果能被缓存多久。
  8. Access-Control-Request-Headers:用于发起一个预请求,告知服务器正式请求会使用那些 HTTP 头。
  9. Access-Control-Request-Method:用于发起一个预请求,告知服务器正式请求会使用哪一种 HTTP 请求方法。

简单请求

简单请求不会触发CORS预检请求,若满足以下要求则可视为简单请求:

  • 使用以下方法:
    • GET
    • POST
    • HEAD
  • 除了被用户代理自动设置的首部字段(例如 Connection ,User-Agent)和在 Fetch 规范中定义为 禁用首部名称 的其他首部,允许人为设置的字段为 Fetch 规范定义的 对 CORS 安全的首部字段集合。该集合为:
    • Accept
    • Accept-Language
    • Content-Language
    • Content-Type (需要注意额外的限制)
    • DPR
    • Downlink
    • Save-Data
    • Viewport-Width
    • Width
  • Content-Type 的值仅限于下列三者之一:
    • text/plain
    • multipart/form-data
    • application/x-www-form-urlencoded

# 计算机网络