如何利用 CDN - COS 大幅优化 Wordpress 站点
为什么没接入 CDN 的站点特别慢
如图所示，这是我们打开一个 Wordpress 站点页面的网络请求（Network），可以看到有大量的关于 JS，CSS，Image，Font 的 GET 请求。
这么多的网络请求，几百 KB 的数据，如果这些工作都交由我们的服务器去做，我们的站点不慢才怪。
为什么会出现这种情况呢？
这是因为 Wordpress 在得到终端的请求后，会返回给终端一个 HTML 页面，HTML 文件中包含了大量请求静态文件（Image、CSS）的链接，并且这些链接都指向我们的服务器。
CDN 能帮我们做什么
Wiki百科 中对 CDN 的定义：内容分发网络（英语：Content Delivery Network或Content Distribution Network，缩写：CDN），CDN 是一种通过互联网互相连接的网络系统，利用最靠近每位用户的服务器，更快、更可靠地将音乐、图片、视频、应用程序及其他文件发送给用户，来提供高性能、可扩展性及低成本的网络内容传递给用户。
说白了，我们可以利用 CDN 把 JS 等静态资源缓存起来。终端在获取 JS 等静态资源时，可以请求 CDN 服务器，减轻我们 Wordpress 服务器的压力。这种操作也叫做动静分离。
COS 有什么用
上面我们说到 CDN 会缓存我们的静态资源，那既然是缓存就会有两个问题：
- 缓存未命中怎么办
- 缓存过期怎么办
出现上面这种情况，当然要 rebuild cache ，这种行为叫做回源。
回源可以回我们的 Wordpress 服务器拿数据，但是这样无疑给我们的服务器造成压力，CDN 加速的效果大打折扣。
所以我们可以使用 对象存储（COS）作为回源目标地址。
如何接入 CDN - COS
因为我购买了 腾讯云的服务器，为了运维方便，我选择了腾讯云的 CDN 和 COS。
手机微信小程序可以直接查看 服务器，CDN，COS 的监控，我感觉还挺方便的。 大家也可以选择 七牛云对象存储 Kodo，七牛云CDN（七牛云是有免费额度的）。
创建 COS
COS 的基本操作单元叫做存储桶，这东西你可以看作是你的一块“云硬盘”，进入存储桶你会发现一个“类似磁盘”的目录结构。
在腾讯云控制台可以创建一个存储桶，其中最重要的选项是访问权限，一定要选择公有读私有写。至此，一个 COS 的存储桶就创建完毕了，一会儿创建 CDN 时就会用上这个存储桶。
初始化 COS
刚创建好的 COS 是没有任何文件的，我们要把需要 CDN 加速的静态资源上传到 COS。
Image 自动同步到 COS
推荐 Wordpress 插件：腾讯云COS，插件内的配置 API Key，空间名称，访问域名什么的，照着填就好，很EZ。
配置好之后，我们使用 Wordpress 后台上传图片就会自动同步到 COS，很方便。可以在这里检查文件的 URL 是否替换成了二级域名。
上传 JS、CSS
JS，CSS 等文件，就没得插件用了（各位朋友如果知道有相关插件的话，记得告诉我哈）。 我自己的实现方式：
- 首先将服务器的 WP-Content、WP-Includes 文件同步到本地
- 找到其中所有的JS，CSS 文件夹
- 按照目录结构，上传到 COS
一定要“按照目录结构”上传！！ 其他可能的实现方式：利用腾讯云的开放 API，写脚本上传
- 用 Linux find 命令找到所有 JS、CSS 文件
- 写个脚本，调用腾讯云 API 上传
最近没时间看腾讯云的文档，直接偷懒手动上传了hh
创建 CDN
添加域名
进入 CDN 控制台 -> 域名管理 -> 添加域名，就会出现这个页面：
这一步要特别注意：
- 加速域名不要与网站的域名相同，可以选择二级域名，比如我们网站的域名是 xxxx.com，此时可以用 CDN 加速 cloud.xxxx.com（cloud 只是一个二级域名的例子，也可以换成 www 等二级域名，当然前提是要配置好对应的 DNS）。
为什么这样搞呢？ 因为无法做到动静分离，我们肯定不希望 CDN 缓存动态文件，那样会导致网站完全静态，一切对网站的改动都要等缓存过期，重建缓存时才生效（比如新发帖子，访客评论）。 这时候重点来了，CDN 中没有动态文件，那么就要回源，回源到 COS 储存桶，问题是存储桶也仅仅只存储静态文件……网站就 G 了。 此刻要感谢腾讯云的技术客服，当时我在接入 CDN 的时候，把网站搞挂了，客服晚上10点多还在帮我 Debug，他告诉我一句话，我立刻就知道我的问题出在了哪里：“COS 业务域名和服务器域名要分开，各走各的，不要相互干扰”。 如果你想 CDN 加速服务器域名，也是可以的，但是一定要小心配置缓存，网络上有很多相关的问题，比如：
- 又拍云 CDN 如何设定 WordPress 评论不缓存规则
- 解决网站接入CDN后无法获取真实IP、WP Statistics的访问量统计不增加问题
- 腾讯云CDN开启中间源导致wordpress后台无法访问的最终解决办法
看着许多朋友遇到问题，真是心疼hh。
- 一定不要开启“私有存储桶访问”，这点很容易理解，不赘述。
配置CNAME
这一步腾讯云控制台可以自动配置，手动配置也很简单，就是把你的二级域名 DNS 解析记录改为 CNAME 类型，指向刚刚创建的 CDN 加速域名。
CDN 配置
这一步就简单了，各种功能看着开，比如：
- IP访问限频
- HTTP 2.0配置
- HSTS 配置
- OCSP 配置
- 流量封顶配置
接入 CDN
上文已经讲过，动静分离的核心原理就是：把终端对静态资源的请求转发到 CDN，也就是转发到我们的二级域名。现今大部分 Wordpress 缓存插件都支持接入 CDN，我这里用 WP Rocket 举例，WP Super Cache 同理：
验证
简简单单测个速，直接起飞好吧。
支付宝
微信