Cloudflare 加速实战:从缓存规则到 Nginx 配置,一次调好网站性能
Cloudflare 性能优化教程|附配置文件
Cloudflare 是目前最常用的网站性能优化与安全防护平台之一。它通过全球 Anycast CDN、智能缓存、HTTP/3、Brotli 压缩、WAF、防 DDoS、DNS 加速等能力,帮助网站降低源站压力、提升访问速度,并增强整体安全性。
不过,很多站点虽然接入了 Cloudflare,但只是简单修改了 DNS,并没有充分利用它的性能优化能力。尤其是对于 WordPress、静态网站、API 服务、跨境访问站点来说,Cloudflare 的配置是否合理,会直接影响首屏速度、缓存命中率、TTFB、稳定性以及源站负载。
本文将系统讲解 Cloudflare 的性能优化思路,并提供可直接参考的配置方案,包括 DNS、SSL/TLS、缓存规则、页面规则、压缩、HTTP/3、源站 Nginx 配置、WordPress 优化建议等内容。
一、Cloudflare 性能优化的核心思路
在开始配置之前,先理解 Cloudflare 的优化逻辑。
Cloudflare 的性能优化主要围绕以下几个方向:
-
DNS 加速
- 使用 Cloudflare 的全球 DNS 解析网络,缩短 DNS 查询时间。
- 支持代理模式,将用户请求接入 Cloudflare 边缘节点。
-
CDN 缓存
- 静态资源可缓存在 Cloudflare 节点。
- 用户访问时优先从离用户最近的边缘节点返回资源。
- 降低源站带宽和服务器压力。
-
协议优化
- 支持 HTTP/2、HTTP/3、QUIC。
- 启用 Brotli 压缩。
- 开启 TLS 1.3,减少 HTTPS 握手耗时。
-
图片与前端优化
- 可启用 Polish、Mirage、Rocket Loader 等功能。
- 免费套餐也可通过缓存规则、压缩和合理配置实现不错的优化效果。
-
源站配合优化
- Cloudflare 不是万能的。
- 如果源站响应慢、动态页面过重、数据库查询过多,即使套了 CDN,首次动态请求仍可能慢。
- 因此需要配合 Nginx、PHP、缓存插件或静态化策略。
二、接入 Cloudflare 前的准备工作
在正式配置前,建议先完成以下检查。
1. 确认域名 DNS 记录
进入 Cloudflare 后,系统会自动扫描现有 DNS 记录,但扫描结果不一定完整。
常见记录包括:
| 类型 | 名称 | 内容 | 用途 |
|---|---|---|---|
| A | @ | 服务器 IP | 根域名 |
| A | www | 服务器 IP | www 子域名 |
| CNAME | cdn | example.com | CDN 子域名 |
| MX | @ | 邮件服务器 | 邮件收发 |
| TXT | @ | SPF/DKIM/验证记录 | 域名验证 |
需要特别注意:
- 网站相关记录可开启 Cloudflare 代理,也就是橙色云朵。
- 邮件相关记录不要开启代理,应保持灰色云朵。
- SSH、FTP、面板端口等服务不建议直接通过 Cloudflare 免费代理访问。
2. 确认源站支持 HTTPS
建议源站服务器提前部署有效 SSL 证书。
可以使用:
- Let's Encrypt 免费证书;
- ZeroSSL;
- 商业 SSL 证书;
- Cloudflare Origin Certificate。
如果源站没有 HTTPS,只使用 Cloudflare 的前端 HTTPS,容易造成安全隐患,也可能出现跳转循环或 mixed content 问题。
三、DNS 配置优化
Cloudflare 的 DNS 本身速度较快,但配置时要注意代理状态。
推荐 DNS 配置示例
A @ 192.0.2.10 Proxied
A www 192.0.2.10 Proxied
A api 192.0.2.10 Proxied 或 DNS Only
CNAME static example.com Proxied
MX @ mail.example.com DNS Only
A mail 192.0.2.20 DNS Only
TXT @ v=spf1 mx ~all DNS Only
说明:
@和www是网站主入口,建议开启代理。static用于静态资源域名,建议开启代理。api是否代理取决于业务:- 普通接口可代理;
- WebSocket、特殊端口、长连接业务需测试;
- 对真实客户端 IP 有强依赖的接口需正确配置回源 IP。
mail必须关闭代理,否则邮件服务可能异常。
四、SSL/TLS 配置优化
Cloudflare 的 SSL/TLS 设置非常关键,错误配置会导致跳转循环、访问不安全或性能下降。
进入:
Cloudflare 控制台 → SSL/TLS
1. 加密模式选择
推荐使用:
Full (strict)
不同模式说明:
| 模式 | 说明 | 是否推荐 |
|---|---|---|
| Off | 不启用 HTTPS | 不推荐 |
| Flexible | 用户到 Cloudflare 是 HTTPS,Cloudflare 到源站是 HTTP | 不推荐 |
| Full | 用户到 Cloudflare 和 Cloudflare 到源站都是 HTTPS,但不验证源站证书 | 一般 |
| Full (strict) | 全链路 HTTPS,并验证源站证书 | 推荐 |
如果源站已经安装有效证书,建议直接使用 Full (strict)。
2. 开启 Always Use HTTPS
路径:
SSL/TLS → Edge Certificates → Always Use HTTPS
建议开启:
Always Use HTTPS: On
作用是将所有 HTTP 请求重定向到 HTTPS。
3. 开启 TLS 1.3
路径:
SSL/TLS → Edge Certificates → TLS 1.3
建议:
TLS 1.3: On
TLS 1.3 可以减少握手次数,提高 HTTPS 连接速度。
4. 最低 TLS 版本
推荐设置:
Minimum TLS Version: TLS 1.2
如果需要兼容非常老的浏览器,可设为 TLS 1.0 或 1.1,但不建议。
五、Speed 性能配置
进入:
Cloudflare 控制台 → Speed → Optimization
1. Brotli 压缩
建议开启:
Brotli: On
Brotli 对 HTML、CSS、JS、SVG、JSON 等文本资源压缩效果较好,通常比 Gzip 更高效。
2. HTTP/2 与 HTTP/3
进入:
Network
推荐:
HTTP/2: On
HTTP/3 with QUIC: On
0-RTT Connection Resumption: On
说明:
- HTTP/2 可提升多资源并发加载效率。
- HTTP/3 基于 QUIC,在弱网、高丢包环境下体验更好。
- 0-RTT 可减少重复访问时的连接延迟,但对极少数安全敏感业务需评估重放风险。
3. Auto Minify
建议谨慎开启:
Auto Minify HTML: On
Auto Minify CSS: On
Auto Minify JS: 视情况
说明:
- HTML、CSS 通常可以开启。
- JS 压缩有时会导致某些脚本异常,尤其是已经经过构建工具压缩的网站。
- 如果你的站点使用 Vite、Webpack、Next.js、Nuxt、WordPress 缓存插件等已经压缩过资源,可以关闭 Cloudflare 的 JS Minify。
推荐配置:
Auto Minify:
- HTML: On
- CSS: On
- JavaScript: Off 或测试后开启
4. Rocket Loader
Rocket Loader 可以延迟加载 JavaScript,但也容易影响前端交互、统计代码、广告代码或框架初始化。
建议:
Rocket Loader: Off
除非你的网站是传统页面,并且已经充分测试兼容性。
六、缓存配置优化
Cloudflare 的性能提升,很大程度来自缓存。
进入:
Caching → Configuration
1. Caching Level
推荐:
Caching Level: Standard
说明:
- Standard:根据 URL 缓存静态资源,适合大多数网站。
- Ignore Query String:忽略查询参数缓存,可能导致动态资源错乱。
- No Query String:只缓存无查询参数的资源。
一般站点使用 Standard 即可。
2. Browser Cache TTL
推荐设置:
Browser Cache TTL: 1 month
如果你的网站静态资源文件名带 hash,例如:
app.8f3a1c.js
style.9c23b.css
可以设置更长:
Browser Cache TTL: 6 months 或 1 year
如果静态资源文件名不变,则建议不要设置太长,否则更新后用户端可能仍加载旧文件。
3. Always Online
建议:
Always Online: On
当源站临时不可用时,Cloudflare 可能返回已缓存页面,提高可用性。
七、缓存规则配置示例
Cloudflare 新版更推荐使用 Cache Rules,而不是旧版 Page Rules。
进入:
Rules → Cache Rules
下面给出几个常用规则。
规则一:缓存静态资源
适用于 CSS、JS、图片、字体等资源。
匹配表达式
(http.request.uri.path matches "(?i)\.(css|js|jpg|jpeg|png|gif|webp|avif|svg|ico|woff|woff2|ttf|eot)$")
配置动作
Cache eligibility: Eligible for cache
Edge TTL: 30 days
Browser TTL: 30 days
说明
该规则能有效提升静态资源命中率。对于带版本号或 hash 的资源,可以将 Edge TTL 和 Browser TTL 设置为 6 个月或 1 年。
规则二:缓存 HTML 页面,适合静态网站
如果你的网站是静态博客、文档站、纯前端站点,可以缓存 HTML。
匹配表达式
(hostname eq "example.com" or hostname eq "www.example.com")
配置动作
Cache eligibility: Eligible for cache
Edge TTL: 1 hour
Browser TTL: 10 minutes
Cache key: default
如果页面更新不频繁,可以设置:
Edge TTL: 1 day
Browser TTL: 30 minutes
注意
不建议对登录后台、用户中心、购物车、支付页缓存 HTML,否则可能造成用户数据错乱。
规则三:绕过后台与登录页缓存
适用于 WordPress、Discuz、Typecho、Laravel 等动态网站。
匹配表达式
(http.request.uri.path contains "/wp-admin"
or http.request.uri.path contains "/wp-login.php"
or http.request.uri.path contains "/admin"
or http.request.uri.path contains "/login"
or http.request.uri.path contains "/cart"
or http.request.uri.path contains "/checkout"
or http.request.uri.path contains "/user")
配置动作
Cache eligibility: Bypass cache
说明
该规则应放在缓存 HTML 规则之前,避免后台页面被缓存。
规则四:绕过带登录 Cookie 的请求
对于 WordPress,登录用户访问前台时通常不应返回缓存 HTML。
匹配表达式
(http.cookie contains "wordpress_logged_in_"
or http.cookie contains "wp-postpass_"
or http.cookie contains "comment_author_")
配置动作
Cache eligibility: Bypass cache
八、Page Rules 旧版配置参考
如果你仍在使用 Page Rules,可以参考以下配置。
Page Rule 1:后台不缓存
URL:
example.com/wp-admin/*
Settings:
Cache Level: Bypass
Disable Performance
Page Rule 2:登录页不缓存
URL:
example.com/wp-login.php*
Settings:
Cache Level: Bypass
Disable Performance
Page Rule 3:全站静态资源缓存
URL:
example.com/*
Settings:
Cache Level: Standard
Edge Cache TTL: 1 month
Browser Cache TTL: 1 month
如果是静态站点,可以使用:
Cache Level: Cache Everything
Edge Cache TTL: 1 day
但动态站点不要轻易全站 Cache Everything。
九、WordPress 推荐配置
WordPress 是动态 CMS,如果配置不当,很容易出现后台异常、评论不刷新、登录用户看到缓存页面等问题。
1. 推荐 Cloudflare 配置
SSL Mode: Full (strict)
Always Use HTTPS: On
Brotli: On
HTTP/2: On
HTTP/3: On
Rocket Loader: Off
Caching Level: Standard
Browser Cache TTL: 1 month
2. WordPress 缓存策略
推荐组合:
Cloudflare CDN + WordPress 页面缓存插件 + 对登录用户绕过缓存
常见插件:
- WP Rocket;
- LiteSpeed Cache;
- W3 Total Cache;
- WP Super Cache;
- Cache Enabler。
如果服务器使用 OpenLiteSpeed 或 LiteSpeed Enterprise,建议使用 LiteSpeed Cache。
3. WordPress Cloudflare Cache Rules 示例
后台与登录绕过缓存
(http.request.uri.path contains "/wp-admin"
or http.request.uri.path contains "/wp-login.php")
动作:
Bypass cache
登录 Cookie 绕过缓存
(http.cookie contains "wordpress_logged_in_")
动作:
Bypass cache
静态资源缓存
(http.request.uri.path matches "(?i)\.(css|js|jpg|jpeg|png|gif|webp|avif|svg|ico|woff|woff2)$")
动作:
Eligible for cache
Edge TTL: 30 days
Browser TTL: 30 days
4. 是否缓存 WordPress HTML?
可以,但要谨慎。
适合缓存 HTML 的情况:
- 主要是博客文章;
- 没有复杂会员系统;
- 评论不要求实时;
- 已设置登录 Cookie 绕过;
- 已设置后台绕过;
- 有清理缓存机制。
不适合缓存 HTML 的情况:
- 电商网站;
- 会员中心;
- 在线课程系统;
- 论坛;
- 频繁个性化页面;
- 多用户动态内容站。
十、Nginx 源站配置文件示例
Cloudflare 可以加速边缘访问,但源站仍然需要合理配置。下面给出一份适合常见 PHP/WordPress 站点的 Nginx 示例配置。
请将
example.com、证书路径、PHP-FPM socket 根据实际环境修改。
server {
listen 80;
server_name example.com www.example.com;
return 301 https://$host$request_uri;
}
server {
listen 443 ssl http2;
server_name example.com www.example.com;
root /var/www/example.com;
index index.php index.html index.htm;
ssl_certificate /etc/letsencrypt/live/example.com/fullchain.pem;
ssl_certificate_key /etc/letsencrypt/live/example.com/privkey.pem;
ssl_protocols TLSv1.2 TLSv1.3;
ssl_prefer_server_ciphers off;
# 获取 Cloudflare 真实访客 IP
real_ip_header CF-Connecting-IP;
set_real_ip_from 173.245.48.0/20;
set_real_ip_from 103.21.244.0/22;
set_real_ip_from 103.22.200.0/22;
set_real_ip_from 103.31.4.0/22;
set_real_ip_from 141.101.64.0/18;
set_real_ip_from 108.162.192.0/18;
set_real_ip_from 190.93.240.0/20;
set_real_ip_from 188.114.96.0/20;
set_real_ip_from 197.234.240.0/22;
set_real_ip_from 198.41.128.0/17;
set_real_ip_from 162.158.0.0/15;
set_real_ip_from 104.16.0.0/13;
set_real_ip_from 104.24.0.0/14;
set_real_ip_from 172.64.0.0/13;
set_real_ip_from 131.0.72.0/22;
# 静态资源缓存
location ~* \.(css|js|jpg|jpeg|png|gif|webp|avif|svg|ico|woff|woff2|ttf|eot)$ {
expires 30d;
add_header Cache-Control "public, max-age=2592000, immutable";
access_log off;
log_not_found off;
}
# 禁止访问隐藏文件
location ~ /\.(?!well-known) {
deny all;
}
# WordPress 固定链接
location / {
try_files $uri $uri/ /index.php?$args;
}
# PHP 处理
location ~ \.php$ {
include fastcgi_params;
fastcgi_pass unix:/run/php/php8.2-fpm.sock;
fastcgi_index index.php;
fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
# 避免 PHP 输出被过度缓存
fastcgi_buffer_size 32k;
fastcgi_buffers 8 32k;
fastcgi_busy_buffers_size 64k;
}
# 安全响应头,可根据业务调整
add_header X-Frame-Options "SAMEORIGIN" always;
add_header X-Content-Type-Options "nosniff" always;
add_header Referrer-Policy "strict-origin-when-cross-origin" always;
}
十一、静态网站推荐配置
如果你的网站是 Hugo、Hexo、VuePress、VitePress、Astro、Next.js 静态导出等类型,可以更激进地缓存。
Cloudflare 推荐配置
Cache Rules:
1. 缓存所有静态资源
2. 缓存 HTML 页面
Edge TTL:
- HTML: 1 hour 到 1 day
- CSS/JS/Image/Font: 30 days 到 1 year
Browser TTL:
- HTML: 10 minutes 到 30 minutes
- CSS/JS/Image/Font: 30 days 到 1 year
如果每次构建后文件名都会带 hash,可以配置:
Static Assets:
Edge TTL: 1 year
Browser TTL: 1 year
Cache-Control: immutable
静态站点的 Nginx 示例:
server {
listen 80;
server_name example.com www.example.com;
root /var/www/example.com;
index index.html;
location / {
try_files $uri $uri/ /index.html;
}
location ~* \.(css|js|jpg|jpeg|png|gif|webp|avif|svg|ico|woff|woff2)$ {
expires 365d;
add_header Cache-Control "public, max-age=31536000, immutable";
access_log off;
}
}
十二、API 服务是否适合走 Cloudflare?
API 服务可以走 Cloudflare,但需要根据业务选择策略。
适合代理的 API
- 普通 REST API;
- GraphQL 查询接口;
- 公开数据接口;
- 可缓存的 GET 请求;
- 需要防护恶意请求的接口。
不适合强缓存的 API
- 登录接口;
- 支付接口;
- 用户资料接口;
- 后台管理接口;
- 实时状态接口;
- 与用户身份强相关的接口。
API 缓存规则示例
仅缓存 GET 请求,并排除带认证头的请求:
(http.request.method eq "GET"
and http.request.uri.path starts_with "/api/public/"
and not http.request.headers["authorization"][0])
动作:
Eligible for cache
Edge TTL: 5 minutes
Browser TTL: 0 seconds
对于登录、支付等接口:
(http.request.uri.path starts_with "/api/auth/"
or http.request.uri.path starts_with "/api/payment/"
or http.request.uri.path starts_with "/api/user/")
动作:
Bypass cache
十三、Cloudflare 源站真实 IP 配置
接入 Cloudflare 后,源站看到的访问 IP 默认是 Cloudflare 节点 IP,而不是真实用户 IP。
如果不配置真实 IP,会导致:
- 日志中看不到真实访客 IP;
- 限流策略失效;
- WordPress 评论 IP 不准确;
- 安全审计困难;
- Fail2ban、WAF 判断异常。
Nginx 中应使用:
real_ip_header CF-Connecting-IP;
并添加 Cloudflare IP 段:
set_real_ip_from 173.245.48.0/20;
set_real_ip_from 103.21.244.0/22;
set_real_ip_from 103.22.200.0/22;
set_real_ip_from 103.31.4.0/22;
set_real_ip_from 141.101.64.0/18;
set_real_ip_from 108.162.192.0/18;
set_real_ip_from 190.93.240.0/20;
set_real_ip_from 188.114.96.0/20;
set_real_ip_from 197.234.240.0/22;
set_real_ip_from 198.41.128.0/17;
set_real_ip_from 162.158.0.0/15;
set_real_ip_from 104.16.0.0/13;
set_real_ip_from 104.24.0.0/14;
set_real_ip_from 172.64.0.0/13;
set_real_ip_from 131.0.72.0/22;
建议定期更新 Cloudflare IP 段,可在服务器中写脚本自动同步。
十四、推荐 Cloudflare 配置文件汇总
下面是一份通用站点配置清单。
cloudflare:
ssl_tls:
encryption_mode: "Full (strict)"
always_use_https: true
tls_1_3: true
minimum_tls_version: "TLS 1.2"
network:
http2: true
http3_quic: true
zero_rtt: true
websockets: true
ipv6_compatibility: true
speed:
brotli: true
auto_minify:
html: true
css: true
js: false
rocket_loader: false
caching:
caching_level: "Standard"
browser_cache_ttl: "1 month"
always_online: true
cache_rules:
- name: "Bypass Admin and Login"
expression: >
http.request.uri.path contains "/wp-admin"
or http.request.uri.path contains "/wp-login.php"
or http.request.uri.path contains "/admin"
or http.request.uri.path contains "/login"
action: "bypass_cache"
- name: "Bypass Logged In Users"
expression: >
http.cookie contains "wordpress_logged_in_"
or http.cookie contains "session"
or http.cookie contains "token"
action: "bypass_cache"
- name: "Cache Static Assets"
expression: >
http.request.uri.path matches "(?i)\\.(css|js|jpg|jpeg|png|gif|webp|avif|svg|ico|woff|woff2|ttf|eot)$"
action: "cache"
edge_ttl: "30 days"
browser_ttl: "30 days"
- name: "Cache HTML For Static Site"
expression: >
hostname eq "example.com"
and not http.request.uri.path contains "/admin"
and not http.request.uri.path contains "/login"
action: "cache"
edge_ttl: "1 hour"
browser_ttl: "10 minutes"
十五、性能测试方法
配置完成后,不要只凭感觉判断速度,应通过工具测试。
1. 查看缓存命中
使用 curl:
curl -I https://example.com/style.css
重点查看:
cf-cache-status: HIT
常见状态:
| 状态 | 含义 |
|---|---|
| HIT | 命中 Cloudflare 缓存 |
| MISS | 未命中缓存,已回源 |
| BYPASS | 被规则绕过 |
| EXPIRED | 缓存过期,重新回源 |
| DYNAMIC | 动态内容,未缓存 |
| REVALIDATED | 已重新验证缓存 |
2. 测试 TTFB
curl -o /dev/null -s -w "DNS: %{time_namelookup}\nConnect: %{time_connect}\nTTFB: %{time_starttransfer}\nTotal: %{time_total}\n" https://example.com/
关注:
TTFB
Total
如果静态资源 TTFB 很低,但首页 TTFB 很高,说明首页动态生成慢,需要优化源站。
3. 使用在线工具
可使用:
- PageSpeed Insights;
- GTmetrix;
- WebPageTest;
- Lighthouse;
- Cloudflare Analytics;
- Chrome DevTools Network 面板。
十六、常见问题与解决方案
1. 开启 Cloudflare 后网站无限跳转
常见原因是 SSL 模式使用了 Flexible,而源站又强制 HTTPS。
解决方案:
SSL/TLS → Full (strict)
并确保源站证书有效。
2. 页面更新后用户看不到新内容
可能是缓存时间太长。
解决方案:
- 清理 Cloudflare 缓存;
- 降低 HTML 的 Edge TTL;
- 静态资源使用 hash 文件名;
- 后台发布文章后自动 Purge Cache。
3. WordPress 后台样式异常
可能是后台资源被压缩或缓存规则影响。
解决方案:
/wp-admin/*
/wp-login.php*
设置为:
Bypass cache
Disable performance features
并关闭 Rocket Loader。
4. 获取不到真实用户 IP
在 Nginx 或 Apache 中配置 Cloudflare Real IP。
Nginx:
real_ip_header CF-Connecting-IP;
WordPress 可配合插件或服务器配置修复。
5. API 返回旧数据
可能是 API 被缓存。
解决方案:
对动态 API 设置:
Bypass cache
或者只缓存公开 GET 接口,并设置较短 Edge TTL。
十七、推荐优化顺序
如果你刚接入 Cloudflare,建议按以下顺序操作:
- 正确配置 DNS;
- 源站部署 HTTPS 证书;
- SSL 模式设置为
Full (strict); - 开启 Always Use HTTPS;
- 开启 Brotli、HTTP/2、HTTP/3;
- 设置静态资源缓存规则;
- 绕过后台、登录页、用户中心缓存;
- 根据网站类型决定是否缓存 HTML;
- 配置源站真实 IP;
- 使用 curl 和 Lighthouse 测试;
- 根据缓存命中率和 TTFB 继续调整。
十八、总结
Cloudflare 的性能优化并不是简单“打开橙色云朵”就完成了。真正有效的配置应当结合网站类型、源站性能、缓存策略和业务安全需求。
对于大多数网站,推荐的基础方案是:
Full (strict) HTTPS
Brotli 开启
HTTP/2、HTTP/3 开启
Rocket Loader 关闭
静态资源长期缓存
后台和登录页绕过缓存
动态页面谨慎缓存
源站配置真实 IP
如果是静态博客或文档站,可以进一步开启 HTML 缓存,让 Cloudflare 边缘节点直接返回页面,显著降低 TTFB。
如果是 WordPress、电商、会员系统或 API 服务,则需要严格区分静态资源、公开页面和用户私有数据,避免缓存错误造成数据泄露或页面错乱。
合理使用 Cloudflare,可以让网站在不更换服务器的情况下获得明显的访问速度提升,同时增强安全性和稳定性。最重要的是:每次修改配置后都要测试缓存命中、页面功能和用户体验,而不是盲目开启所有优化开关。