Typora自动转换图片链接

简介: Typora自动转换图片链接

Typora将本地图片上传到图床


养成习惯,先赞后看!!!


前言


最近因为忙公司的项目,已经好长时间没有更新文章了.最近刚好抽出了点时间,就想着还是写一篇文章吧.


今天的这篇文章没有涉及到技术方面,只是我生活中刚好发生过的一个小问题,这里刚好就分享出来,顺便看看大家都是怎么解决的.


不知道大家在写文章的时候,一般都是通过什么工具写的?我自己一般都是用CSDN自带的编辑器来写的,但是就在我之前还在更文章的那段时间里,出现了这么一个让我恶心的事,那就是我的谷歌浏览器很鬼畜的将我的文章中的内容全部翻译成了中文.我试着重新翻译回来但发现已经于事无补了.


因为这次翻译不仅是把我的文字翻译成了中文,更要命的是它把我文章中的那些标点符号也全部换成了中文状态下的标点符号,这就导致我的那些Markdown语法的标记就全部失效了.我写了快一个星期的稿子说实话也就直接废了.那时候自己还发了个朋友圈.


朋友们也给我提了不少的建议,我自己也顺便深入思考了一下这个问题.差不多有下面这些总结以及问题.


在CSDN自带的编辑器上写稿子的前提是我们的电脑是能够联网的,否则我们就无法使用CSDN自带的编辑器来写稿.

我们可能有时候给谷歌浏览器安装了自动翻译的插件,我的原因可能就是这个,这个插件本身是有点灵敏过头的.他有时候直接不管你要不要翻译它都会直接帮你翻译,我的情况应该就是这种.

再考虑完这些问题之后我就准备重新开始在本地的编辑器Typora上面编写,但是在Typora上面写稿的话,又有一个问题那就是,Typora上面存储的图片的路径是以你电脑的绝对路径进行存储的,就如下图所示:


cd813131b6d72c5a90a9cbf72eba92ba.png


很显然当我们将我们的稿子发布到我们的各大平台时,很显然我们的图片链接是识别不出来的,所以我们的这些图片都是直接失效.所以这时候我们就需要我们的图床工具了.这里我之前就已经推荐过一款图床工具-(聚合图床),如下图:


dd38c22faaf2834dfd332254a7e84d9d.png


但是我后来又想了想,总不能我每截一张图我就上传一次图床吧,这样岂不是太麻烦了.于是我就想着能不能直接让Typora自动生成图片的HTTP链接呢.其实之前我自己也看过Typora中图像的设置,但是那时候我的Typora的版本还比较的老,根本就没有显示如下图圈出来的功能:


f06b3252bb0a46b4aa41c0916c6d4a57.png


于是我就本能的以为是不存在这样的方法的,但是最近我又重新Google了一下发现其实是有的,于是今天就把这个分享出来,当然了大家可能也有自己对应的解决方案都可以在评论区说出来.


工具


这里我们需要的主要就是这个几个工具或者说是平台吧


码云(gitee)

Gitee主要就是在gitee上面建立我们专门用来存放图片的仓库


PicGo

PicGo是本机用来上传到对应图片仓库的工具,可以支持多种图床仓库


gitee-uploader

这是PicGo用来将图片上传到gitee上面的插件


创建仓库


Gitee地址:https://gitee.com/


我们首先需要登录Gitee,然后创建我们对应的仓库


cf9800dc2d124f394eec91ca1a28f15c.png


之后填写相关的信息即可


02d2be3a5fd5620f0033ae17064f4e14.png


之后我们就需要创建我们自己的令牌即Token,这个Token主要就是让我们接下来配置的PicGo能够识别我们的身份让我们能够访问我们的Gitee仓库.


16824d492f1bdd0c105fa9f06a948198.png

dc109ff9db94bddb474e4e0ffe406b39.png


之后我们点击创建即可,但是这里我们要注意一定要记得复制该Token,因为之后Token就不会通过明文的方式显示了,而是显示加密之后的字符串了.到这里我们关于仓库的大家就已经结束了,接下来我们就需要来配置我们的PicGo了.


配置PicGo


PicGo下载地址:https://github.com/Molunerfinn/PicGo/releases


之后我们下载以.exe结尾的即可.


c9142692c329a6d778ca81ccc3059978.png


下载完成之后点击下一步傻瓜式安装即可.


之后我们进入插件设置页面


0615495ae644120b54d98f63a6965f9e.png


一般情况下我们直接在这里面搜索gitee-uploader插件即可,但是不知道为什么我的不行,所以只能自己手动下载了.但是这里下载的话我们需要用到npm,所以我们首先需要安装npm再来下载我们的gitee插件.


cbf61ebc539fe756f289b76e9ce1bc9a.png


之后我们需要切换到PicGo的系统路径下来下载我们的插件,记住这里并不是在安装路径下,基本路径都是这样的C:\Users\用户名\AppData\Roaming\picgo


