### 彪哥

爱好前端

- 技术文档

- GitHub技巧

- Nodejs

- 博客搭建

  - 解决百度无法收录搭建在GitHub上的个人博客的问题
  - 使用Gitalk实现静态博客无后台评论系统
  - GitHub + jsDelivr + TinyPNG+ PicGo 打造稳定快速、高效免费图床
    - 前言
    - 图床打造
  - vdoing主题效果图

- 技术
- 博客搭建

heBody
2020-01-03
目录

# GitHub + jsDelivr + TinyPNG+ PicGo 打造稳定快速、高效免费图床

# # GitHub + jsDelivr + TinyPNG+ PicGo 打造稳定快速、高效免费图床

## # 前言

Q：为什么要使用图床呢？什么是图床？

A：写博客文章时，图片的上传和存放是一个问题，有的朋友可能会把图片放到和博客同一个仓库当中，使用相对路径来引用，这样后期维护起来会比较麻烦。还有的朋友会在不同的平台发布同一篇文章，这样一来每个平台都要上传图片，为了解决这些问题，比较推荐的做法是把图片统一上传到一个在线的第三方静态资源库中，我们把这个资源库称为图床，其返回一个图片的URL，使用`markdown+图片url`的方式写作文章，一次编写，到处使用~

更好的选择...

以下内容是比较旧的，现在我发现一个更好用，配置更方便的图床工具：https://picx.xpoet.cn/
(opens new window) 使用方法看一下他网站的使用教程就行。 撒由那拉~~

2021.07.04

Q：图床的选择

A：推荐使用GitHub作为图床，特点是免费、稳定，有一个小缺点是国内访问速度慢，不过没关系，可以使用`jsDelivr`免费CDN加速。

Q：jsDelivr是什么？

A：`jsDelivr`是国外的一家优秀的公共 CDN 服务提供商，该平台是首个「打通中国大陆与海外的免费CDN服务」，无须担心中国防火墙问题而影响使用。官网：http://www.jsdelivr.com/
(opens new window)

## # 图床打造

1. 新建GitHub仓库，注意仓库要设置成公开

2. 参照 官方文档
   (opens new window) 生成一个token密钥

3. 在 这里
   (opens new window) 下载PicGo，安装完成后打开，`图床设置` 选 `GitHub图床`，并填写相应的信息

   - 仓库名：前面新建的仓库，格式：`<用户名>/<仓库名>`
   - 分支名：填写主分支`master`即可
   - Token：前面生成的token密钥
   - 存储路径：按你自己的需求填写
   - 自定义域名：图片上传后，PicGo 会按照 `自定义域名+上传的图片名` 的方式生成访问链接，此处我们填写`jsDelivr`的CDN加速地址，格式：`https://cdn.jsdelivr.net/gh/<用户名>/<仓库名>`

4. 使用https://tinypng.cn/
   (opens new window)压缩你要上传的图片（如图片已经很小或你有更好的压缩工具可省略这一步）
5. 在PigGo的`上传区`上传你的图片，到`相册`一键复制刚刚上传的图片URL，至此，你就可以在你的文章当中愉快的插入图片啦~， 更多功能自己去探索吧~~

编辑
(opens new window)
上次更新: 2022/12/14, 19:36:42
使用Gitalk实现静态博客无后台评论系统
vdoing主题效果图

← 使用Gitalk实现静态博客无后台评论系统 vdoing主题效果图→

最近更新

  01
Git修改分支名
08-11

  02
CSS给table的tbody添加滚动条
06-29

  03
我做了一个手写春联小网页，祝大家虎年暴富 原创
01-28

更多文章>

Copyright © 2016-2022 Hesb | MIT License

- 跟随系统
- 浅色模式
- 深色模式
- 阅读模式