Typora图片上传图床及导出html图片转base64

Typora+Node.js+Picgo+Gitee 设置图片自动上传

一、必须安装的软件

1. Typora

官网地址: https://www.typora.io/
官网最后免费版(0.11.18):https://typora.io/windows/dev_release.html
阿里云盘链接:https://www.aliyundrive.com/s/qQmqVZEgDrb

2. Node.js

官网下载地址: https://nodejs.org/en/
node-v17.7.0-x64.msi:https://www.aliyundrive.com/s/eRgtmKUrhkT

3. Picgo-Core

​ 由Typora内置的下载来实现,直接点击下载或更新等待完成即可!
下载更新

二、软件/网站配置

1. Picgo-Core

首先需要找到Typora软件下载的Picgo-Core二进制文件,路径为:C:\Users\用户名\AppData\Roaming\Typora\picgo\win64\为了以后方便,可直接把此路径添加到系统环境变量 中,过程如下:
我的电脑属性高级系统设置环境变量系统变量的Path编辑新建粘贴路径即可!

打开cmd后,输入picgo -h 出现如下图所示,则说明环境变量添加成功
检验环境
在终端执行命令:picgo install gitee-uploader,显示插件安装成功后完成。

2. Gitee

首先要知道Gitee是个什么性质的网站,然后要拥有一个Gitee网站的账户,这个是必须的。
新建一个公开的仓库,并在仓库内建立一个文件夹名为imgs,移动到右上角头像处选择设置→在安全设置中选择私人令牌生成新令牌填写描述选择后点击提交
仓库
获取到你的私人令牌,并妥善保存到你记得的地方,不能忘记后续要用 (重要)
私人令牌创建

3. picgo/config.json

偏好设置图像→点击打开配置文件config.json
打开配置文件
然后将下方的模板信息复制进picgo/config.json,更改相应的名称即可!

{
  "picBed": {
    "current": "gitee",
    "uploader": "gitee",
    "gitee": {
      "branch": "master",
      "customPath": "yearMonth",
      "customUrl": "",
      "path": "imgs",// 仓库保存目录
      "repo": "用户名/仓库名",
      "token": "刚才获得的私人令牌"
    }
  },
  "picgoPlugins": {
    "picgo-plugin-gitee-uploader": true
  }
}

4. 测试上传

偏好设置图像验证图片上传选项,出现上传成功即表示图床成功搭建完成!

注意: 图片上传格式尽量选用jpg格式,不要使用png格式或bmp格式,这些格式的图片体积都很大,不利于上传或者下载。
测试上传

三、提醒及设置

提醒: 我们的仓库状态是公开的,所以请勿上传一些敏感图片信息,以防止信息泄露!

设置: 平时写文章时某文章包含敏感信息不想让其上传某文章不包含敏感信息想让其直接上传,那么我们该如何配置才能够达到要求呢?

1.敏感信息

某文章包含敏感信息不想让其上传,如下设置:
设置好本地路径,直接将图片粘贴文章中即可!想上传时直接图片上鼠标右键上传图片即可!
在这里插入图片描述

2.非敏感信息

某文章不包含敏感信息想让其直接上传,如下设置:
写文章时直接粘贴图片到文章中即可自动上传
在这里插入图片描述

Typora导出html图片转base64

一、遇到问题

typora 导出 html 的时候不带文档中的图片,不方便个人网站的上传。所以想办法将markdown中的图片转化为base64格式,嵌入到html中,这样就省略的图床的需要,对于图像需要较少的网页,使用很好。

二、注意情况

图片路径不要使用中文,否则可能会不成功
电脑必须要有 jdk 环境,否则无法执行jar

三、实现过程

TyporaToBase64.jar:https://yirj.lanzoub.com/iwZ3C0e57rhg
下载jar将其放到软件的安装目录下:D:\Software\Typora
在这里插入图片描述
接下来进行typora 配置 左上角 文件偏好设置导出html导出后里的运行自定义命令
填入java -jar D:\Software\Typora\TyporaToBase64.jar "${outputPath}"并且勾选显示命令行输出,如下图所示:
在这里插入图片描述

四、测试输出

输出过程如下图:
在这里插入图片描述
输出成功如下图:
在这里插入图片描述
打开验证如下图:
在这里插入图片描述

参考文章:
附论坛里两位大佬自己做的图片上传软件:
有人用Typora吗?写了一个自动上传图片的包:https://www.52pojie.cn/thread-1369835-1-1.html
Typora图片上传golang实现:https://www.52pojie.cn/thread-1389953-1-1.html
PicGo + GitHub 搭建个人图床工具: https://blog.csdn.net/yefcion/article/details/88412025
Typora + PicGo-Core + SM.MS图床: https://www.lzskyline.com/index.php/archives/87/
Typora+Picgo+Gitee 设置图片自动上传

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值