vuepress-theme-vdoing/docs/03.技术/04.博客搭建/03.GitHub + jsDelivr + Tiny...

66 lines
3.0 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

---
title: GitHub + jsDelivr + TinyPNG+ PicGo 打造稳定快速、高效免费图床
date: 2020-01-03 12:55:43
permalink: /pages/a5f73af5185fdf0a
categories:
- 技术
- 博客搭建
tags:
- null
author:
name: xugaoyi
link: https://github.com/xugaoyi
---
# GitHub + jsDelivr + TinyPNG+ PicGo 打造稳定快速、高效免费图床
## 前言
**Q为什么要使用图床呢什么是图床**
A写博客文章时图片的上传和存放是一个问题有的朋友可能会把图片放到和博客同一个仓库当中使用相对路径来引用这样后期维护起来会比较麻烦。还有的朋友会在不同的平台发布同一篇文章这样一来每个平台都要上传图片为了解决这些问题比较推荐的做法是把图片统一上传到一个在线的第三方静态资源库中我们把这个资源库称为图床其返回一个图片的URL使用`markdown+图片url`的方式写作文章,一次编写,到处使用~
<!-- more -->
::: warning 更好的选择...
以下内容是比较旧的,现在我发现一个更好用,配置更方便的图床工具:<https://picx.xpoet.cn/>
使用方法看一下他网站的使用教程就行。 撒由那拉~~
::: right
2021.07.04
:::
**Q图床的选择**
A推荐使用GitHub作为图床特点是免费、稳定有一个小缺点是国内访问速度慢不过没关系可以使用`jsDelivr`免费CDN加速。
**QjsDelivr是什么**
A`jsDelivr`是国外的一家优秀的公共 CDN 服务提供商该平台是首个「打通中国大陆与海外的免费CDN服务」无须担心中国防火墙问题而影响使用。官网<http://www.jsdelivr.com/>
## 图床打造
1. 新建GitHub仓库注意仓库要设置成**公开**
2. 参照 [官方文档](https://help.github.com/en/github/authenticating-to-github/creating-a-personal-access-token-for-the-command-line) 生成一个token密钥
3. 在 [这里](https://github.com/Molunerfinn/picgo/releases) 下载PicGo安装完成后打开`图床设置` 选 `GitHub图床`,并填写相应的信息
* 仓库名:前面新建的仓库,格式:`<用户名>/<仓库名>`
* 分支名:填写主分支`master`即可
* Token前面生成的token密钥
* 存储路径:按你自己的需求填写
* 自定义域名图片上传后PicGo 会按照 `自定义域名+上传的图片名` 的方式生成访问链接,此处我们填写`jsDelivr`的CDN加速地址格式`https://cdn.staticaly.com/gh/<用户名>/<仓库名>`
![](https://cdn.staticaly.com/gh/xugaoyi/image_store/blog/20200103105720.png)
4. 使用<https://tinypng.cn/>压缩你要上传的图片(如图片已经很小或你有更好的压缩工具可省略这一步)
5. 在PigGo的`上传区`上传你的图片,到`相册`一键复制刚刚上传的图片URL至此你就可以在你的文章当中愉快的插入图片啦~ 更多功能自己去探索吧~~
![](https://cdn.staticaly.com/gh/xugaoyi/image_store/blog/20200103121148.png)