使用七牛CDN加载宝塔静态文件

in Shares

前言

原来的服务器使用的是阿里云国际HK的30M ECS
最近价格升了,空空的钱包表示买不起买不起
刚好发现可以试用1M的同样在HK的ECS
反正也就放个博客,于是转到了这个1M的新机器
照例懒人搞法新机器也装上宝塔
进宝塔后台的时候就发现1M这个带宽是真的膈应人
连静态文件都半天加载不出来
去宝塔论坛上逛了逛发现已经有人开发了替换静态文件使用CDN的插件
但是使用的CDN是作者自己的,这样的奉献精神让人敬佩,但不是自己的CDN始终不安心
万一突然挂了多麻烦,琢磨了一下有了下面这坨东西

宝塔静态文件备份

宝塔默认的静态文件路径为/www/server/panel/BTPanel/static
下载下来然后用同步工具上传到七牛空间
推荐使用QSunSync进行同步,可以保留目录结构,非常方便
后续调整的话可以使用另一款工具KODO Browser进行资源管理
得到的自己的CDN静态目录应该为https://cdn.example.com/static

宝塔模板文件替换

宝塔默认的template文件路径为/www/server/panel/BTPanel/templates/default
打包下载顺便记得备个份,然后使用支持正则表达式替换的编辑器进行批量替换
这里以VS Code为例打开default文件夹
(?<='|".|")/static(?=/)替换为https://cdn.example.com/static
以版本7.1.0为例这个文件夹内应该有74个可替换处(但是后面替换时依旧需要自己好好检查)
VS Code非常贴心的给出了替换后的效果方便检查

覆盖模板文件夹

这里使用WinSCP进行替换,然后回到面板后台重启面板即可看到效果

补充

在使用VS Code之前尝试过使用Notepad++替换结果发现它一直不能识别上面正则表达式零宽断言用法,懒得探究了就直接上VS Code好了
(?<='|".|")/static(?=/)这个正则匹配位置如果不明白的话
建议去花点时间看看正则表达式(链接走起->正则表达式30分钟入门教程)

感谢

感谢宝塔面板静态加速作者提供的灵感
没有这个插件的话大概率要花更多的时间去寻找解决办法
插件链接->宝塔面板静态加速
也可以直接在宝塔后台软件商店下载安装