Github免费CDN：jsDelivr

date

Oct 3, 2021

slug

kidaehjt

status

Published

jsDelivr

官网介绍（

jsDelivr is the only public CDN with a valid ICP license issued by the Chinese government, and hundreds of locations directly in Mainland China. jsDelivr 是在中国大陆唯一有 license 的公有 CDN，并且有数以千计的直连地区。

引用方式

公开资源

jsDelivr 提供 Npm、Github、Wordpress 的所有资源，所以对于前端开发常用的 Npm 公开包的引用可以直接从 jsDelivr，直接在官网搜索即可。

jsDelivr 提供的公开 Npm 包引用规则：

// load any project hosted on npm
https://cdn.jsdelivr.net/npm/package@version/file

// load jQuery v3.2.1
https://cdn.jsdelivr.net/npm/jquery@3.2.1/dist/jquery.min.js

// use a version range instead of a specific version
https://cdn.jsdelivr.net/npm/jquery@3.2/dist/jquery.min.js
https://cdn.jsdelivr.net/npm/jquery@3/dist/jquery.min.js


// omit the version completely to get the latest one
// you should NOT use this in production
https://cdn.jsdelivr.net/npm/jquery/dist/jquery.min.js

// add ".min" to any JS/CSS file to get a minified version
// if one doesn't exist, we'll generate it for you
https://cdn.jsdelivr.net/npm/jquery@3.2.1/src/core.min.js

// omit the file path to get the default file
https://cdn.jsdelivr.net/npm/jquery@3.2

// add / at the end to get a directory listing
https://cdn.jsdelivr.net/npm/jquery/

以 jQuery 为例，贴上使用教程

个人资源

jsDelivr 提供的公开 Github 仓库文件引用规则：

// load any GitHub release, commit, or branch
// note: we recommend using npm for projects that support it
https://cdn.jsdelivr.net/gh/user/repo@version/file

// load jQuery v3.2.1
https://cdn.jsdelivr.net/gh/jquery/jquery@3.2.1/dist/jquery.min.js

// use a version range instead of a specific version
https://cdn.jsdelivr.net/gh/jquery/jquery@3.2/dist/jquery.min.js
https://cdn.jsdelivr.net/gh/jquery/jquery@3/dist/jquery.min.js

// omit the version completely to get the latest one
// you should NOT use this in production
https://cdn.jsdelivr.net/gh/jquery/jquery/dist/jquery.min.js

// add ".min" to any JS/CSS file to get a minified version
// if one doesn't exist, we'll generate it for you
https://cdn.jsdelivr.net/gh/jquery/jquery@3.2.1/src/core.min.js

// add / at the end to get a directory listing
https://cdn.jsdelivr.net/gh/jquery/jquery/

以我的Github 图床中为例

仓库名称填写oss，选择Public类型，不能是私有的。通过本地 Git 仓库、第三方图床（推荐uPic）工具上传图片到 Github 上，贴出两种 URL 和实际效果：

原始 URL（Github 版本）：https://github.com/stelalae/oss/blob/master/files/2021/10/03/OVRzwP.png

新 URL（CDN 版本）：https://cdn.jsdelivr.net/gh/stelalae/oss@master/files/2021/10/03/OVRzwP.png

原始 URL（Github 版本），图片不会显示

新 URL（CDN 版本），图片正常显示

简单来说，CDN 版本的规则是：

https://cdn.jsdelivr.net/gh/<用户名>/<仓库名>/<文件及路径>

另外也支持分支及版本（Tag）号的引用，规则是：

https://cdn.jsdelivr.net/gh/<用户名>/<仓库名>@[分支/版本号]/<文件及路径>

缓存问题

CDN 缓存是个谜，包括我在国内使用收费 CDN，所以我的通用做法是带上 hash 值，反正存储费用也是超级低（Github 是免费的）。大家可以看看这两篇关于 jsdelivr 的缓存：

解决 jsdelivr 缓存问题的几个办法

使用 JsDeliver CDN 加速 Github 文件

总结规避缓存的方式：

图床（或不需要修改文件，或有 hash 值的文件），可以直接使用latest 分支或者 master 分支即可

静态文件仓库，或经常需要改动的文件，建议使用版本号方式

使用 purge 进行刷新（有第三方工具）

切换其他收费云

文件&仓库的限制问题

官方解释

Packages larger than 50 MB or single files larger than 20 MB (in case of GitHub) are not supported by default. We recommend removing files that are not needed from your package when possible. If you need to set a higher limit for your package, open an issue in this repo. 默认情况下，不支持大于 50MB 的包或大于 20MB 的单个文件（对于 GitHub）。我们建议尽可能从包中删除不需要的文件。

所以最佳实践是：