如何设置跨域资源共享 您所在的位置:网站首页 跨域资源共享规范中 如何设置跨域资源共享

如何设置跨域资源共享

2023-07-14 01:14| 来源: 网络整理| 查看: 265

跨域设置CORS(Cross-Origin Resource Sharing)简称跨域访问,是HTML5提供的标准跨域解决方案,允许Web应用服务器进行跨域访问控制,确保跨域数据传输的安全性。

同源检测

跨域访问是浏览器出于安全考虑而设置的一个限制,即同源策略,是用于隔离潜在恶意文件的关键安全机制。当A、B两个网站属于不同域时,来自于A网站页面中的JavaScript代码访问B网站时,浏览器会拒绝该访问。

同协议、同域名(或IP)、以及同端口视为同域。两个页面的协议、域名和端口(若指定了端口)相同,则视为同源。下表给出了相对http://www.aliyun.com/org/test.html的同源检测示例:URL访问是否成功原因http://www.aliyun.com/org/other.html 是协议、域名、端口相同http://www.aliyun.com/org/internal/page.html 是协议、域名、端口相同https://www.aliyun.com/page.html否协议不同(HTTPS)http://www.aliyun.com:22/dir/page.html否端口不同(22)http://help.aliyun.com/dir/other.html否域名不同

从上表中可以看出,协议、域名或者端口不同的情况下,浏览器会拒绝该来源的访问。如果要允许这些来源的访问,需要设置跨域规则。

注意事项每个Bucket最多可以配置10条跨域规则。当OSS收到一个跨域请求(或者OPTIONS请求)时,会读取Bucket对应的CORS规则,然后进行相应的权限检查。OSS会依次检查每一条规则,使用第一条匹配的规则来允许请求并返回对应的Header。如果所有规则都匹配失败,则不附加任何CORS相关的Header。如果您开启了CDN加速,并且需要进行跨域访问时,您需要在CDN控制台配置跨域规则。具体步骤,请参见CDN如何配置跨域资源共享(CORS)。CORS规则

OSS支持根据需求灵活配置CORS规则,实现允许或者拒绝相应的跨域请求。CORS规则仅用来决定是否附加CORS相关的Header,是否拦截跨域请求由浏览器决定。

以下两种情况下需选中返回Vary: Origin以避免本地缓存错乱。重要 选中返回Vary: Origin后,可能会造成浏览器访问次数或者CDN回源次数增加。同时存在CORS和非CORS请求

例如实际请求中在标签下发起非CORS请求,在fetch下发起CORS请求。

    CORS Test   fetch("https://examplebucket.oss-cn-beijing.aliyuncs.com/exampleobject.txt").then(console.log) Origin头存在多种可能值

例如实际应用中指定允许的跨域请求来源Origin头为http://www.example.com以及https://www.example.org。

使用OSS控制台登录OSS管理控制台。单击Bucket列表,然后单击目标Bucket名称。在左侧导航栏,选择数据安全 > 跨域设置。在跨域设置页面,单击创建规则。在创建跨域规则面板,按以下说明设置配置跨域规则。参数是否必须说明来源是指定允许的跨域请求的来源。配置规则如下:允许多条匹配规则,多条规则需换行填写。域名需包含协议名,例如HTTP、HTTPS。支持通配符星号(*),每条匹配规则允许使用最多一个星号(*)。若域名使用的不是默认端口,还需要携带端口号。例如:https://www.example.com:8080。域名配置示例如下:匹配指定域名时,填写完整域名,例如:https://www.example.com。匹配泛二级域名,可使用通配符星号(*)。例如:https://*.example.com。匹配所有域名,可直接填写通配符星号(*)。允许Methods是指定允许的跨域请求方法。允许Headers否指定允许跨域请求的响应头。配置规则如下: 格式为key:value,例如content-type:text/plain,大小写不敏感。允许多条匹配规则,多条规则需换行填写。每条匹配规则最多使用一个星号(*)通配符。建议没有特殊需求的情况下设置为星号(*)。暴露Headers否指定允许用户从应用程序中访问的响应头,例如一个JavaScript的XMLHttpRequest对象。不允许使用星号(*)通配符。

建议暴露的常见Headers如下:

x-oss-request-id

在您使用OSS服务遇到问题时,凭借此Request ID请求技术支持协助排查并解决您遇到的问题。

ETag

可用于检查Object内容是否发生变化。

