WordPress CDN加速配置

当前位置：首页 > WordPress资源 > WordPress CDN加速配置

详情介绍

WordPress CDN加速配置是指将WordPress网站中的静态资源URL替换为CDN加速节点域名，并在CDN服务商控制台设置缓存、回源、HTTPS等规则,从而提升访问速度并降低源站负载的一组操作。

配置前需要准备的信息

先明确四个信息：源站域名、CDN加速域名、源站IP或回源地址、SSL证书，源站域名通常为www.example.com，CDN加速域名建议使用cdn.example.com或static.example.com，如果使用Cloudflare，也可以直接使用主域名开启代理,但常规自建CDN采用独立加速域名。

WordPress CDN加速配置第1张

确保源站WordPress本身可正常访问，并已经启用HTTPS，准备CDN服务商账号，如阿里云CDN、腾讯云CDN、七牛云、又拍云、Cloudflare、KeyCDN等。

在CDN服务商控制台添加加速域名

进入CDN控制台，点击“添加域名”或“创建服务”。
加速域名填写cdn.example.com。
业务类型选择“图片小文件”或“静态资源”，不要选择“流媒体”或“下载”,否则缓存与计费策略不同。
源站类型选择“源站域名”或“IP”，如果WordPress部署在云服务器上，可填写服务器公网IP；如果使用负载均衡或对象存储,可填写对应回源域名。
回源Host必须填写源站域名www.example.com，如果回源Host填写错误，源站服务器返回默认站点或443证书不匹配,导致资源无法加载。
回源协议选择“协议跟随”或“HTTPS”，源站如果已经强制HTTPS，建议选择HTTPS回源,避免多次重定向。

保存后，服务商会为该加速域名分配一个CNAME地址，例如cdn.example.com.w.cdngslb.com，需要到DNS解析服务商处添加CNAME记录，将cdn.example.com指向该CNAME地址。

配置HTTPS证书与访问控制

加速域名必须配置SSL证书，可以在CDN控制台上传证书或申请免费证书，证书需覆盖cdn.example.com，如果使用通配符证书可覆盖*.example.com，开启HTTPS后，建议同时开启“强制HTTPS”或“HTTP转HTTPS”,避免混合内容。

如果WordPress上传的字体文件通过CDN域名访问时出现跨域错误，需要在CDN控制台或源站配置Access-Control-Allow-Origin响应头,Nginx可添加：

location~*\.(woff|woff2|ttf|otf|eot)${
add_headerAccess-Control-Allow-Origin"https://www.example.com";
add_headerAccess-Control-Allow-Methods"GET";
}

CDN控制台中通常也有“HTTP头”设置，可添加Access-Control-Allow-Origin: https://www.example.com。

开启防盗链可以防止其他网站盗用CDN流量，Referer白名单一般填写主站域名及空Referer，注意部分搜索引擎或社交媒体访问可能携带不同Referer,可按需放行。

设置缓存规则

缓存规则是CDN加速配置的关键,WordPress站点推荐的缓存策略如下：

文件类型	缓存时间	说明
`.css` `.js`	30天	静态资源变更少，文件名带版本号可长缓存
`.jpg` `.jpeg` `.png` `.gif` `.webp` `.avif`	365天	图片可长期缓存
`.woff` `.woff2` `.ttf` `.otf`	365天	字体文件
`.html`	不缓存或短缓存	首页、文章页若被缓存可能导致登录状态泄露
`.php`	不缓存	动态请求必须回源
`/wp-admin/`	不缓存	后台不能缓存
`/wp-login.php`	不缓存	登录页不能缓存

开启“忽略URL参数”可以让style.css?ver=6.2与style.css?ver=6.3命中同一缓存，但前提是文件内容已更新，若忽略参数可能导致旧CSS被缓存,建议开启后发布新版本时手动刷新。

对于登录用户，带wordpress_logged_in Cookie的请求不应由CDN缓存，可在CDN控制台配置“不缓存Cookie”或“绕过缓存”规则，Cookie名称填wordpress_logged_in,部分CDN支持正则匹配Cookie内容。

WordPress侧配置方法

使用CDN Enabler插件

CDN Enabler是一款轻量插件,适合替换静态资源URL。

在WordPress后台安装并启用“CDN Enabler”。
进入“设置” > “CDN Enabler”。
CDN URL填写https://cdn.example.com。
Included Directories填写：
```
wp-content,wp-includes
```
Exclusions留空或填写.php。
保存设置。

插件会替换wp-content和wp-includes下的静态资源地址，特色图片通常位于wp-content/uploads,会被替换。

使用W3 Total Cache

W3 Total Cache功能更复杂,但CDN配置也更灵活。

安装并启用W3 Total Cache。
进入“Performance” > “General Settings”。
找到“CDN”区域，勾选“Enable”启用。
CDN Type选择“Generic Mirror”。
在“CDN”页面填写CDN地址为https://cdn.example.com。
可配置自定义文件类型、SSL支持、高级缓存。

W3 Total Cache会替换主题、插件和上传目录中的静态文件URL。

使用函数手动替换

如果不想安装插件，可以在主题functions.php中添加以下代码：

functionsite_cdn_asset_url($url){
$cdn_domain='https://cdn.example.com';
$home_domain=home_url();
if(is_admin()||is_login()){
return$url;
}
returnstr_replace($home_domain,$cdn_domain,$url);
}
add_filter('script_loader_src','site_cdn_asset_url');
add_filter('style_loader_src','site_cdn_asset_url');
add_filter('wp_get_attachment_url','site_cdn_asset_url');
add_filter('theme_file_uri','site_cdn_asset_url');

替换后，前台页面中的CSS、JS、附件图片会使用CDN域名，注意将https://cdn.example.com替换为实际加速域名。

手动替换的优点是轻量，但不会替换文章内容中硬编码的旧URL，文章中的图片如果以http://www.example.com/wp-content/uploads/...形式插入，需要额外通过数据库替换或使用插件批量替换,因此更推荐使用插件或CDN服务商提供的全站加速功能。

配置后的验证

配置完成后,需要验证CDN是否真正生效。

打开网站首页，查看网页源代码，搜索静态资源URL，应显示为https://cdn.example.com/wp-content/...。
使用Chrome开发者工具，在Network面板查看CSS、JS、图片请求的Response Headers，查看是否包含X-Cache: HIT、X-Cache: MISS、Via或Server字段。
使用curl -I https://cdn.example.com/wp-content/uploads/2024/01/example.jpg检查HTTP状态码与缓存头。
检查HTTPS证书是否匹配,浏览器地址栏应显示安全锁。
分别使用不同网络环境或在线测速工具测试访问速度，CDN命中后,响应时间应明显降低。