跨域的流程

  1. a 域名下的页面访问 b 服务器，首先a发出一个请求c，
  2. c到达浏览器，浏览器判断c是简单请求还是非简单请求
  3. 如果是简单请求，浏览器现在请求头中加入origin字段，然后将c发送到b服务器
  4. 如果是非简单请求，浏览器则向b服务器发起另外一个option预检请求，查询服务器支持的请求方式，如果不支持，则不发出c请求，如果支持，则发出c
  5. b服务器接到c后，正确处理返回数据，浏览器收到b的响应，检查http响应头的Access-Control-Allow-Origin字段，是否包含a域名，没有则拦截。

简单请求和非简单请求

  1. 非简单请求：比如请求方法是PUT或DELETE，或者Content-Type字段的类型是application/json。
  2. 简单请求：
    • 请求方法是以下三种方法之一：HEAD，GET，POST
    • HTTP的头信息不超出以下几种字段：Accept，Accept-Language，Content-Language，Last-Event-ID，Content-Type
    • Content-Type：只限于三个值application/x-www-form-urlencoded、multipart/form-data、text/plain

注意: a 页面跨域发送的cookie是 b 域名的cookie，b服务器的响应头不能为Access-Control-Allow-Origin：*，必须是具体的域名。

解决方案

  1. b 的应用服务器设置http响应头或者 b 的http服务器（nignx或apache）设置响应头
  2. a 使用反向代理（服务器转发）
1
2
3
4
5
Access-Control-Allow-Origin: http://api.bob.com  
Access-Control-Allow-Credentials: true  //浏览器和服务器都把该值设为true才有效  
Access-Control-Expose-Headers: FooBar  
Content-Type: text/html; charset=utf-8  
Access-Control-Max-Age: 1000