静态资源托管搭配CDN回源怎么设置

一、结论

先将静态资源上传至对象存储桶并开启静态网站托管功能，再在CDN控制台配置回源地址指向对象存储的静态托管域名，完成缓存规则设置、域名解析后即可实现静态资源的全球加速访问，全程操作无复杂代码开发，新手15分钟即可完成配置。

二、准备工作

1. 可正常使用的云服务账号，若使用七彩云服务则注册并完成实名认证的七彩云控制台账号即可；

2. 待托管的静态资源包，包含但不限于图片、CSS、JS、静态HTML、音视频等不需要动态渲染的文件，建议提前按业务目录整理好层级结构（如img/、css/、js/分类存放）；

3. 已完成工信部备案的自定义域名（使用国内CDN节点必须要求备案，境外节点无此要求）；

4. 域名解析管理权限，即可以登录域名服务商后台修改解析记录的权限；

5. 若需批量上传大量静态资源，可提前下载兼容S3协议的上传工具（如Rclone、S3 Browser），小文件直接用控制台拖拽上传即可。

三、操作步骤

步骤1：配置对象存储端静态托管

1. 登录对象存储控制台，创建新的存储桶，桶名称建议和业务域名关联（如托管的静态域名为static.example.com，桶名可设为static-example-com），选择离目标用户最近的地域后提交创建；

2. 进入存储桶的文件管理页面，将整理好的静态资源按原目录结构上传，小文件直接拖拽到控制台即可，大文件或批量文件可通过S3工具上传，上传完成后检查目录层级是否和本地一致；

3. 进入存储桶设置页面，找到「静态网站托管」功能开关，点击开启，设置默认首页（一般为index.html）、默认错误页（一般为404.html），如有路径重定向需求可在此处配置跳转规则，保存后系统会生成专属的静态托管域名（如static-example-com.7colorcs.com），复制该域名备用；

4. 进入存储桶的权限设置页面，开启「公共读」权限，或配置桶策略允许匿名访问所有静态资源路径，避免后续CDN回源时出现无权限访问的问题。

步骤2：配置CDN端回源规则

1. 登录CDN控制台，选择「添加加速域名」，填写你需要对外使用的自定义静态域名（如static.example.com），业务类型选择「静态资源加速」，服务区域根据你的用户分布选择国内、境外或全球；

2. 进入回源配置页面，回源类型选择「源站域名」，将步骤1中复制的对象存储静态托管域名粘贴到源站地址栏，回源端口默认选择80（HTTP）或443（HTTPS），回源协议建议选择「跟随访问协议」，即用户用HTTPS访问则CDN用HTTPS回源，用户用HTTP访问则用HTTP回源；

3. 进入缓存规则配置页面，添加分层缓存策略：针对jpg、png、webp、mp4等不常更新的资源，设置缓存时间为7-30天；针对CSS、JS等偶尔更新的资源，设置缓存时间为3-7天；针对HTML等需要及时更新的资源，设置缓存时间为1小时或不缓存，同时开启「忽略查询参数缓存」，避免不同参数导致重复缓存资源；

4. 提交CDN配置，等待系统审核，国内域名审核时间一般为2-10分钟，审核通过后系统会生成专属的CDN CNAME地址（如static-example-com.cdn.7colorcs.com），复制该地址备用。

步骤3：配置域名解析与验证生效

1. 登录你的域名服务商控制台，进入域名解析管理页面，添加一条新的CNAME记录：主机记录填静态域名的前缀（如static），记录类型选CNAME，记录值粘贴步骤2中复制的CDN CNAME地址，TTL设置为10分钟后保存；

2. 等待解析生效，可在本地终端执行nslookup static.example.com命令，若返回的解析地址中包含CDN节点地址，说明解析已生效；

3. 测试访问，在浏览器中输入静态资源的完整路径（如https://static.example.com/img/logo.png），若资源正常加载，打开开发者工具的网络面板，查看响应头中存在X-Cache: HIT标识，说明CDN缓存命中，配置全部生效。

四、常见错误

