开发者学堂课程【管理功能玩转对象存储OSS使用入门：对象存储 OSS 跨域（CORS）管理功能】学习笔记，与课程紧密联系，让用户快速学习知识
课程地址：https://developer.aliyun.com/learning/course/378/detail/4737
对象存储 OSS 跨域（CORS）管理功能
Cors如何设置使用
1、Cors
的中文名是跨域资源共享，是 HTML5 提供的标准跨域解决方案。
2、跨域访问
也叫 JavaScript 的跨域访问问题，是浏览器出于安全考虑而设置的一个限制，即同源策略。当来自于A网站的页面中的 JavaScript 代码希望访问 B 网站的时候，浏览器会拒绝该访问，因为 A，B 两个网站是属于不同的域，此处跨域可以简单理解为 A，B 两个网站域名不同而存在跨域问题。
3、CORS主要使用场景
CORS 使用一定是在使用浏览器的情况下，因为控制访问权限的是浏览器而非服务器。因此使用其它的客户端的时候无需关心任何跨域问题。
4、实例
在此之前已经在服务器上搭建了外部环境，并在网站绑定了test1.pier39.cn 这个域名，get_obiect from oss. Html 这个是在空间中上传的一个测试文件，复制这个地址，打开浏览器，点击 f12 打开浏览器工具工具，然后粘贴网站，点击访问，先看一下程序的源代码，这个程序就是通过get的方法， oss 下的 a.jpg 这个图片，点击 get ，确定，可以看到获取 a.jpg 图片的时候，显示的状态码是403，获取不到的，在下方这个错误中可以看到此时access-control-allow-origin 是通过 http：//test1.pier39.cn 域名获取的，而地址实际上的域名是http：//youkou.oss-cn-beijing.com/abcd/a.jpg， 因为这两个域名不同，因此存在跨域问题，浏览器默认是拒绝跨域行为的，所以浏览器获取不到这个图片，那针对此跨域问题 oss 中有一个 count 的设置可以解决此问题。在控制台中设置 count，之前已经登陆到了控制台，在 bucket 管里面，找一个 bucket ，点击 bucket 属性，点击 cors 设置，添加规则，来源写网站的域名 http：//test1.pier39.cn， 此处填写的时候 http 域名是要带的，方法选get，Allowed Header 填写*，点击确定，可以看到已添加，这时可以访问一下之前的站点，点击 get，可以看到 a.jpg 图片已经被获取到，状态码已经是正常的 200 了，看一下 headers 可以看到这个是允许它获取的 Access-Control- Allow-Origin: http://test1.pier.cn,是因为已经在 oss 控制台把它加上了，Access-Control- Allow-Methods: GET 方法这里只选了 get ，所以就是 get，Access-Control- Allow-Credentials: true
Access-Control- Allow-Headers:content-type，所以在 oss 控制台里面就可以解决这种跨域的问题。
5、CORS 配置的一些注意事项
在设置的时候可以看到五个参数。
（1）来源:
配置的时候要带上完整的域信息，比如示例中就是 http://test1.pier39.cn，注意不要遗漏了协议名如 http，如果网站配置了其他端口号，用其他端口号访问，此处需要加冒号再加端口号就可以了。如果是8080,就填写http://test1.pier39.cn:8080，如果端口号不是默认的还要带上端口号之类的。如果不确定的话，可以使用通配符*。
（2）Method:
按照需求开通对应的方法即可。因为实例中只用了 get，所以就只用勾选 get 即可，也可以全部都勾选，或者根据自己畅叙中实际的解决方法，勾选就可以。
（3）Allow Header:
允许通过的 Header 列表，因为这里容易遗漏 Header，因此建议没有特殊需求的情况下设置为*。大小写不敏感。
（4）Expose Header:
暴露给浏览器的 Header 列表，一般来说都不应该暴露这些信息，这里可以不填。如果有特殊需求可以单独指定，大小写不敏感。
（5）缓存时间:
如果没有特殊情况可以酌情设置的大一点，比如60s。
Expose Header 和缓存时间，也可以全部都不填，在测试的时候就是没有填写的，可以根据自己的实际情况进行填写。
