jsDeliver+Github托管整站静态资源，实现免费CDN

本文于 2022年1月11日 4:23 更新，注意查看最新内容

======2022年1月11日更新======

万万没有想到，两年前写的这篇教程，给两年后博客的更新带来了一点小麻烦。

当时因为考虑加载体验的问题，博客的静态资源很早就放在Github，通过jsDeliver来调用了。

但是后来很长时间不折腾博客，于是就忘了这回事，好几次修主题的小问题，都是直接更新的服务器内主题文件。

结果自然是每次都不成功，之前以为是代码逻辑问题，排查许久都没有个结果，现在才发现问题的方向压根不在代码上。

这次看博客的评论框，就想着把之前遗留的历史问题给解决一下（评论列表默认样式问题），加一行list-style: none就可以解决。

在控制台写的时候一点问题没有，放到style.css里就不生效，百度查找解决方案，说可能是.htaccess缓存和WP Super Cache插件的问题。

.htaccess缓存我应该是有，但是通过更改静态资源后面的版本号，我排除了这个问题。

然后就是WP Super Cache插件，这是一款WordPress的缓存插件，之前有使用过，但是后来就不用了（觉得不方便），自然也排除了这个问题。

百度几番查找和尝试都没有解决这个问题，但是在解决的过程中，我发现我使用的静态资源不在本地，这才想起静态资源托管到了Github。

于是开始在Github直接添加代码，但是同样的，添加之后，直接请求静态资源，发现并没有更新。

这时突然想联系当初发表这个教程的大佬，看看他知不知道这是什么问题（这个时候我觉得是缓存问题，但是不清楚缓存什么时候更新，也没想到可以手动更新），但是发现联系不上。

又想到当初是小易提供的信息，小易可能知道些什么，小易说让我自己搜索刷新缓存，这时我才意识到该去搜索jsDeliver如何刷新缓存，然后便找到了解决方案。

解决

1、将需要刷新的链接，如下：

https://cdn.jsdelivr.net/gh/wbfz89/lkblog/wp-content/themes/Akina-Siren/style.css?ver=2.0.5

改成 https://purge.jsdelivr.net/gh/wbfz89/lkblog/wp-content/themes/Akina-Siren/style.css 即可。

PS：不要携带任何参数，不然可能刷新不成功。

2、将修改后的链接重新请求，即可实时刷新。

刷新成功后，浏览器会返回缓存刷新成功的信息。

PS：重新请求网站时（非静态资源），记得使用Ctrl+F5强制清除缓存。

若发现还是没有更新，可以再次重新请求修改后的静态资源链接。

解决方案来源：《jsdelivr 缓存刷新》

style.css不生效参考方案：《WordPress 解决修改 style.css 不生效问题三步走！》

======2020年5月4日原文======

前言

在小易的推荐下，得知通过jsDeliver+Github能托管网站的静态资源，白嫖免费的CDN，最重要的是jsDeliver在国内有相关节点，速度有保障。

简述

jsDeliver

jsDelivr是一个免费开源的CDN解决方案，用于帮助开发者和站长。

包含 JavaScript 库、jQuery 插件、CSS 框架、字体等等 Web 上常用的静态资源。

GitHub

GitHub是一个面向开源及私有软件项目的托管平台，因为只支持git作为唯一的版本库格式进行托管，故名GitHub。

准备

注册GitHub账号

https://github.com/join

安装Git程序

https://git-scm.com/downloads

国内镜像：

https://npm.taobao.org/mirrors/git-for-windows（淘宝镜像）

https://gitee.com/mirrors （码云镜像）

下载站：https://pc.qq.com/detail/13/detail_22693.html（腾讯软件）

操作

1. 新建github仓库并clone至本地

$ git clone 你的仓库链接 #本地克隆github仓库

2. 将需要的静态资源放到本地git仓库中，并提交到github仓库

$ git add . #添加到库中

$ git commit -m "update" #提交更新（update为自定义信息说明）

$ git push #推送到远程仓库

3. 在GitHub仓库中点击release发布(版本号可以自定义)

这里就不上图了，节省流量，以前一直没发布过，当时还找了一下，如果实在没看到，Ctrl+F5了解一下。

4. 通过jsDeliver引用资源

$ https://cdn.jsdelivr.net/gh/你的用户名/你的仓库名@发布的版本号/文件路径

#栗子：

$ https://cdn.jsdelivr.net/gh/Fofade/cnblogsThemes@1.0/live2dw/assets/z16.model.json #加载1.0版本

#注意： 如果不加@发布的版本号默认加载最新版本