CORS

在浏览器中,基于一些平安起因,对JavaScript脚本的执行增加了同源(雷同协定,域名与端口)策略的限度。在一个页面应用JavaScript发动一个申请时,浏览器会检测以后申请的URL是否与以后页面的URL同源,如果不是,个别状况下会禁止次申请执行失去响应的后果。

CORS 的申请

为申请头增加Origin属性,标记以后发出请求的页面所在域,服务端检测申请头中的Origin,如果是可信的申请源,则能够在该申请的响应头中增加Access-Control-Allow-Origin,内容为申请的Origin,表明容许以后Origin进行块玉申请,也能够为*,示意容许所有的Origin进行跨域申请。

CORS规范吧跨预申请分为简略申请和非简略申请。当响应头满足以下条件,则被视为简略申请:

申请办法为GET,POST,HEAD,申请头只蕴含一下属性

  • Accept:客户端可接管的MediaType
  • Accept-Language:客户端可接管的语言
  • Content-Lanuage:客户端申请内容的语言
  • Last-Event-ID:最初一次事件ID
  • Content-Type:客户端申请内容的MediaType,当且仅当MediaType为application/x-www-form-urlencoded,multipart/form-data,text/plain三者之一时才视为简略申请。

浏览器在发送时,会主动判断申请类型,并作出相应的解决。

简略申请的发送与解决

对于简略申请,浏览器在发送时,会在申请头中为其主动增加Origin属性,用于示意申请起源,值为申请页面URL中的协定,域名和端口信息。

响应头

  • Access-Control-Allow-Origin:必须返回,值个别为申请的Origin,但依据配置也可能是*,表明容许所有起源进行逗号分隔。
  • Access-Control-Request-Credentials:该属性可选,默认是false。用于表明是否容许浏览器将Cookie信息蕴含在CORS申请中。对于XMLHttpRequest,如果须要蕴含Cookie信息,则还须要设置withCredentials属性为true,申请才会蕴含Cookie的信息
  • Access-Control-Expose-Headers:容许申请方的JS脚本通过Response获取的头属性列表,默认蕴含6个根本属性,别离是:Cache-Control, Content-Language, Content-Type, Expires, Last-Modified, Pragma。如果须要让CORS申请头能够拜访其余属性,则须要通过响应头设置属性列表。

一旦申请方须要发送Cookie信息,响应头中的Access-Control-Allow-Origin不能为*,只能为申请方的Origin。

非简略申请的发送与解决

在浏览器检测到以后CORS申请是非简略申请时,会先向服务器发送一个预检申请(preFlight)预检申请通过之后,才会发送正式的数据申请。

预检申请

预检申请是一个申请办法为OPTIONS的申请,不携带任何申请题,只携带一些预本次CORS申请相干的元信息,如CORS申请办法,蕴含哪些申请头等信息。服务器端更具预检申请里的这些信息,判断是否容许该CROS申请,只有预检申请失去了服务器的必定答复,才容许正式申请,否则这次申请会间接报错。

预检申请头

  • Access-Control-Request-Method: 申请头肯定存在,示意本次CORS申请的申请办法。
  • Access-Control-Request-Headers:示意CORS申请除了简略申请中申请头之外,额定蕴含的申请头属性列表。

响应头

  • Access-Control-Allow-Origin:必须返回,值个别为申请的Origin,但依据配置也可能是*,表明容许所有起源进行逗号分隔。
  • Access-Control-Request-Methods:示意可承受CORS申请的办法列表,用于逗号隔开,返回多个能够防止屡次预检,浏览器会对预检后果进行缓存
  • Access-Control-Request-Headers:示意可承受的申请头列表,不包含简略申请头中的根本申请头
  • Access-Control-Request-Credentials:和简略申请雷同
  • Access-Control-Max-Age:可选属性。示意此次预检后果的无限时长,浏览器会对预检后果进行缓存,该属性示意缓存工夫,单位为秒

如果服务器不承受CORS申请,在预检响应不蕴含这些属性,浏览器就认为不容许跨预申请。

当预检申请通过之后,真正的申请就与简略申请一样,蕴含Origin的申请头,响应中蕴含Access-Control-Allow-Origin。