cors

跨域

1. 使用 Access-Control-Allow 解决跨域问题

Access-Control-Allow-Origin

该字段是必须的。它的值要么是请求时Origin字段的值，要么是一个*，表示接受任意域名的请求。

Access-Control-Allow-Origin: <origin> | *

origin参数指定一个允许向该服务器提交请求的URI.对于一个不带有credentials的请求,可以指定为'*',表示允许来自所有域的请求.

Access-Control-Expose-Headers

设置浏览器允许访问的服务器的头信息的白名单:

Access-Control-Expose-Headers: X-My-Custom-Header, X-Another-Custom-Header

这样, X-My-Custom-Header 和 X-Another-Custom-Header这两个头信息,都可以被浏览器得到.

Access-Control-Max-Age

这个头告诉我们这次预请求的结果的有效期是多久,如下:

Access-Control-Max-Age: <delta-seconds>

delta-seconds 参数表示,允许这个预请求的参数缓存的秒数,在此期间,不用发出另一条预检请求.

Access-Control-Allow-Credentials

告知客户端,当请求的credientials属性是true的时候,响应是否可以被得到.当它作为预请求的响应的一部分时,它用来告知实际的请求是否使用了credentials.注意,简单的GET请求不会预检,所以如果一个请求是为了得到一个带有credentials的资源,而响应里又没有Access-Control-Allow-Credentials头信息,那么说明这个响应被忽略了.

Access-Control-Allow-Credentials: true | false

Access-Control-Allow-Methods

指明资源可以被请求的方式有哪些(一个或者多个). 这个响应头信息在客户端发出预检请求的时候会被返回. 上面有相关的例子.

Access-Control-Allow-Methods: <method>[, <method>]*

Access-Control-Allow-Headers

也是在响应预检请求的时候使用.用来指明在实际的请求中,可以使用哪些自定义HTTP请求头.比如

Access-Control-Allow-Headers: X-PINGOTHER

这样在实际的请求里,请求头信息里就可以有这么一条:

X-PINGOTHER: pingpong

可以有多个自定义HTTP请求头,用逗号分隔.

Access-Control-Allow-Headers: <field-name>[, <field-name>]*

2. 使用jsonp解决跨域问题

3. 使用代理

使用中间服务器代理，转发http请求

4. 使用postmessage

在页面中嵌入iframe，使用iframe进行iframe与主窗口之间进行数据交互

5. 使用location.hash + iframe 实现跨域

通过location.hash传递数据，监听iframe中src的变化来实现跨域

6. 通过window.name + iframe 实现页面间传值

通过给window.name赋值，实现页面间的数据传递

7. 使用document.domain + iframe 实现跨域

设置document.domain为主域名即可操作iframe中的document等实现跨域（只有在主域名相同的情况下才能使用该方法）

8. 动态创建script

与jsonp类似，直接通过script加载数据，并监听script