预检请求

134 阅读2分钟

预检请求是什么

预检请求(preflight request),是一个跨域请求,用来校验当前跨域请求能否被理解。

它使用 HTTP 的 OPTIONS 请求,一般会包括一下请求头:Access-Control-Request-MethodAccess-Control-Request-HeadersOrigin

预检请求通常在必要的时候由浏览器自动发起,不需要程序员进行干预。

预检请求的触发条件

1、是跨域请求

2、是非简单请求

跨域请求

跨域请求是指请求一个与自身资源不同源(不同的协议、域名、端口)的资源

简单请求 & 非简单请求

满足以下条件的请求就是简单请求

  • 一、请求方法属于下面三种方法之一:

    • HEAD
    • POST
    • GET
  • 二、HTTP 的请求头信息属于范围:

    • Accept

    • Accept-Language

    • Content-Language

    • Last-Event-ID

    • Content-Type:属于这三个的范围:

      • application/x-www-form-urlencoded
      • multipart/form-data
      • text/plain

不满足以上条件的就是非简单请求

场景分析

(1)跨域请求,且是简单请求,浏览器会自动在请求头中添加一个 Origin 请求头字段。

  • Origin:表示 CORS 请求的源。

服务器的响应可以包含以下字段:

  • Access-Control-Allow-Origin 没有包含 Origin 所指定的域,那么就会报 CORS 错误,请求失败。

(2)跨域请求,且是非简单请求,那么会有一次预检请求,在正式请求之前发出一个 OPTIONS 请求对服务器进行检测。

  • Origin:表示 CORS 请求的源。
  • Access-Control-Request-Method:表示 CORS 请求要用到的请求方法。
  • Access-Control-Request-Headers:这是一个用逗号分割的字符串,指出 CORS 请求要附加的请求头。

服务器的响应可以包含以下字段:

  • Access-Control-Allow-Methods:逗号分割的字符串,表示允许的跨域请求方法。

    Access-Control-Allow-Methods: PUT, POST, GET, OPTIONS
    
  • Access-Control-Allow-Headers:如果浏览器请求包含 Access-Control-Request-Headers 字段,那么服务器中该响应头也是必须的,也是一个由逗号分隔的字符串,表示服务器支持的请求头。

    Access-Control-Allow-Headers: authorization
    
  • Access-Control-Max-Age:可选字段。设置当前预检请求的有效期,单位为秒。

  • Access-Control-Allow-Credentials:可选字段。默认情况下,跨域请求不携带 cookie,如果服务器想要 cookie,需要指定该请求头为 true