缓存时间否指定浏览器对特定资源的预取(OPTIONS)请求返回结果的缓存时间,单位为秒。返回Vary: Origin否配置是否返回Vary: Origin Header。

如果实际应用中同时存在CORS和非CORS请求,或者Origin头有多种可能值时,建议选中返回Vary: Origin以避免本地缓存错乱。

重要 选中返回Vary: Origin后,可能会造成浏览器访问次数或者CDN回源次数增加。单击确定。 使用阿里云SDK

以下仅列举常见SDK的跨域设置的代码示例。关于其他SDK的跨域设置的代码示例,请参见SDK简介。

import com.aliyun.oss.ClientException; import com.aliyun.oss.OSS; import com.aliyun.oss.OSSClientBuilder; import com.aliyun.oss.OSSException; import com.aliyun.oss.model.SetBucketCORSRequest; import java.util.ArrayList; public class Demo { public static void main(String[] args) throws Exception { // Endpoint以华东1(杭州)为例,其它Region请按实际情况填写。 String endpoint = "https://oss-cn-hangzhou.aliyuncs.com"; // 阿里云账号AccessKey拥有所有API的访问权限,风险很高。强烈建议您创建并使用RAM用户进行API访问或日常运维,请登录RAM控制台创建RAM用户。 String accessKeyId = "yourAccessKeyId"; String accessKeySecret = "yourAccessKeySecret"; // 填写Bucket名称,例如examplebucket。 String bucketName = "examplebucket"; // 创建OSSClient实例。 OSS ossClient = new OSSClientBuilder().build(endpoint, accessKeyId, accessKeySecret); try { SetBucketCORSRequest request = new SetBucketCORSRequest(bucketName); // 跨域资源共享规则的容器,每个存储空间最多允许10条规则。 ArrayList putCorsRules = new ArrayList(); SetBucketCORSRequest.CORSRule corRule = new SetBucketCORSRequest.CORSRule(); ArrayList allowedOrigin = new ArrayList(); // 指定允许跨域请求的来源。 allowedOrigin.add( "http://example.com"); ArrayList allowedMethod = new ArrayList(); // 指定允许的跨域请求方法(GET/PUT/DELETE/POST/HEAD)。 allowedMethod.add("GET"); ArrayList allowedHeader = new ArrayList(); // 是否允许预取指令(OPTIONS)中Access-Control-Request-Headers头中指定的Header。 allowedHeader.add("x-oss-test"); ArrayList exposedHeader = new ArrayList(); // 指定允许用户从应用程序中访问的响应头。 exposedHeader.add("x-oss-test1"); // AllowedOrigins和AllowedMethods最多支持一个星号(*)通配符。星号(*)表示允许所有的域来源或者操作。 corRule.setAllowedMethods(allowedMethod); corRule.setAllowedOrigins(allowedOrigin); // AllowedHeaders和ExposeHeaders不支持通配符。 corRule.setAllowedHeaders(allowedHeader); corRule.setExposeHeaders(exposedHeader); // 指定浏览器对特定资源的预取(OPTIONS)请求返回结果的缓存时间,单位为秒。 corRule.setMaxAgeSeconds(10); // 最多允许10条规则。 putCorsRules.add(corRule); // 已存在的规则将被覆盖。 request.setCorsRules(putCorsRules); // 指定是否返回Vary: Origin头。指定为TRUE,表示不管发送的是否为跨域请求或跨域请求是否成功,均会返回Vary: Origin头。指定为False,表示任何情况下都不会返回Vary: Origin头。 // request.setResponseVary(Boolean.TRUE); ossClient.setBucketCORS(request); } catch (OSSException oe) { System.out.println("Caught an OSSException, which means your request made it to OSS, " + "but was rejected with an error response for some reason."); System.out.println("Error Message:" + oe.getErrorMessage()); System.out.println("Error Code:" + oe.getErrorCode()); System.out.println("Request ID:" + oe.getRequestId()); System.out.println("Host ID:" + oe.getHostId()); } catch (ClientException ce) { System.out.println("Caught an ClientException, which means the client encountered " + "a serious internal problem while trying to communicate with OSS, " + "such as not being able to access the network."); System.out.println("Error Message:" + ce.getMessage()); } finally { if (ossClient != null) { ossClient.shutdown(); } } } }


【本文地址】

公司简介

联系我们

今日新闻

    推荐新闻

    专题文章
      CopyRight 2018-2019 实验室设备网 版权所有