AJAX 跨源 HTTP 请求

2014 年 7 月 2 日3860

机制

从较高的层次来看我们可以简单认为CORS 是介于 域A客户端 的AJAX调用 和一个托管在域B的页面 之间的契约, 一个典型的跨源 请求或者响应将会是这样:

域 A 的 AJAX 请求头

Host DomainB.com

User-Agent Mozilla/5.0 (Windows NT 6.1; WOW64; rv:2.0) Gecko/20100101 Firefox/4.0

Accept text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8,application/json

Accept-Language en-us;

Accept-Encoding gzip, deflate

Keep-Alive 115

Originhttp://http://www.zjjv.com//

域 B 的 响应头

Cache-Control private /> Content-Type application/json; charset=utf-8

Access-Control-Allow-Origin DomainA.com

Content-Length 87

Proxy-Connection Keep-Alive

Connection Keep-Alive

我上面标记的蓝色部分是关键实现,"Origin" 请求头表示 或者源于哪里, "Access-Control-Allow-Origin" 请求头 表示这个页面允许来自域A 的请求(其值为 * 表示允许任何域的远程请求)。

像我上面提到的,W3 建议浏览器在提交实际跨源HTTP 请求前,实现“预检请求”, 简而言之,就是一个HTTPOPTIONS请求:

OPTIONS DomainB.com/foo.aspx HTTP/1.1

如果 foo.aspx 支持 OPTIONS HTTP 指令, 它可能会像下面这样返回响应:

HTTP/1.1 200 OK

Date: Wed, 01 Mar 2011 15:38:19 GMT

Access-Control-Allow-Origin: http://http://www.zjjv.com//

Access-Control-Allow-Methods: POST, GET, OPTIONS, HEAD

Access-Control-Allow-Headers: X-Requested-With

Access-Control-Max-Age: 1728000

Connection: Keep-Alive

Content-Type: application/json

只有满足在响应中包含 "Access-Control-Allow-Origin" , 并且其值为 "*" 或者包含提交CORS请求的域,这些强制条件的浏览器才能提交正式的跨域请求, 并在”中缓存请求结果。

0 0