之后运行该命令:npm install picgo-plugin-gitee-uploader 即可.


之后我们打开PicGo,如果能够看到该页面就说明已经安装成功了.


d990802afc4ef76d30dab62d28b69e87.png


之后我们就只需要在配置一下我们的插件即可.


59bcd99d9517c3ef4077ec5dedac3f5c.png


repo:码云上面我们的仓库路径一般是这样的格式:用户名/仓库名

branch:分支名,因为我们初始化的时候直接就是master分支,所以直接填master即可

token:就是我们上面创建的token令牌

path:这是之后我们的图片生成之后的HTTP链接的一级目录的名字

customPath:为了防止图片名重复覆盖,所以需要选择图片的命名方式,这里我选择的是年月的时间戳格式

customUrl:这个可以不填

最后我们点击确认,我们的PicGo图床服务就已经配置结束了.


Typora配置PicGo服务


低版本的Typora是不支持定义上传图片的功能了,所以需要我们更新到一定的版本,Up自己就是这样的,更新完成之后,我们点击文件->偏好设置->图像.我们就会看到下面的界面


e609433bcebc402e25999482059b56ff.png


这时候我们只需要配置一下即可


上传服务:这里就选择我们上面刚刚配置过的PicGo即可

PicGo路径:这里就是我们软件的安装路径了,注意和上面的系统路径进行区分

最后我们在测试一下上传图片的功能,点击验证图片上传选项,


bee912f8a914feaacb2c7b136a3f6015.png


如果出现上面的页面就说明已经配置成功了.


验证


最后我们再来验证一下我们的图片上传是否已经真的配置成功.


我们随便通过微信截图截一张图然后粘贴到Typora里面,看看图片的连接是怎样的的.


304205003297f65d5d2be06724fe61a5.png


可以看到图片的链接已经从原来的绝对路径转换成了HTTP链接了,并且我们可以发现链接地址指向的就是我们的码云仓库,并且仓库后面的一级地址就是我们上面定义的blogimg,图片的名字也就是对应的时间戳.这就说说明我们已经配置成功了.


并且我们打开我们的仓库也可以发现的确多了很多的图片:


02f4ab161f62cb21a19138fefe84717f.png


到这里,以后就能更加方便的写稿了,就不用再担心图片链接地址的问题了.


相关文章
livp图片怎么打开以及怎么转换成jpg格式教程
livp图片怎么打开以及怎么转换成jpg格式教程
|
4月前
|
Web App开发 Linux Windows
解决Markdown文件上传至CSDN无法显示本地图片问题-白嫖版,分享给别人的md文件图片不显示的解决方案
解决Markdown文件上传至CSDN无法显示本地图片问题-白嫖版,分享给别人的md文件图片不显示的解决方案
105 3
|
5月前
|
存储 JavaScript Python
word文档转成Markdown文档并在Typora免费版添加图床-----想想都很香
word文档转成Markdown文档并在Typora免费版添加图床-----想想都很香
184 0
|
SQL 存储 数据库
如何快速替换typecho的图片链接
这篇文章介绍了作者如何快速替换typecho博客中的图片链接。由于作者习惯将图片直接存储在自己的服务器上,当域名到期后,文章中的图片链接失效。作者通过登录phpMyAdmin,进入博客数据库并执行SQL语句来替换所有文章中的图片链接。文章提供了相关的SQL语句和执行方法。
401 1
|
PHP 数据安全/隐私保护
ueditor上传图片添加水印
博客在上传图片的时候,我希望能打上我博客链接的水印,掘金,csdn都是这么干的,这事我得学习。 平时的图片上传还好说,在文章编辑的时候,使用ueditor上传图片加水印需要修改ueditor部分PHP的源码,我这里大概记录一下。 首先打开php文件夹下的Uploader.class.php
57 0
|
前端开发
【前端】从markdown格式文本中提取图片链接
【前端】从markdown格式文本中提取图片链接
153 0
|
编解码 iOS开发
iOS 图片链接含有中文图片无法显示问题解决办法
iOS 图片链接含有中文图片无法显示问题解决办法
231 0
|
iOS开发
iOS formData形式上传身份证正反面图片到服务器
iOS formData形式上传身份证正反面图片到服务器
228 0
如何将本地图片转成图片链接
如何将本地图片转成图片链接
1989 0
如何将本地图片转成图片链接
|
编解码 前端开发 JavaScript
网页转化成pdf,网页转换图片,wkhtmltopdf,wkhtmltoimage使用小结
如果必须是异步接口,让后台调用的时候,在命令行里面加上延时--javascript-delay 10000,默认是200ms,意思命令行访问url的时候,延时10000毫秒生成pdf或者图片,这样也能解决问题,但是请求时间过长。
902 0
网页转化成pdf,网页转换图片,wkhtmltopdf,wkhtmltoimage使用小结