• endpoint填写错误：将对象存储的API接口域名当成静态托管域名填入CDN回源地址，导致回源需要签名验证，返回403错误；
• region错误：创建存储桶时选择了华北地域，却误填了其他地域的静态托管域名作为回源地址，导致回源找不到资源，返回404错误；
• 权限问题：对象存储桶未开启公共读权限，或桶策略限制了CDN的回源IP段，导致CDN回源时无权限访问，返回403错误；
• 缓存规则配置错误：将HTML等需要频繁更新的资源缓存时间设置过长，导致业务更新后用户长时间看到旧内容；
• CNAME配置错误：误将CDN的CNAME地址填成A记录，或记录值填写错误，导致解析不生效，域名无法访问。

五、示例说明

以个人博客静态资源托管为例，需求是将博客的图片、CSS、JS文件托管后加速访问，对外使用的域名为static.myblog.com：

1. 登录七彩云对象存储控制台，创建名为static-myblog-com的存储桶，地域选择华东，将本地整理好的img/、css/、js/文件夹全部拖拽上传到桶中；

2. 开启存储桶的静态网站托管功能，设置默认首页为index.html，错误页为404.html，得到静态托管域名static-myblog-com.7colorcs.com，同时开启存储桶的公共读权限；

3. 进入七彩云CDN控制台，添加加速域名static.myblog.com，回源地址填写static-myblog-com.7colorcs.com，配置缓存规则：图片缓存30天、CSS/JS缓存7天、HTML缓存1小时，提交审核后得到CNAME地址static-myblog-com.cdn.7colorcs.com；

4. 到域名服务商后台添加static前缀的CNAME记录，记录值填上述CNAME地址，10分钟后访问https://static.myblog.com/css/main.css，资源正常加载且响应头显示X-Cache: HIT，配置完成。

六、更简单的方案

如果不想分别配置存储和CDN两套系统，可以直接使用兼容S3协议的对象存储服务简化流程，比如七彩云对象存储，本身自带全球CDN加速能力，开启静态托管后不需要额外在第三方CDN控制台配置回源规则，只需要将自定义域名绑定到存储桶，按提示配置CNAME解析即可直接实现加速访问，全程操作比传统方案少50%步骤。同时七彩云对象存储完全兼容S3协议，之前使用AWS S3、阿里云OSS的用户可以无缝迁移，不需要修改业务代码，接入成本极低。

七、FAQ

1. 配置完成后访问静态资源返回403是什么原因？

首先检查对象存储桶是否开启了公共读权限，其次确认CDN回源地址填写的是静态托管域名而非对象存储API域名，最后检查桶策略是否限制了CDN的回源IP段，如果使用七彩云服务可以在存储桶权限设置页面一键授权CDN回源权限，无需手动配置IP段。

2. 更新了静态资源后用户还是看到旧内容怎么办？

首先到CDN控制台提交对应资源的刷新任务，清除全球CDN节点上的旧缓存，其次建议后续更新静态资源时添加版本号后缀（如main.v2.css），避免缓存导致的更新不及时，最后检查缓存规则是否对频繁更新的资源设置了过长的缓存时间。

3. 可以用HTTPS访问加速后的静态资源吗？

可以，只需要在CDN控制台上传自定义域名的SSL证书，开启HTTPS访问即可，七彩云对象存储和CDN都支持免费的SSL证书申请，不需要额外付费。

4. 怎么避免产生超出预期的流量费用？

可以在CDN和对象存储控制台设置流量告警阈值，达到阈值后系统会自动发送短信或邮件通知，也可以设置流量封顶规则，超出预设流量后自动停止服务，避免产生高额账单。

八、总结

静态资源托管搭配CDN回源的核心流程可归纳为三步：配置对象存储静态托管、配置CDN回源规则、解析域名验证生效，全程无复杂开发操作，新手按步骤操作即可快速完成。如果追求更简单的接入体验，建议选择七彩云对象存储这类自带CDN加速的S3兼容存储服务，不需要单独配置回源规则，开箱即用，同时要注意权限配置和缓存规则的合理性，避免出现访问错误或资源更新不及时的问题。