Before
Q:什么是图床?为什么要使用图床呢?
A:撰写在线文章时,图片是文章表达中不可或缺的一部分。其中图片的上传和存放就是一个大问题。
有些朋友可能会把图片放到和博客同一个仓库当中,使用相对路径来引用(我以前也是这样使用的),这样后期维护起来会比较麻烦——因为这样一篇文章如果放到其他环境中图片就会由于相对路径而无法正常展示,没有什么比一个裂掉的图还让人感觉难受了。
有的朋友会在不同的平台发布同一篇文章,例如简书,csdn,b站等,这样一来每个平台都要上传图片,为了解决这些问题,比较推荐的做法是把图片统一上传到一个在线的第三方静态资源库中,这个静态资源库就是图床,其返回一个图片的URL,这样在文章中插入在线引用即可展示图片,一次书写,多处使用。
一般在商业项目中使用cdn加速,加速内容包括但不限于各种静态资源,有的需要分布式缓存等,但是考虑到个人的使用,没必要如此,使用markdown+image url的方式写作文章用公开github仓库和免费cdn加速即可。
Q:图床的选择
A:推荐使用GitHub作为图床,特点是免费、稳定,有一个缺点是国内访问速度慢,不过可以使用jsDelivr免费CDN加速。
Q:jsDelivr是什么?
A:jsDelivrA free CDN for Open Source,fast, reliable, and automated.
其是国外的一家优秀的公共 CDN 服务提供商,该平台是首个「打通中国大陆与海外的免费CDN服务」,无须担心中国防火墙问题而影响使用。

图床打造
登录github新建一个自己图床公开GitHub仓库
生成一个GitHub token密钥
- 进入Settings > Developer settings > Personal access tokens
- 点击Generate new token
- 默认只需要repo权限即可,点击Generate token后获取到token,注意:此处的明文token只显示一次,刷新页面就会再也看不到,请及时复制保存或截图保存
在这里
下载PicGo,安装完成后打开,图床设置选GitHub图床,并填写相应的信息。官方文档- 仓库名:前面新建的仓库,格式:
<用户名>/<仓库名> - 分支名:填写主分支
master即可 - Token:第2步生成的token密钥
- 存储路径:图片在仓库中的路径,例如img/
- 自定义域名:图片上传后,PicGo 会按照
自定义域名+上传的图片名的方式生成访问链接,此处我们填写jsDelivr的CDN加速地址,jsdelivr其提供的格式为:https://cdn.jsdelivr.net/gh/user/repo@version/file,https://cdn.jsdelivr.net/gh/<用户名>/<仓库名>@<版本>/文件名
- 仓库名:前面新建的仓库,格式:

压缩上传的在线图片,保证传输速度(图片已很小可省略这一步)
在PigGo的
上传区上传你的图片,到相册一键复制刚刚上传的图片URL,至此,你就可以在你的文章当中愉快的插入图片了。