使用github+picGo搭建图床,保姆级教程来了。

>>强大,10k+点赞的 SpringBoot 后台管理系统竟然出了详细教程!

什么是图床?

顾名思义,图床就是图片睡觉的地方。

哈哈哈,开个玩笑,实际上图床是指存储图片的服务器。

为什么要使用图床呢?

因为图片也需要睡觉呀。【掩嘴笑~】。

实际上使用图床是为了方便图片的统一处理。

想象一下,当你写完一篇文章,而且文章有许多图片,这些图片都存储在电脑的硬盘上。

这时候想要把文章上传到公众号,或者是博客平台,那么不仅仅需要复制文字,还要在平台编辑器里一张一张地选择图片进行上传。

这样一来,不仅仅要耗费大量的时间传图片,还需要上传后检查图片顺序是否正确。

整个过程相当繁琐,特别地消耗精力。

如果还需要同步到多个平台进行发布更是让人头大。

来做一个简单的算法(算术题),一篇文章10张图片,需要上传至5个平台,那么总计需要上传50次。

我曾经的一篇讲解算法的文章,有20多张图片,当我把图片完全上传到博客之后,脑子里只有一个想法:我一定要搭建一个图床,我再也不想传第二遍了。

但是最后,我还是一张一张的把图片上传到了公众号后台,因为图床还没来得及搭建。

当我把图床做好后,图片上传的问题就简单了,只需要将文章复制、粘贴即可。

在写文章时将编辑器和图床联合在一起使用,放置图片的地方就全都变成了图片的链接地址。

并且存储在服务器上,也会存在电脑硬盘损坏,导致图片丢失的问题。

效果如图:

使用github+picGo搭建图床,保姆级教程来了。
image-20201215212319700

开始搭建

NO.1 配置github

首先你需要一个github账号,如果没有的话,先注册。访问github官网地址【github.com

注册过程省略,因为这是保姆都不管的事情。

友情提示:可能在注册过程中会出现 “Unable to verify your captcha response... ...”,一直不能正常注册。

网上有各种解决方案:换浏览器、换电脑... ...

笔者初次注册时,是在家用自己的笔记本和谷歌浏览器,注册一直不成功。次日用工作电脑+谷歌浏览器,注册成功。

1.创建一个新仓库,用于存放图片。

使用github+picGo搭建图床,保姆级教程来了。

填写仓库名称和描述,且仓库必须是public的,否则存储的图片不能正常访问。

使用github+picGo搭建图床,保姆级教程来了。

2.生成一个token,用于picGo访问github

使用github+picGo搭建图床,保姆级教程来了。

选择左侧菜单的Developer settings

使用github+picGo搭建图床,保姆级教程来了。

之后选择左侧Personal access tokens,再点击Generate new token

使用github+picGo搭建图床,保姆级教程来了。

填写Note,勾选repo.

使用github+picGo搭建图床,保姆级教程来了。

注意,生成的token只会在这里显示一次,所以记得单独保存下来哦。

使用github+picGo搭建图床,保姆级教程来了。

至此,Github的配置完成。

NO.2 下载picGo,并进行配置

1.下载

访问picGo下载地址【https://github.com/Molunerfinn/PicGo/releases】,选择 picGo-Setup-XXX.exe下载软件安装包即可。

由于下载过程较慢,甚至会出现下载失败的情况,所以我为大家提供了一个云盘下载资源。

为了方便维护,我把下载链接放在了公众号后台,关注我的公众号【猿月亮】,回复 “图床” 即可获得下载链接。

下载完成,双击启动安装即可。

如果安装成功,picGo不能正常使用,则可以用兼容模式启动。【此问题因电脑而异,也是我在配置过程中踩过的坑。】

使用github+picGo搭建图床,保姆级教程来了。

2.配置

仓库名:[github用户名]/[第一步新建的仓库名称]

分支:原来默认是master,但从2020.10.01开始,github的默认分支名变更为main

设定token:第一步创建的token

指定存储路径:可填可不填,如果填写了,图片就会存储在img文件夹下

设定自定义域名:https://cdn.jsdelivr.net/gh/[github用户名]/[仓库名]@main。

注意,此处的分支一定要填写@main,否则默认使用master分支。而现在github创建的默认分支名为main,如果不指定,则会出现图片不能上传的情况。【踩坑两小时】

使用github+picGo搭建图床,保姆级教程来了。

至此,github+picGo的配置完成,可以在上传区进行图片上传了。

补充几点

1.原本github的自定义域名应该是:https://raw.githubusercontent.com/[username]/[仓库名]

但是使用这种方式访问图片巨慢,所以教程中使用了jsdelivr作为cdn加速。改变域名即可,不需要任何其他配置。

2.配置完成,可能出现不能上传的情况,请大家耐心检查,也许某一步的配置出现了问题,就像检查bug一样耐心、细心。想象一下图床搭建成功后,写起文章来的丝滑感,是不是又有动力了?

3.不止可以用github作为图床,还可以使用国内的码云(gitee)。当然也有收费的七牛、阿里云等等。

安利一款MarkDown编辑器

使用MarkDown语法写文章,我使用的编辑器是typora,一款超级好用的编辑器。在一个编辑框内,编辑完成后,可以马上显示MarkDown语法效果。

举个栗子:

使用github+picGo搭建图床,保姆级教程来了。

并且typora可以和picGo联合在一起使用,当你在编辑器中插入、粘贴图片时,typora+picGo的组合方式,可以自动把图片上传至github保存。

1.下载安装

访问typora下载地址进行下载【https://www.typora.io/】,也可以在我的公众号【猿月亮】回复“图床”获取安装包。

下载完成后正常步骤安装即可。

2.配置

在typora顶部菜单界面,选择“文件” - > "偏好设置",设置图片存储方式。

使用github+picGo搭建图床,保姆级教程来了。

选择图片存储方式:上传图片。

上传服务:PicGo(app)

PicGo路径:picGo安装的地址

设置完成,点击“验证图片上传”,提示上传成功,即代表配置成功。

使用github+picGo搭建图床,保姆级教程来了。
image-20201216223858122

注意一点,typora图片验证中的端口,需要与picGo中的server设置内的端口一致,否则typora中不能正常上传。

picGo监听端口设置

选择“PicGo设置”-->"设置server"

使用github+picGo搭建图床,保姆级教程来了。

【此处有坑】如果监听端口不是36677,则需要修改为36677。否则会出现picGo能正常上传图片,而typora上传图片失败的情况。

使用github+picGo搭建图床,保姆级教程来了。

最后,在苹果电脑中可以使用typora+Ipic+github的方式,有兴趣的话可以自行尝试。

总结:github+picGo+typora他们三个是好基友。

分享到此结束,保姆也该撤了~

分隔线

任何美好的事情都值得分享,关于生活,关于工作(认真工作可以让生活更美好)。欢迎关注我的公众号【猿月亮】,回复“图床”即可获的picGo和typora的安装包。

使用github+picGo搭建图床,保姆级教程来了。


原文始发于微信公众号(猿月亮):使用github+picGo搭建图床,保姆级教程来了。