如何让Typora自动上传图片到指定图床

如何让Typora上传图片到指定图床

一、先看效果

我们发现复制到Typora的图片先由本地地址经过Uploading自动变成网络图片地址，这个网络地址根目录就叫做图床。

二、为什么要使用图床

在我们使用Typora编写Markdown文档时，可以设置本地相对路径自动上传到本地，就像这样：

看起来也很方便，不过在有些方面是无法和图床相比的，比如：

• 文档编写要关注文档本身，使用网络图片可以减少文档整体大小，而且不会因为忘记拷贝图片文件夹导致图片无法加载。
• 如果文档作为项目的一部分，整个项目结构怎么管理都不好，一段url就能搞定多好啊。
• 可重复利用。

三、Typora如何实现自动上传图片

3.1 准备工作

点击Typora工具栏，格式=》图像=》全局图像设置，我们发现如下图：

插入图片时栏目有上传图片选项，上传服务设定栏目有三种方式可供选择，凭直觉我选**PicGO-Core(command line)**，因为它肯定比APP更好用，因为轻量且干净。

点击下载或更新按钮，会发现正在安装PicGO-Core。

下载安装过程中可能会卡住，关掉Typora再试一次就会好。

安装好后，Windows系统会出现这个C:\Users\{username}\AppData\Roaming\Typora\picgo\win64\picgo.exe可执行程序。同时点一下打开配置文件，我们可以定位到C:\Users\{username}\.picgo这个隐藏目录，里面的config.json就是上传服务设定的配置文件。

它应该是这样的：

{
  "picBed": {
    "current": ""
  },
  "picgoPlugins": {
  }
}

显然这个就是让我们配置图床信息和picgo插件的地方，还提供了验证图片上传选项功能让我们进行配置验证。

得出以下几步：

1. 配置自己需要的图床信息。

2. 可能需要安装picgo插件。

3. 配置好之后进行验证图片上传选项按钮验证。

4. 实际操作一番，就像我的动图一样。

3.2 理解PicGo

我们很轻易就能找到PicGo官方文档。从文档中我们发现配置文件的picBed支持很多图床，默认是smms，只需要登录smms获取token，设置一个属性就可以了。

{
  "token": "" // 注册后获取的 api token
}

还支持七牛、又拍云、腾讯云、GitHub、阿里云、自定义代理很多种图床，但是没有我想要的，我想用minio。

在网站picgoPlugins和picgo-plugin-*条目上告诉我们PicGo是支持第三方插件的，那么我们需要找到picgo-plugin-minio。

3.3 安装picgo-plugin-minio

C:\Users\{username}\AppData\Roaming\Typora\picgo\win64\picgo.exe install picgo-plugin-minio 

注意：需要在上面提到的config.json目录C:\Users\{username}\.picgo中执行，不然后面.\picgo.exe set uploader无法选择minio。

2023年3月1日笔者再次使用时发现，以上命令报错会报错：

C:\Users\fusionshen\.picgo>C:\Users\fusionshen\AppData\Roaming\Typora\picgo\win64\picgo.exe install picgo-plugin-minio
npm ERR! code E404
npm ERR! 404 Not Found - GET https://registry.npmjs.org/picgo-plugin-picgo-plugin-minio - Not found
npm ERR! 404
npm ERR! 404  'picgo-plugin-picgo-plugin-minio@*' is not in this registry.
npm ERR! 404 You should bug the author to publish it (or use the name yourself!)
npm ERR! 404
npm ERR! 404 Note that you can also install from a
npm ERR! 404 tarball, folder, http url, or git url.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\fusionshen\AppData\Local\npm-cache\_logs\2023-03-01T02_39_55_325Z-debug-0.log
(node:9132) UnhandledPromiseRejectionWarning: #<Object>
(node:9132) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1)
(node:9132) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

可以换一种思路：在C:\Users\{username}\.picgo中执行npm install picgo-plugin-minio，然后依次执行下面配置，即可正常。

这种方式需要本机安装过NodeJS，如果没有，推荐使用nvm安装NodeJS。Windows安装nvm执行文件时两个目录都不要带空格。

3.4 配置minio

PS C:\WINDOWS\system32> cd C:\Users\{username}\AppData\Roaming\Typora\picgo\win64\
PS C:\Users\{username}\AppData\Roaming\Typora\picgo\win64> .\picgo.exe set uploader
? Choose a(n) uploader
  imgur
  aliyun
  upyun
> minio
  smms
  tcyun
  github
(Move up and down to reveal more choices)

选择minio依次填入相关选项，当然你也可以手动维护C:\Users\{username}\.picgo\config.json，这个命令可以给我们提供配置文件模板，最后你的config.json应该是这样的：

{
  "picBed": {
    "current": "minio",
    "minio": {
      "endPoint": "oss.website.com",
      "port": "",
      "useSSL": true,
      "accessKey": "username",
      "secretKey": "password",
      "bucket": "yourbucket",
      "sameNameFileProcessingMode": "跳过",
      "baseDir": "",
      "customDomain": "",
      "isAutoArchive": true
    }
  },
  "picgoPlugins": {
    "picgo-plugin-minio": true
  }
}

注意endPoint不带http[s]://

3.5 上传验证

我们可以借助验证图片上传选项验证配置是否正确，当然也能验证minio是否配置正确，最后定能看到如下所示：

四、体会效率吧

Tips：原先使用本地图片的Markdown文档，也可以选择图片右键自动上传哦。