PicGo+GitHub快速实现markdown图床

前言

• 之前使用了很多在线博客的编辑器都觉得很坑不顺手，我还是比较喜欢用 Typora 来写一些东西

• Tpyora 是一款优雅的 MarkDown 编辑器，也推荐给大家，至于安装和配置，也十分的简单，就和安装普通的应用程序一样。

• 在编写文档和记笔记的时候，都需要插入很多图片，通常情况下这些图片（截图）都是保存在本地的，当你分享文档或者你在本地编写的文档放到在线博客的时候就会出现图片丢失的问题，不然就得一张一张全部复制，体验极差，所以我想找一个图床来托管我的图片。

  图床简单来说就是一个便于在博文中插入在线图片连接的个人图片仓库。设置图床之后，在自己博客中插入的图片链接就可以随时随地在线预览了，并且不会因为任何意外原因无法查看，除非自己亲自删除。

  图床工具：

  所谓图床工具，就是自动把本地图片转换成链接的一款工具，网络上有很多图床工具，就目前使用种类而言，PicGo 算得上一款比较优秀的图床工具。它是一款用 Electron-vue 开发的软件，可以支持微博，七牛云，腾讯云 COS，又拍云，GitHub，阿里云 OSS，SM.MS，imgur 等 8 种常用图床，功能强大，简单易用。这里我们使用 PicGo。

• 我看大多数推荐的七牛云，腾讯云，微博等等，一方面需要各种注册收费，另一方面十分不稳定，既然是程序员，大家都会有自己的 GitHub 仓库，不如专门开一个仓库做自己的图床好了，既方便又简单。

  准备工作

  环境：

  ​ 当然我还是在 windows 环境下来进行安装。如果你要使用 PicGo 的插件，还需要电脑安装 node 环境，因为 PicGo 的插件是用 npm 包管理工具进行安装的。

  下载软件并安装

  • Typora：你可以点击 这里 进行下载。

  • PIcGo：你可以点击 这里 进行下载。

  • 注： mac 系统选择 dmg 下载， windwos 系统选择 .exe 下载

  GitHub 配置

  • 如果你嫌弃 GitHub 访问速度太慢的话，也可以用同样的方法布置到 Gitee 码云，不过我个人使用 GitHub 更多一点，所以我直接部署到了 GitHub。

  新建仓库

  我们可以新建一个仓库或者使用已经有的库也可以。那么我新建一个库叫做 picgo。

  创建 Token

  创建好后，需要在 GitHub 上生成一个 token 以便 PicGo 来操作我们的仓库，来到个人中心，选择 Developer settings 就能看到 Personal access tokens_，我们在这里创建需要的 _token

  点击 Generate new token 创建一个新 token，选择 repo，同时它会把包含其中的都会勾选上，我们勾选这些就可以了。然后拉到最下方点击绿色按钮，Generate token 即可。之后就会生成一个 token ，记得复制保存到其他地方，这个 token 只显示一次！

  配置 PicGo

  配置默认图床

  • 仓库名格式为 用户名/仓库名
  • 分支名：master
  • token：刚刚在 GitHub 创建的 token

  然后点击确定，设为默认图床。

  检查配置信息

  • 先看一下 Typora 的端口号
  • 打开 PicGo 设置，选择设置 Server，打开开关，并设置监听地址和端口与上面保持一致
  • 打开配置文件，找到 server，保持一致。

  建议和一些其他事项

  建议打开设置里的按照时间戳重命名，防止图片名字重复可能导致的一些失败。顺便提供一些常见错误的解决办法。

  错误：Failed to fetch

  

  这个错误一般是由 端口设置错误 造成的，打开 picgo 的 log 文件

  解决办法 ：打开 picgo 设置，点击设置代理选项， 将端口改为 36677 端口 ，这是 picgo 推荐的默认端口号，然后保存，成功。

  不过有的时候，设置好了后还是会报错 Failed to fetch，打开端口设置一看，端口变成了 366771，这是因为如果你打开了多个 picgo 程序，就会端口冲突， picgo 自动帮你把 36677 端口改为 366771 端口 ，导致错误。log 文件里也写得很清楚。

  解决办法 ： 先把 picgo 中的端口设置改回 36677，然后退出所有 picgo 程序 ，再使用 typora 上传功能（会自动启动 picgo 程序）

  错误：{“success”,false}

  

  这个错误是最常遇到的，第一个原因是 文件名冲突 了，如果你上传过一张 image1.jpg 的图片，再上传名称一样的图片就会失败。

  解决办法 ：打开 picgo 设置，将 上传前重命名和时间戳重命名都打开 。如图所示：

  再次上传文件，出现一个确认文件名称的对话框（暂时没有找到默认确定的选项），点击确定，上传成功。

  第二个原因，可能就是网络问题，显示服务端错误，这种情况下，可以更换默认图床，或者稍后再试。

  解决办法 ：更换默认图床或者多试几次，我经常遇到这种情况，在 github 上传失败的时候，我就把默认图床更改为 Gitee 上传到码云。

  一些使用方法

  上传

  把需要的图片拉进去，这里有三种上传图片的方式：

  • menubar 图标拖拽上传（仅支持 macOS）
  • 主窗口拖拽或者选择图片上传
  • 剪贴板图片（最常见的是截图）上传（支持自定义快捷键）

  上传完成之后，我们到相册就会看到上传成功后的照片了，另外在自己的仓库里，也能够看到上传的图片

  与此同时，除了单张上传外，其实还支持多张，批量上传，只需要选中多个文件，将其导入，或者拖入其中便可以了，这样再多的文件，也能够做到一次上传就能用的效果。

  • 上传照片前，我们想重新命名这个图片名称，或者是在上传之后我们需要给图片重新命名，打开上传前重命名即可。
  • 查看当前上传的图床

  如果你设置了除 GitHub 以外的图床，而不清楚当前上传到了哪个图床时，没关系，在上传区能够看到这个图床是哪一个。