tencent cloud

现象描述

前端报跨域错误，导致页面错误或展示异常等问题，如下图

可能原因

跨域是由于浏览器的同源策略限制，同时也为了网页的安全性考虑，当通过脚本向不同的来源发送请求时，这个请求的响应会被浏览器拦截，从而导致前端报错或页面无法正常展示。而当一个请求URL的协议、域名、端口三者之间任意一个与当前页面URL不同即为跨域。

解决思路

1. 确认页面异常报错是否是由跨域造成的，如下所示。
   
2. 在 CDN 控制台配置对应的 HTTP 响应头部，定义允许访问该资源的域。

处理步骤

1. 登录 CDN 控制台，在对应的域名管理-高级配置-HTTP 响应头配置下，设置好 Access-Control-Allow-Origin 头部参数即可。如下图，即允许所有域名发起的跨域请求。详情请见 Access-Control-Allow-Origin 匹配模式介绍。

2. 或针对性的设置为单个或多个已知的允许发起跨域请求的域名/IP，如下所示。
   同时也可以根据业务需要，加上如 Access-Control-Request-Method、Access-Control-Request-Headers 、Access-Control-Max-Age 等头部参数，来限制浏览器所能接受的请求的方法、可携带的头、预请求的有效时间等等。详情请见 参数支持列表。

注意：

若您已在 COS 侧存储桶配置了跨域访问，为保证正常访问，请在 CDN 控制台 HTTP 响应头 同步配置跨域规则。

参数支持列表

Access-Control-Allow-Origin 匹配模式介绍

注意：

若存在特殊端口，则需要在列表中填写相关信息，不支持任意端口匹配，必须指定。