Typora编辑文档图片自动上传至腾讯云

2023-12-12 11:50

本文主要是介绍Typora编辑文档图片自动上传至腾讯云,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

一、背景

在用Typora写博客文章时,首先是将文章写好,为了让文章更直观,一般情况下会在文章中插入图片(毕竟人是视觉动物,眼睛是十分强大的图片处理器)。但是在将编辑好的文章复制粘贴至博客时,会发现图片无法显示,此时最笨的办法就是一张张的图片上传至博客,可想效率之低下,于是在思考如何高效的将文章复制到博客。虽然,网络上已经有了很多的办法,但一直在尝试是否能寻找到更便捷高效的方法,最后站在各路互联网站巨人的肩膀写下此博文。

二、解决方案

解决Typora图片复制问题,其实本质就是各博客的API并非互联互通,所以需要先要将本地的图片上传至互联网上,然后博客才能访问。所以思路已经很清楚了。

  • 方案:云平台(腾讯云等)+上传图片插件(typora-plugins-win-img)

三、注册云账号

1、注册云账号

腾讯云地址:https://cloud.tencent.com/

2、创建子用户

进入“访问管理”,然后点击“用户”,再点击“用户列表”,根据提示创建子用户

然后,设置账户的访问权限,搜索“QcloudCOSFullAccess”,然后勾选了“QcloudCOSFullAccess”即可。

访问方式选择“编程访问”,最后点击完成。

3、创建存储桶

进入“对象管理”,然后点击“存储桶列表”,再点击“创建存储桶”,然后点击“公有读私有写”,接着点击“不加密”,确定。

创建桶,并给桶取名字

“创建存储桶”完毕后,再在“桶列表”里选择刚创建的桶,然后点击“创建文件夹”,此处保存Typora插件上传的图片。

四、下载插件并配置

1、下载插件

下载地址:https://github.com/Thobian/typora-plugins-win-img

2、拷贝插件文件
  • 将插件文件夹复制到Typora安装目录

    将plugins文件夹复制至Typora安装目录下的app文件夹下,如图所示:

3、配置window.html文件

来到Typora安装目录下的app文件夹下(比如:D:\Program Files\Typora\resources\app),修改window.html文件。

用编辑器打开window.html文件,搜索(Ctrl+F可调出搜索功能)代码:

<script src="./app/window/frame.js" defer="defer"></script>注意:搜索上述全部代码可能搜索不到,此时局部搜索即可,比如搜索src="./app/window/frame.js"

搜到到后,在其后面追加:

<script src="./plugins/image/upload.js" defer="defer"></script>

如图所示:

4、配置upload.js文件

同样,来到Typora安装目录下的app文件夹下的plugins(比如:D:\Program Files\Typora\resources\app\plugins\image),plugins文件夹是从插件typora-plugins-win-img复制过来的。

配置upload.js文件,在刚复制的plugins下,进入到plugins/image,配置upload.js文件。

用文本编辑器打开upload.js文件,直接到达底部的$.image.init();一行,用以下部分替换之。

