图床创建

博客图片也是折磨了我好长一段时间了，今天终于使用 Github+PicGo+jsdelivr 把图床搞起来了

参考教程：杰克小麻雀CSDN博客

新建 Github 图床仓库

首先需要找一个地方存储图片。阿里云、腾讯云等其实都可以，要钱；有道云笔记其实也不错，但有大小限制且不能保证稳定性。Github 则是一个较好的选择，我们可以建一个公开的仓库存储图片，缺点是图床公开，没有私密性，不能大摇大摆的上传色图

1. 新建Github仓库

   在Github上创建一个仓库，设置为Public

   

2. 获取 repo tokens

   在自己头像处选择setting_{不是仓库的setting}

   

   选择Developer settings，生成新 Token 并记录

   

PicGo 配置

其实到上述为止我们已经可以直接将 Github 仓库当作图床使用。但是比较麻烦且影响效率_{U1S1其实在网页端直接把图片拖进去还行}。因此我们使用 PicGo 工具，这样拖进去图片之后可以直接返回链接。

1. 下载安装PicGo

2. 选择图床设置 > Github

   

   仓库名为上述 Github 建立的仓库，格式为 ```用户名/仓库名``

   分支名所在分支，一般为 main 或者 master

   Token 即上述记录Token

   存储路径可以自定义存储哪个文件夹下，不填则默认存储于根目录_{我个人喜欢根据图片所用博客命名文件夹}

   自定义域名和下述 CDN 配置有关

3. 点击 设为默认仓库，并点击 确定

4. 点击上传区，便可以上传图片

   

   上传成功的图片即在相册中

   

   同时也可以在 Github 上看到

   

   注意：

   1. 相同路径下不可上传同名文件_{所以我偏好不同博客使用不同存储路径}

   2. 有时候可能上传之后，在相册无法显示，但是 Github 上可以看见对应文件

      

      此时在 Typora 中无法加载图片，但是在博客中图片不受影响

      猜测可能是软件上传图片存在的 Bug，重新打开 Typora 即可

CDN 加速

上述已经实现了图床服务存储在 raw.githubusercontent.com 网址下，加载较慢甚至加载失败，因此需要对图片进行 CDN 加速。

jsDelivr 支持 npm、GitHub、WordPress三个站点的加速，开源免费且在中国大陆建有许多服务站点，官网还声称是中国大陆唯一拥有许可证的公有 CDN，可以相信其稳定性。_{我之所以迟迟不用图床即担心其稳定性}

在浏览器输入https://cdn.jsdelivr.net/gh/用户名/仓库名/_{仓库名后的 \ 不可省略}，即可查看jsDelivr 缓存的我们的 Github 文件列表

将图片由 https://raw.githubusercontent.com/用户名/仓库名/分支名/目录/图片名.png 更改为 https://cdn.jsdelivr.net/gh/用户名/仓库名@分支名/目录/图片名.png即可

注意：

jsdelivr 进行缓存有一段时间延迟，因此图片无法很快进行使用

Typora 配置

但是对于每一张图都要走一遍流程还是麻烦了，还是没有直接拖进 Typora 里舒服

1. 选择 Typora 文件 > 偏好设置 > 图像
2. 选择插入图片时：上传图片
3. 勾选对本地位置的图片应用上述规则、对网络位置的图片应用上述规则、优先使用相对路径
4. 上传服务 选择 PicGo（app）