前言

看到好多人不会用GitHub+JsDeliver来加速自己的静态文件。遂决定水一篇,帮助一下还不会操作的小伙伴。

不建议使用GitHub当作图床!!!

正式开始

前期准备

  1. 一个Github账号
  2. 可以登录GitHub
  3. 懂得如何向GitHub仓库push文件

关于Github仓库可以新建,也可以使用<用户名>.github.io这个仓库。这里我就新建一个仓库为例。

  1. 建立仓库

    仓库名称与描述看自己心情写即可。但仓库一定要公开,不能是私有。

    image-20200528080046828

  2. 上传文件

    这里我将上传一张图片

    image-20200528080846385

    一张6m的图😄

  3. 使用JSD引用。

    这里我并未发布版本,但依然可以引用!(仓库水完这篇文章也就删了,因此不要试图访问这个链接哦!但是本文图片全用的这种方式。)

    image-20200528083046335

常见问题

上边的方式非常简单粗暴,几乎就是上传即可。但是这种方式存在几个问题。在这部分将解答疑惑。

JSD的链接是什么

JSD的链接是什么?

在我上图的链接为https://cdn.jsdelivr.net/gh/sviptzk/Jsd_test/79601805_p0.png,但这并不意味着JSD只有这一种引用方式。

  1. 直接引用

    这种方式也就是上边的方式,格式为:https://cdn.jsdelivr.net/gh/<用户名>/<仓库名>/<文件及路径>

    例如:https://cdn.jsdelivr.net/gh/blogimg/HexoStaticFile2/2020/05/28/911db4c3b95ed896b066b6e9aabae311.png代表用户名blogimg下的HexoStaticFlle2仓库中文件夹/2020/05/28/里的911db4c3b95ed896b066b6e9aabae311.png文件。

  2. 分支及版本号

    分支与版本号加到仓库后变,用@符链接。格式为:https://cdn.jsdelivr.net/gh/<用户名>/<仓库名>@[分支/版本号]/<文件及路径>

    分支名简述特点
    普通分支即GitHub的分支,可以创建多个。默认为master按分支引用,如同按分支开发
    latest最后一次提交代表最后一次的提交,即每上传一个新文件,都可以用这个分支引用到。也就是不加版本号的默认情况。
    版本号即指定版本的内容,需配合版本发布已发布的版本不会受到仓库内容变化的影响

如何按版本号引用

如何按版本号引用

使用版本号引用的优点在于:这个链接仅停留在发布版本号的时刻,无论仓库如何变化,这个版本号的文件都不会受到影响。同时可以避免JSD缓存问题。

  1. 发布版本

    image-20200528084631488

    image-20200528084647411

    image-20200528084720237

  2. 使用版本号引用

    刚刚发布的版本中只有一个图片,那么即使我在上传一张图片也是无法引用到的。

    例如我在向仓库push一张1.jpg,使用版本号方式引用。

    image-20200528085930130

    image-20200528085944413

关于缓存问题

关于缓存问题

这个问题向迷一样,根据我自己的实测不仅与分支有关系而且与文件名有关系。文件名为*.min.*或者是*.*,也就是带min的和不带min的。这里我以index.min.cssindex.css为例。

先来看看index.css

分支首次上传能否及时更新缓存天数
master可以被引用第一次push和第一次修改可以更新可能1天
latest可以被引用与master分支几乎一致可能1天
版本号发布版本后引用发布后及时更新每个版本独立

image-20200528091044063

image-20200528091150570

在来看看index.min.css

分支首次上传能否及时更新缓存天数
master可以被引用第一次push可以更新可能1天
latest可以被引用第一次push和第一次修改可以更新可能1天
版本号发布版本后引用发布后及时更新每个版本独立

image-20200528091907595

image-20200528092301901

因此总结下的使用方式就是:

  • 图床(不需要修改文件)

    使用latest分支或者master分支即可。

  • 静态文件仓库(经常改动文件)

    建议使用版本号方式

文件是否有限制

文件是否有限制?

  1. 先说说GitHub仓库

    GitHub公开仓库大小为100GB,是不是听起来很爽。并且可以创建无数个仓库哦!

    但是这100GB我们并不能全用完,甚至每个仓库不能超过1G。为什么?因为可能被封号。官方的解释是尽量不要传大文件,且仓库超过1G后会有人工审核仓库内容,如果发现用来做图床~~~😏。轻则删库,重则封号。因此为了安全建议在1G之前就换个仓库,反正可以创建无数个仓库嘛。

  2. 文件大小

    Github单文件上传为100M,但是JSD加速的单文件大小为50M。因此也就意味着单文件大小为50MB。

  3. 文件类型

    基本的图片视频静态文件应该都可以。

查看仓库文件

查看仓库文件

查看仓库文件有大小限制,因此当你的仓库文件大于50MB时,就无法通过JSD查看了,只能在GitHub仓库查看。

JSD的查看仓库文件有两种方式:

  1. 查看仓库的版本号

    格式:https://www.jsdelivr.com/package/gh/+ 用户名 +/+ 仓库名

    例如:https://www.jsdelivr.com/package/gh/sviptzk/HexoStaticFile

  2. 查看仓库文件

    格式 https://cdn.jsdelivr.net/gh/+ 用户名 +/+ 仓库名 +/ 仓库名[@分支]

    例如仓库名@master,默认为 master 分支https://cdn.jsdelivr.net/gh/sviptzk/sviptzk.github.io@master/

利用CloudFare

这个没有啥难度,因此只提供思路。

  1. 将GitHub仓库开启Pages服务,并绑定自己的域名

  2. 域名需要在CloudFare解析

  3. 接下来就可以用你的域名访问仓库文件了。

    例如:https://cdn.antmoe.com/1.jpg。代表访问仓库根目录下的1.jpg文件

    上边只是一个示例,不要试图访问哦!

其他问题

  1. 上传文件后如果不能立即访问到,那么稍等片刻即可。
  2. JSD最近很不稳定,遇到突然不能打开很正常。