//为了你腾讯云的安全,强烈建议你为这个操作添加一个单独的子账号,并只开启API访问权限
//添加子账号:https://console.cloud.tencent.com/cam
//更多关于腾讯云子账号(CAM)说明:https://cloud.tencent.com/document/product/598/13665
$.image.init({target:'tencent',tencent : {Bucket: 'bucket-name',  // 对象存储->存储桶列表(存储桶名称就是Bucket)SecretId: 'SecretId',   // 访问控制->用户->用户列表->用户详情->API密钥 下查看SecretKey: 'SecretKey', // 访问控制->用户->用户列表->用户详情->API密钥 下查看Region: 'Region',       // 对象存储->存储桶列表(所属地域中的英文就是Region)folder: 'typora',       // 可以把上传的图片都放到这个指定的文件夹下},
});

5、配置说明
  • Bucket: 'bucket-name', 对象存储->存储桶列表(存储桶名称就是Bucket)

  • SecretId: 'SecretId', 访问控制->用户->用户列表->用户详情->API密钥下查看

  • SecretKey: 'SecretKey', // 访问控制->用户->用户列表->用户详情->API密钥 下查看

  • Region: 'Region', 对象存储->存储桶列表(所属地域中的英文就是Region)

  • folder: 'typora', 可以把上传的图片都放到这个指定的文件夹下
6、防盗链配置

为了避免恶意程序使用资源 URL 盗刷公网流量或使用恶意手法盗用资源,带来不必要的损失。腾讯云对象存储支持防盗链配置,通过控制台的防盗链设置配置黑/白名单,来进行安全防护。

7、重启Typora

保存好修改的配置,然后重启Typora上传图片,显示成功。

五、新版本Typora功能

新版本Typora功能新增加了“上传服务设定”,需要下载PicGo软件

image-20200226193625919

下载并安装PicGo软件后,然后配置PicGo的图床

image-20200226193957978

然后,在配置云账号信息等,最后保存即可。

img

六、参考文献

1、插件下载:https://github.com/Thobian/typora-plugins-win-img

2、配置云账号信息可参考:https://picgo.github.io/PicGo-Doc/zh/guide/config.html

这篇关于Typora编辑文档图片自动上传至腾讯云的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/484542

相关文章

c/c++的opencv实现图片膨胀

《c/c++的opencv实现图片膨胀》图像膨胀是形态学操作,通过结构元素扩张亮区填充孔洞、连接断开部分、加粗物体,OpenCV的cv::dilate函数实现该操作,本文就来介绍一下opencv图片... 目录什么是图像膨胀?结构元素 (KerChina编程nel)OpenCV 中的 cv::dilate() 函

Python使用pynput模拟实现键盘自动输入工具

《Python使用pynput模拟实现键盘自动输入工具》在日常办公和软件开发中,我们经常需要处理大量重复的文本输入工作,所以本文就来和大家介绍一款使用Python的PyQt5库结合pynput键盘控制... 目录概述:当自动化遇上可视化功能全景图核心功能矩阵技术栈深度效果展示使用教程四步操作指南核心代码解析

SpringBoot实现文件记录日志及日志文件自动归档和压缩

《SpringBoot实现文件记录日志及日志文件自动归档和压缩》Logback是Java日志框架,通过Logger收集日志并经Appender输出至控制台、文件等,SpringBoot配置logbac... 目录1、什么是Logback2、SpringBoot实现文件记录日志,日志文件自动归档和压缩2.1、

SpringCloud使用Nacos 配置中心实现配置自动刷新功能使用

《SpringCloud使用Nacos配置中心实现配置自动刷新功能使用》SpringCloud项目中使用Nacos作为配置中心可以方便开发及运维人员随时查看配置信息,及配置共享,并且Nacos支持配... 目录前言一、Nacos中集中配置方式?二、使用步骤1.使用$Value 注解2.使用@Configur

GitLab文件的上传与下载方式

《GitLab文件的上传与下载方式》:本文主要介绍GitLab文件的上传与下载方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录GitLab 项目拉取到本地GitLab 项目上传方法方法 1:本地项目未初始化Git方法 2:本地项目已初始化GitGitLab 上

Golang实现Redis分布式锁(Lua脚本+可重入+自动续期)

《Golang实现Redis分布式锁(Lua脚本+可重入+自动续期)》本文主要介绍了Golang分布式锁实现,采用Redis+Lua脚本确保原子性,持可重入和自动续期,用于防止超卖及重复下单,具有一定... 目录1 概念应用场景分布式锁必备特性2 思路分析宕机与过期防止误删keyLua保证原子性可重入锁自动

使用Python实现调用API获取图片存储到本地的方法

《使用Python实现调用API获取图片存储到本地的方法》开发一个自动化工具,用于从JSON数据源中提取图像ID,通过调用指定API获取未经压缩的原始图像文件,并确保下载结果与Postman等工具直接... 目录使用python实现调用API获取图片存储到本地1、项目概述2、核心功能3、环境准备4、代码实现

Nginx 413修改上传文件大小限制的方法详解

《Nginx413修改上传文件大小限制的方法详解》在使用Nginx作为Web服务器时,有时会遇到客户端尝试上传大文件时返回​​413RequestEntityTooLarge​​... 目录1. 理解 ​​413 Request Entity Too Large​​ 错误2. 修改 Nginx 配置2.1

Java应用如何防止恶意文件上传

《Java应用如何防止恶意文件上传》恶意文件上传可能导致服务器被入侵,数据泄露甚至服务瘫痪,因此我们必须采取全面且有效的防范措施来保护Java应用的安全,下面我们就来看看具体的实现方法吧... 目录恶意文件上传的潜在风险常见的恶意文件上传手段防范恶意文件上传的关键策略严格验证文件类型检查文件内容控制文件存储

python利用backoff实现异常自动重试详解

《python利用backoff实现异常自动重试详解》backoff是一个用于实现重试机制的Python库,通过指数退避或其他策略自动重试失败的操作,下面小编就来和大家详细讲讲如何利用backoff实... 目录1. backoff 库简介2. on_exception 装饰器的原理2.1 核心逻辑2.2