Webflow 网站中国大陆访问加速

解决 Webflow 网站在中国大陆打不开/极慢的问题。方案基于 Cloudflare Worker 反向代理，涉及多项操作：移除被墙的 Google 资源、jQuery 替换为国内镜像、静态资源缓存到 R2、CSS/视频/字体路径改写等。如需更彻底的加速（延迟降至 50-100ms），则需要 ICP 备案并接入腾讯 EdgeOne 国内节点。

前置条件确认

在开始前，先了解用户现有架构：

域名与 Webflow URL：用户自定义域名是什么？原始 Webflow URL（*.webflow.io）是什么？
是否已有 CF Worker：如果已有，让用户提供现有 Worker 代码；如果没有，需要从头建
是否已有 R2 Bucket：R2 是持久化静态资源缓存的关键
CF Account ID：部署 Worker 需要
网站特殊内容：有没有视频背景、自定义字体、第三方 JS 库？

诊断清单：检测哪些资源有问题

在中国大陆，以下资源必然被屏蔽或严重降速：

资源类型	问题根源	影响
---------	---------	------
Google Fonts (`fonts.googleapis.com`)	GFW 封锁	字体加载失败，页面渲染阻塞
Google 相关 preconnect/dns-prefetch	DNS 解析超时	每次页面请求额外增加 2-5s
Google Analytics / gtag	GFW 封锁	统计失效（不阻塞渲染，但浪费连接）
WebFont Loader (`webfont.js`)	Google 相关	同 Google Fonts
Webflow CDN (Fastly + CloudFront)	无大陆节点	静态资源从海外回源，RTT 高
Webflow 注入的 jQuery (d3e54v103j8qbb.cloudfront.net)	CloudFront 无大陆节点	每次页面加载阻塞约 500ms-2s
视频文件 (`.mp4`/`.webm`)	无大陆 CDN 节点	视频无法起播，需要完整下载

如何快速诊断：用 curl 从国内 IP 测试关键资源，或让用户在国内打开浏览器 DevTools 的 Network 面板，按耗时排序。

架构方案

用户 (中国大陆)
    ↓
Cloudflare Worker (全球节点，含香港/日本/新加坡)
    ↓ 静态资源命中 R2 → 直接返回 (延迟极低)
    ↓ 静态资源未命中 → 回源 Webflow CDN → 异步写入 R2
    ↓ HTML/动态请求 → 回源 Webflow → HTMLRewriter 改写后返回
    ↓
shenye.webflow.io（原始 Webflow 站点）

关键路径：

/_cdn/{host}/{path} — 所有 Webflow 静态资源的 R2 缓存路由
HTMLRewriter — 流式改写 HTML，替换/删除被墙资源链接，无需等待完整 HTML
R2 Bucket — 永久缓存静态资源（字体、图片、JS、视频），冷启动后无需再回源

10 项核心优化（已验证）

[优化 1] HTML 响应加缓存头 + CF 边缘 cacheTtl

问题：Webflow 默认返回的 HTML 无缓存头，CF 每次都回源，大陆用户每次都经历完整 RTT。

方案：给 HTML 响应加 cache-control: public, max-age=300, s-maxage=300，同时在 fetch() 里设 cacheTtl: 300，让 CF 边缘节点缓存 5 分钟。

注意：要 delete("set-cookie") 避免带 cookie 的响应被缓存后污染其他用户。

[优化 2] 移除 Google preconnect / dns-prefetch / gstatic 标签

问题：即使不加载 Google Fonts，HTML 里残留的等标签也会让浏览器发起 DNS 查询，在大陆超时后才放弃，消耗 2-5s。

方案：用 HTMLRewriter 移除所有 href 含 google 或 gstatic 的 preconnect/dns-prefetch 标签，以及直接指向 fonts.googleapis.com/fonts.gstatic.com 的标签。

[优化 3] CSS 内 @import fonts.googleapis.com 过滤

问题：Webflow 有时会把 Google Fonts 的 @import 放进 CSS 文件里（而非 HTML ），HTMLRewriter 无法处理 CSS 内容。

方案：对 text/css 响应做文本替换，用正则删除所有 @import url(...) 中含 fonts.googleapis.com 的行。

[优化 4] R2 objectKey 包含 query string

问题：某些静态资源 URL 带有版本参数（如 ?v=xxx），如果 R2 key 只用路径，不同版本会映射到同一个 key，导致缓存错乱。

方案：objectKey 格式为 assets/{host}/{path}_{base64(queryString)}，有 query 时包含编码后的 query 部分。

[优化 5] jQuery 直接替换为 jsdmirror

背景：Webflow 在所有网站的前自动注入 jQuery 3.5.1，源固定来自 d3e54v103j8qbb.cloudfront.net（所有 Webflow 网站共用，URL 中的哈希前缀固定不变）。

问题：CloudFront 在大陆没有节点，这个 script 标签会阻塞页面完成渲染。

方案：用 HTMLRewriter 将该


    Skill工具集 © 2026

Webflow 中国加速

概述