云上小项目提速记：用对象存储+CDN搭一个低成本静态站点

一、为什么选对象存储加 CDN

静态站点没有服务端计算，只有 HTML、CSS、JavaScript 和图片等文件需要被分发。把这些文件放在对象存储（以华为云 OBS 为例）里，再由 CDN 做边缘缓存和加速，是一种结构简单、成本可控的组合：源站不用长期跑一台服务器，流量高峰主要由 CDN 边缘节点承担，平时的小流量站点费用也比较低。

这个组合适合文档站、产品介绍页、个人作品集、活动落地页等内容变化不频繁的场景。如果站点需要登录态、数据库写入或服务端渲染，就不适合只用这一套方案，需要再引入后端服务。

二、整体结构

浏览器请求先到达 CDN 边缘节点；命中缓存时直接返回，未命中时回源到 OBS 桶拉取文件。部署时只需要做三件事：建桶并上传文件、开启静态网站托管、把 CDN 的源站指向这个桶。

三、操作步骤

1. 创建桶并上传文件

创建一个对象存储桶，上传 index.html、样式文件、脚本文件和图片。建议按类型分目录存放，例如 css、js、images，这样后续更新和排查都更方便。上传后先确认 index.html 能通过对象地址正常打开，再继续接 CDN，避免把源站问题带到加速环节。

2. 开启静态网站托管

在桶的静态网站托管设置里，把默认首页设为 index.html，并根据需要设置错误页面。很多 404 其实不是文件丢失，而是首页文件名、路径大小写或默认首页没有配对。先在源站侧把这两个页面验证通过，再交给 CDN。

3. 配置 CDN 回源

新建 CDN 加速域名，源站类型选择对象存储桶，源站地址填对应的桶域名。回源协议建议与站点保持一致，开启 HTTPS 回源时要保证证书和域名都已正确配置。源站桶如果设为私有，需要配合合适的鉴权或回源配置，否则 CDN 回源会失败；公开的静态站点则要注意只放可公开的文件，不要把密钥、内部文档放进桶里。

4. 设置缓存策略

静态资源适合较长的缓存时间，例如图片、字体、带版本号的 JS 和 CSS 可以缓存几天到几周；HTML 文件建议缓存时间短一些，或者每次发布后主动刷新，因为 HTML 是入口文件，改动后如果还被旧缓存挡住，用户就看不到新版本。带哈希值的文件名是更稳妥的做法：内容变了文件名就变，旧缓存自然失效。

5. 发布后的检查清单

• 直接访问加速域名，确认首页、样式、图片都正常加载；
• 用无痕窗口或换网络再访问一次，排除本地缓存干扰；
• 故意访问一个不存在的路径，确认错误页面符合预期；
• 在浏览器开发者工具里看关键资源的响应头，确认走了 CDN 缓存还是回源；
• 更新文件后做一次 CDN 刷新，再复查首页。

四、常见问题

改了文件但页面没变：多数是 HTML 或资源被缓存。先区分是浏览器缓存、CDN 缓存还是源站文件本身没更新，再针对性刷新。

图片能打开、样式丢了：检查引用路径是相对路径还是绝对路径，部署到子目录时相对路径最容易出错。

HTTPS 报证书问题：确认加速域名绑定的证书覆盖了当前域名，并且没有过期；源站回源也需要证书链完整。

费用超出预期：先看流量和请求量来自哪里，再看是不是大文件没有压缩、缓存时间太短导致频繁回源。开启压缩、合理设置缓存，通常就能把不必要的回源降下来。

五、总结

对象存储加 CDN 的关键不在步骤多，而在分工清楚：对象存储负责可靠地存文件，CDN 负责就近分发和缓存，HTML 作为入口要保持较短的缓存周期。按“先验证源站、再接 CDN、最后检查缓存”的顺序走，小项目上线会稳很多。