可以通过域名访问之后就开始注意网页的访问质量了,然后就受不了火山引擎这个 1M 的带宽了,所以决定配置一个 CDN 来为图片、css 等静态资源加速,然后记录一下配置过程。
在开始之前先特别鸣谢一下 Frex 大佬,直接为我提供了自动化证书和 CDN 源。
据介绍,由于 CDN 解析的解析对象是一个 CNAME ,所以不能使用 caddy 的自动证书管理,需要在 Caddyfile 中自定义证书文件。于是我的 Caddyfile 变成了这样:
blog.gomkiri.top {
tls /var/www/ssl/certbundle.pem /var/www/ssl/privkey.pem
reverse_proxy localhost:3307
}
cdn-wp.gomkiri.top {
tls /var/www/ssl/certbundle.pem /var/www/ssl/privkey.pem
handle_path /wp-content/* {
file_server {
root /root/blog/wordpress/wp-content
}
encode gzip
}
handle_path /wp-includes/* {
file_server {
root /root/blog/wordpress/wp-includes
}
encode gzip
}
handle {
respond "Not Found" 404
}
}Plaintext其中的 tls 就是自定义证书文件的位置,而cdn-wp.gomkiri.top是CDN解析的地址。
然后为cdn-wp.gomkiri.top添加 CDN 服务商执行 CNAME 解析,完成 CDN 配置。
最后回到 WP 的后台管理,下载一个叫做 CDN Enabler 的插件并完成简单的配置就算完成了。
吗?当我不小心打开登录页面后,发现并没有加载 css 样式,进入开发者模式查看,发现是 wordpress/wp_admin 这个路径下的请求也走了 CDN,但是我们压根没有给他配代理(也不想让他走 CDN),随后我在 CDN Enabler 的配置页看到了一栏叫做 CDN 排除,将 wp_admin 加入其中后,问题解决。
本来到这里就可以了,但是我实际去访问博客却发现有些图片资源依然没有走 CDN,这很大概率是我博客主题相关的问题,但是我还是要记录一下整个过程和如何解决的。
首先我在博客中找到了一个图片CDN地址的选项

配置完成后发现加载依然很慢,去开发者模式查看,发现浏览器先报了两次 CORS 错误才完成请求,原来是发生了跨域问题,回到 Caddyfile ,添加了下面部分
cdn-wp.gomkiri.top {
header {
Access-Control-Allow-Origin *
Access-Control-Allow-Methods "GET, OPTIONS"
Access-Control-Allow-Headers *
}
}Plaintext并在 CDN 服务商添加相关权限,问题成功得到了解决!1M的带宽也不会非常影响访问体验了!
Comments NOTHING