设置跨域资源共享
概述
跨域访问是指发起请求的资源所在域不同于该请求所指向的资源所在域,出于安全考虑,浏览器会限制这种非同源的访问。而在实际应用中,会经常遇到跨域访问的请求,例如,用户的网站A(http://domainA.example
)后端使用了BOS存储,用户想在该网站的Web应用程序中引用存储在BOS上的资源,但该页面只能向网站域名http://domainA.example
发起请求,向其他网站发送的请求均会被浏览器限制。
跨域资源共享(Cross-Origin Resource Sharing),简称CORS,是HTML5提供的标准跨域解决方案,BOS目前已经支持CORS标准来实现跨域访问。具体的CORS规则可以参考W3C CORS规范。CORS通过HTTP请求中附带Origin的Header来表明自己来源域,比如上面那个例子,Origin的Header就是http://domainA.example
。服务器端接收到这个请求之后,会根据一定的规则判断是否允许该来源域的请求,如果允许的话,服务器在返回的响应中会附带上Access-Control-Allow-Origin这个Header,内容为http://domainA.example
来表示允许该次跨域访问。如果服务器允许来自任何域名的跨域请求,则可将Access-Control-Allow-Origin的Header设置为 *
即可,浏览器根据是否返回了对应的Header来决定该跨域请求是否成功,如果没有附加对应的Header,浏览器将会拦截该返回结果。如果是非简单请求,浏览器会先发送一个OPTIONS请求(预请求)来探测这个跨域请求对于服务器端是不是安全可接受的,如果服务器不支持接下来的操作,浏览器会拦截该跨域请求。
操作方式
BOS 为开发者提供了两种方式来配置 bucket 资源的跨域访问权限,一种是直接在 BOS 控制台对 bucket 进行 CORS 规则设置;另一种是调用 CORS 相关的 API 接口来控制 bucket 资源的访问权限。
- 通过 Console 控制台配置 bucket 资源的跨域访问权限请参考设置跨域访问。
-
通过 API 配置 bucket 资源的跨域访问权限:
- PutBucketCors: 用来在指定的 Bucket 上设定一个跨域资源共享(CORS)的规则,如果原规则存在则覆盖原规则。
- GetBucketCors: 用于获取指定的 Bucket 当前的 CORS 规则。
- DeleteBucketCors: 用于关闭指定 Bucket 的 CORS 功能并清空所有规则。
- OPTIONS Object: 浏览器在发送跨域请求之前会发送一个 preflight 请求(OPTIONS)并带上特定的来源域,HTTP 方法和 Header 信息等给 BOS 以决定是否发送真正的请求,此接口即响应这种请求。
注意:
- BOS 中 CORS 配置是在 Bucket 级别的;
- CORS 请求是否通过和 BOS 的身份验证是完全独立的,因为 CORS 规则仅仅是用来决定是否附加 CORS 相关的 Header 的一个规则,是否拦截该请求完全由浏览器决定。
注意事项
- CORS只针对浏览器环境有意义,相关的Header附加由浏览器自动完成,不需要用户手动操作。
- CORS请求与BOS的身份验证是完全独立的,即CORS规则仅仅是用来决定是否附加CORS相关的Header的一个规则,是否拦截该请求完全由浏览器决定。
- 使用跨域请求的时候需要关注浏览器是否开启了Cache功能。当运行在同一个浏览器上分别来源于不同域
http://domainA.example
和http://domainB.example
的两个页面都同时请求同一个跨域资源的时候,如果http://domainA.example
的请求先到达服务器,服务器将资源带上Access-Control-Allow-Origin的Header为http://domainA.example
返回给用户。这个时候http://domainB.example
又发起了请求,浏览器会将Cache的上一次请求结果返回给用户,这个时候Header的内容和CORS的要求不匹配,就会导致后面的请求失败。