博客架构升级-静态托管与视频迁R2

最近我把系统架构从「反向隧道」换成了「服务器静态托管 + 视频走 Cloudflare R2」，简单描述下起因：

老架构一直有一个致命短板：可用性完全绑定在一台家用电脑上。

也就是说我电脑需要保持是可在线的状态，网络也需要时刻保持联通，不能和 VPS 断开连接（事实上很难保证这点，因为网络波动丢包，服务器在国外）

还有一点就是，我将站点提交SEO收录，SEO 要的是「长期稳定在线」，还有为了以后网站的长期发展，我不能总把开发环境和生产环境混在一起，不能让我的站点变得不稳定。

一、老架构：反向 SSH 隧道

博客根本不部署到服务器上，而是跑在我自己的电脑上，再用一条反向 SSH 隧道把它开放到公网：

1、本地电脑上将项目跑起来。

2、 建立 反向隧道把服务器的 127.0.0.1:8080 转发回电脑的 8081。

3、服务器 nginx 把 detached.online 反代到 127.0.0.1:8080。

优势

1、更新发布更方便，资源文件全在本机，本地就是生产环境，改完立即生效，没有「构建 → 上传」的中间环节

2、VPS 只做带宽转发，磁盘、CPU 占用全在本地，不会对服务器造成压力

3、数据主权与安全。服务器只是个「空壳代理」，本身不存任何内容，就算 VPS 被入侵，我的本地文件还是安全的，恢复也方便

4、不依赖三方服务，不受任何对象存储、CDN 的封禁、宕机、政策影响，完全自主可控

5、成本极低，只需一台拥有公网IP的VPS，不依赖任何付费服务

短板

致命的一条：可用性完全绑定在一台家用电脑上。 电脑关机、睡眠、重启，家庭网络波动，甚至系统自动更新——任何一个都会让整站直接掉线。这套架构自娱自乐没问题，一旦要「对外长期稳定」，这条就是硬伤。

二、新架构：服务器静态托管 + 视频走 R2

两个目标：服务器独立托管网页，视频不能对服务器存储造成压力

整个项目大小：网页/图片/字体（约 200M~300M）、视频（4 ~ 5G）

如果把视频和网页一样处理上传到VPS，不光会占用VPS的硬盘存储，还会占用带宽导致整个网站带宽压力大。除此之外，每次如果有新增视频上传到服务器这段时间服务器带宽也会有很大的压力

所以我把视频分流到 CloudFlare R2 对象存储里面，能提供 10G 的免费存储空间足够我放置视频了

视频的处理需要使用 nginx 用一段 302 重定向分流：请求 /video/xxx 时不读磁盘，直接回跳转，让浏览器直连 R2/CDN 拿视频，因为使用普通的反向代理还是会消耗服务器的流量！

location /video/ {
    # R2 对象在桶根目录，剥掉 /video/ 前缀再跳转
    rewrite ^/video/(.*)$ https://video.detached.online/$1 redirect;
}

它的优点

1、视频给 R2，对服务器存储和带宽都零压力。R2 免费额度 10G 足够放 4.7G 视频，而且视频加载不走服务器带宽，出站流量 egress 免费、不限量，正常个人博客就是 $0/月

2、能长期稳定运行，不需要维持本地 100% 在线、也不依赖家里的网络稳定。

3、更新零掉线。构建在本地完成，压根不碰线上服务器

4、通讯链路更短，延迟更低，加载更快！下面是新老架构的通讯线路对比

老:  用户 ─▶ VPS ─▶ 本机 ─▶ VPS ─▶ 用户     （四跳，慢）
新:  用户 ─▶ VPS(只发网页)
     用户 ─▶ Cloudflare CDN(视频，就近边缘节点)   （更短，快）

它有哪些不足

1、不再是「服务器空壳」，内容现在落到了 VPS 磁盘 + R2，多了需要信任的远端。

2、多了一层第三方依赖。视频绑上了 Cloudflare 生态

3、发布多了一步。本地改完要 build + 和服务器同步文件才上线，没有老架构「本地即线上」那么即时

总结