当您需要跨域共享或者访问资源时,您可以通过自定义HTTP响应头来实现。通过本文您可以了解跨域共享的概念、配置逻辑和应用案例。

什么是跨域资源共享

跨域资源共享CORS(Cross-Origin Resource Sharing)简称跨域访问,是HTML5提供的标准跨域解决方案,允许Web应用服务器进行跨域访问控制,使得跨域数据传输得以安全进行。

跨域资源共享CORS数据交互示意图:原理
CDN中开启了跨域共享之后交互示意图:原理

开启跨域资源共享

  1. 登录CDN控制台
  2. 在左侧导航栏,单击域名管理
  3. 域名管理页面,单击目标域名对应的管理
    域名管理
  4. 在指定域名的左侧导航栏,单击缓存配置
  5. 单击自定义HTTP响应头页签。
  6. 单击添加,配置自定义HTTP响应头。
  7. 选择增加并设置自定义响应头参数为“Access-Control-Allow-Origin”时,您可以开启跨域验证功能。自定义
    说明

    是否允许重复跨域校验这两个配置项之间存在互斥,是否允许重复配置为允许的情况下,跨域校验将会失效。

    • 跨域验证默认为关闭状态,只有在响应头操作为“增加”,自定义响应头参数为“Access-Control-Allow-Origin”的时候才可以配置。
      • 开启:开启状态下CDN节点将按以下规则对用户做跨域校验,并根据校验结果响应“Access-Control-Allow-Origin”的值。
      • 关闭:关闭状态下CDN节点不会校验用户请求中携带的Origin头,只会固定响应已配置的Access-Control-Allow-Origin值。
    • 跨域验证为开启状态下,如果响应头值中的域名包含短划线-,需要对短划线做转义处理后再配置,将-转义为%-。例如:
      • 原始响应头值:http://doc.aliyun-example.com
      • 转义后的响应头值:http://doc.aliyun%-example.com

举例

示例一:如果跨域资源共享的响应头值设置了单个或者多个值(多个值之间用“,”分隔)。
  • 如果用户请求头里携带的“Origin”参数值与被设置的任意一个值精确匹配,就会响应对应的跨域头。
  • 如果都没有精确匹配上,则不响应跨域头。

CDN上设置:Access-Control-Allow-Origin:http://example.com,https://aliyundoc.com。

  • 如果用户请求携带的origin头是http://example.com,则CDN节点将会响应Access-Control-Allow-Origin:http://example.com。
  • 如果用户请求携带的origin头是http://aliyundoc.com,则CDN节点将不会响应Access-Control-Allow-Origin(协议头不匹配,用户请求的是HTTP协议,CDN上设置的是HTTPS协议)。
  • 如果用户请求携带的origin头是https://aliyundoc.com,则CDN节点将会响应Access-Control-Allow-Origin:https://aliyundoc.com。
  • 如果用户请求携带的origin头是http://aliyun.com,则CDN节点将不会响应Access-Control-Allow-Origin(域名不匹配)。

示例二:如果跨域资源共享的响应头值设置了泛域名,则会校验请求头中Origin值是否能匹配上Access-Control-Allow-Origin的泛域名。

CDN上设置:Access-Control-Allow-Origin:http://*.aliyundoc.com。
  • 用户请求:Origin:http://demo.aliyundoc.com,则CDN节点将会响应Access-Control-Allow-Origin:http://demo.aliyundoc.com。
  • 用户请求:Origin:http://demo.example.com,则CDN节点将不会响应Access-Control-Allow-Origin(域名不匹配)。
  • 用户请求:Origin:https://demo.aliyundoc.com,则CDN节点将不会响应Access-Control-Allow-Origin(协议头不匹配,用户请求的是HTTPS协议,CDN上设置的是HTTP协议)。