设置跨域资源共享
跨域资源共享(Cross-Origin Resource Sharing,CORS)是 HTML5 提供的标准跨域解决方案,OSS 支持 CORS 标准来实现跨域访问。
说明
- 跨域访问相关 API 接口详细信息请参考跨域访问。
- 具体的 CORS 规则可以参考W3C CORS 规范。
- 如果您使用 CDN 域名访问 OSS 遇到跨域问题,需在 CDN 控制台配置跨域规则。详情请参见 CDN 如何配置跨域资源共享(CORS)。
跨域访问,或者说 JavaScript 的跨域访问问题,是浏览器出于安全考虑而设置的一个限制,即同源策略。当 A、B 两个网站属于不同域的时候,来自于 A 网站页面中的 JavaScript 代码希望访问 B 网站时,浏览器会拒绝该访问。
操作方式
操作方式 | 说明 |
---|---|
控制台 | Web 应用程序,直观易用 |
命令行工具ossutil | 命令行工具,性能好 |
Java SDK | 丰富、完整的各类语言SDK demo |
Python SDK | |
PHP SDK | |
Go SDK | |
C SDK | |
.NET SDK |
使用场景
在实际应用中,经常会有跨域访问的需求。
例如用户的网站 www.a.com,后端使用了 OSS。在网页中提供了使用JavaScript实现的上传功能,但是在该页面中,只能向 www.a.com 发送请求,向其他网站发送的请求都会被浏览器拒绝。这样就导致用户上传的数据必须从 www.a.com 中转。如果设置了跨域访问的话,用户就可以直接上传到OSS而无需从 www.a.com 中转。
跨域资源共享的实现
实现如下:
- CORS 通过 HTTP 请求中附带 Origin 的 Header 来表明自己来源域。例如上面的例子,Origin 的 Header 就是 www.a.com。
- 服务器端接收到这个请求之后,会根据一定的规则判断是否允许该来源域的请求。如果允许,服务器在返回的响应中会附带上 Access-Control-Allow-Origin 这个 Header,内容为 www.a.com 来表示允许该次跨域访问。如果服务器允许所有的跨域请求,将 Access-Control-Allow-Origin 的 Header 设置为星号(*)即可。
- 浏览器根据是否返回了对应的 Header 来决定该跨域请求是否成功,如果没有附加对应的 Header,浏览器将会拦截该请求。如果是非简单请求,浏览器会先发送一个 OPTIONS 请求来获取服务器的 CORS 配置,如果服务器不支持接下来的操作,浏览器也会拦截接下来的请求。
OSS 提供了 CORS 规则的配置,从而根据需求允许或者拒绝相应的跨域请求。该规则是配置在 Bucket 级别的。详情请参见 PutBucketCORS。
细节分析
- CORS 相关的 Header 附加等都是浏览器自动完成的,不需要您有任何额外的操作。CORS 操作也只在浏览器环境下有意义。
- CORS 请求的通过与否和 OSS 的身份验证是完全独立的,即 OSS 的 CORS 规则仅仅是用来决定是否附加 CORS 相关的 Header 的一个规则,是否拦截该请求完全由浏览器决定。
- 如果实际应用中同时存在 CORS 和非 CORS 请求,或者 Origin 头有多种可能值时,建议配置
Vary: Origin
头以避免本地缓存错乱。注意 增加Vary: Origin
返回头时,可能会造成浏览器访问次数或者CDN回源次数增加。
常见问题
版权声明
本文仅代表作者观点,不代表本站立场。
本文系作者授权发表,未经许可,不得转载。
评论