通识

核心逻辑

当浏览器从一个源（https://www.app.com）请求位于另一个源（https://cdn.example.com）的资源时，就会发生跨域。CDN处理跨域的核心在于正确配置和传递CORS（跨源资源共享）响应头。

1. OSS源站配置

对象存储（OSS）通常是CDN的回源地址。必须在OSS的Bucket管理界面中，设置跨域规则，明确允许哪些域名（Allowed Origins）、HTTP方法（Allowed Methods）和头信息（Allowed Headers）的访问。
- Allowed Origins: 填入允许访问的前端域名，例如 https://www.app.com。

2. CDN转发与缓存

当用户通过CDN请求资源时，如果CDN边缘节点没有缓存，它会回源到OSS。
OSS在响应时，会根据预设的CORS规则，在HTTP响应头中加入 Access-Control-Allow-Origin 等字段。
CDN接收到这个带有CORS头的响应后，会将其缓存起来，并转发给用户。
后续的请求如果命中CDN缓存，CDN将直接返回这个带有CORS头的缓存副本。

3. 流程图

graph LR
    A[浏览器请求<br/>(Origin: https://www.app.com)] --> B(CDN边缘节点);
    B --> C{是否命中缓存?};
    C -- 是 --> D[返回缓存资源<br/>(携带CORS头)];
    C -- 否 --> E[回源到OSS];
    E --> F[OSS验证请求<br/>并添加CORS响应头];
    F --> B[CDN缓存响应并返回给浏览器];
    D --> G([用户成功加载资源]);
    B --> G;
```  E --> F[OSS验证请求<br/>并添加CORS响应头];
    F --> B[CDN缓存响应并返回给浏览器];
    D --> G([用户成功加载资源]);
    B --> G;