用Typora,PicGo和OSS实现自动上传图片

本文涉及的产品
对象存储 OSS,20GB 3个月
对象存储OSS,敏感数据保护2.0 200GB 1年
对象存储 OSS,内容安全 1000 次 1年
简介: 以前写博客要发布到好些个平台,我是将图片一张张上传到每个平台,后来发现是真的麻烦,上传图片花的时间太多,极大的降低了我写文章的积极性。后来改进为使用oss,把博客的图片都上传到oss上面。然后使用oss返回的图片url,这样我的文章里面的图片只上传了一次,最后把整篇文章的mardown复制到各个平台上,平台一般都会把markdown的文章中的img标签的图片上传到他们自己的服务器,然后把图片打上平台的水印,然后把原图片链接替换掉。

前言:

以前写博客要发布到好些个平台,我是将图片一张张上传到每个平台,后来发现是真的麻烦,上传图片花的时间太多,极大的降低了我写文章的积极性。

后来改进为使用oss,把博客的图片都上传到oss上面。然后使用oss返回的图片url,这样我的文章里面的图片只上传了一次,最后把整篇文章的mardown复制到各个平台上,平台一般都会把markdown的文章中的img标签的图片上传到他们自己的服务器,然后把图片打上平台的水印,然后把原图片链接替换掉。这样图片值上传了一次,剩下平台上的图片都是平台解析markdown的图片url自己处理的,不需要我们在花时间去上传图片了。

写了一段时间,还是觉得上传一次都觉得是在浪费生命(科技是第一生产力,但是懒惰是第一需求力啊),于是又找了找,还有更加方便的方式吗?我直接截图就自动上传,不用我再传一遍的省力方式?

最后是使用typora+picgo+oss解决了问题。

简单说一下我尝试的其他方式的过程,首先我们用的编辑文章的编辑器要支持直接放截图,并且能上传截图,找了找发现以前用过的typora是完美的符合需求的编辑器,但是发现以前的版本比较低,去官网重新下载了最新版本,结果令我很意外的是以前免费的typora竟然收费了!看来这几年大家都越来越会搞钱了,不过这个编辑器确实还是比较好用的,还是应该支持下优秀的产品,经济水平不错的同学可以支持下,说来惭愧,我是用脚本白嫖的,手动狗头,别打我。写到这里,我突然想起刘强东说kindle在中国肯定做不下去,因为中国充斥着大量的盗版软件,他说的没错,kindle在22年6月30号停止了电子书的运营。或许免费使用,再对高级功能进行收费比较适合我国国情,免费使用用来提高产品的影响力和吸引用户,在对愿意支持收费的用户提供高级功能和收费的入口,这样应该就可以解决产品的盈利问题了。

稍微扯了扯题外话,继续聊自动上传图片的话题,我一开始想能不能直接用github,这样我连钱都不用花,岂不快哉!结果按照网上的教程尝试过后发现,如果不能掌握上网的正确方式,现在的情况是github都连不上,更不用说用github做图床了。然后想试下国内的gitee,结果试了半天发现gitee现在上了防盗链,如果其他人访问的话,没有gitee的域名图片肯定是无法访问的,这也走不通。

最后还是回到我之前的图床-oss,我买的好像是49块钱的,用了好几年也没收过其他的费用。然后使用picgo作为typora上传图片的工具,就搞定了,下面记录一下,搭建自动上传图片工具的过程。

搭建流程

1.先准备一个工具typora,和购买阿里云oss的服务

typora官网的下载地址
笔者这里使用的是typora1.4.8版本

2.设置typora,进入偏好设置

image-20230102164627305

3.选择【图像】的设置,插入图片选择上传图片。

设置如下,选择下面几个跟图片相关的配置:

image-20230102152039088

4.【上传服务器设定】,选择【PicGo(app)】

如果本地没有下载过PicGo,也可以直接点击上面的图中的【下载PicGo(app)】,会下载PicGo的应用。当前我们也可以不选择PicGo选择其他的插件,我是觉得PicGo有图形化界面比较好用,而且还可以脱离typora单独使用,还是国人写的,就选择了这个插件,下面放一下它的官网链接。

PicGo的官网

然后下载好PicGo之后,要在typora里面配置好PicGo的运行路径,像上面的图中那样,指定好运行的目录。

tips:这里稍微扯两句,如果不需要上传到云上,就把图片保存到本地,可以选择复制图片到当前的文件夹,或者下面两个复制到XXX文件夹。这样图片可以直接保存在本地,也很方便。

image-20230102164810848

5.oss相关配置(如果自己已经买好oss服务的同学可以忽略第5步)

这里分成两个步骤:

如果直接用自己的主账号的话,就直接前往5.5步。

如果为了更安全一点,创建一个RAM子账号专门来管理oss的事情,防止其他不必要的信息暴露,创建RAM子账号,就在这里继续往下看。

5.1 从右上角的下拉菜单里面点击【访问控制】

image-20230102172610021

5.2 在点击【身份管理】的【用户】,在点击右边的【创建用户】

image-20230102173136573

5.3 创建用户记得勾选【OpenApi调用访问】

这个是PicGo上传图片要用的

image-20230102173820775

5.4 记住要给设置的用户添加权限【AliyunOSSFulAccess】

这个权限给Ram用户一定要设置下,要不然没法使用oss的各种操作

image-20230102174319723

5.5 找到账号对应的key和Secret

复制好key和secret,后面要用
image-20230102201534323

5.6 创建Bucket

Bucket可以理解为创建一个放图片的空间,里面还可以在继续设置文件夹。

tips:要记住设置公共读,因为我们的图片是要让大家能在平台上传时能访问的。

另外解释一下:

【私有】就是上传和访问都是需要令牌的

【公共读】就是上传图片是需要令牌(appKey和secret),访问是大家都可以访问的

【公共读写】就是不管是谁,都可以上传和访问

image-20230102175605624

image-20230102145523507

5.7 可以给要存储图片的目录创建一个文件夹(可选,不创建也没有关系)

点击刚才创建好的Bucket,为了方便我们管理,右边选择新建目录,比如picture之类的。

6.配置PicGo

在【图床设置】里面选择【阿里云OSS】,填入之前复制的key和Secret,还有bucket,储存区域可以从bucket点开,【概况】里面可以看到,.aliyuncs.com之前的oss-cn-hangzhou就是。

image-20230102202108502

image-20230102195958205

7.验证下效果

使用截图工具随便截个图,粘贴到typora中,看到上传成功,就大功告成!

这篇文章里面的图片也全是用这个方式上传的,再也不用自己手动上传图片了,哈哈哈,节省了自己不少时间和精力,还是挺好的!
image-20230102202514623

参考资料:

1.Typora使用技巧之插入图片及图片上传
2.阿里云 OSS + PicGo 博客图床超详细配置教程!
3.Typora
4.PicGo
5.Typora详解

相关实践学习
通义万相文本绘图与人像美化
本解决方案展示了如何利用自研的通义万相AIGC技术在Web服务中实现先进的图像生成。
相关文章
|
1月前
|
编解码 数据处理 API
如何用阿里云OSS对图片和视频进行数据处理?
本文介绍了如何利用阿里云对象存储OSS进行图片和视频处理。OSS提供了丰富的功能,如图片的缩放、裁剪、旋转和水印添加等,用户只需在图片URL后附加处理参数即可实现自动化处理。同时,OSS还支持自定义样式模板,便于批量操作。对于视频处理,OSS支持转码、截图、拼接等功能,满足多终端播放需求。通过OSS的API和SDK,开发者可以方便地集成这些功能,提升数据管理效率。
|
3月前
|
存储 编解码 Serverless
Serverless架构下的OSS应用:函数计算FC自动处理图片/视频转码(演示水印添加+缩略图生成流水线)
本文介绍基于阿里云函数计算(FC)和对象存储(OSS)构建Serverless媒体处理流水线,解决传统方案资源利用率低、运维复杂、成本高等问题。通过事件驱动机制实现图片水印添加、多规格缩略图生成及视频转码优化,支持毫秒级弹性伸缩与精确计费,提升处理效率并降低成本,适用于高并发媒体处理场景。
215 0
|
1月前
|
存储 编解码 API
如何利用阿里云OSS进行图片和视频处理?
本文介绍了如何利用阿里云对象存储OSS进行图片和视频处理。内容包括OSS的基本功能、上传与管理媒体资源、图片处理(缩放、裁剪、旋转、水印等)、视频处理(转码、截图、拼接等)以及相关API的使用方法。通过OSS,用户可高效实现多媒体资源的存储与处理,适用于各类企业和开发者。
|
11月前
|
存储 人工智能 开发工具
AI助理化繁为简,速取代码参数——使用python SDK 处理OSS存储的图片
只需要通过向AI助理提问的方式输入您的需求,即可瞬间获得核心流程代码及参数,缩短学习路径、提升开发效率。
1671 5
AI助理化繁为简,速取代码参数——使用python SDK 处理OSS存储的图片
|
8月前
|
前端开发 安全 测试技术
为什么我的“OSS”上传图片会失败?
在项目中添加上传头像功能时,起初通过阿里云OSS SDK快速实现并返回图片URL给前端。然而,mentor指出直接回传密钥存在安全风险,建议使用STS临时授权优化安全性。优化后,本地测试正常,但线上环境出现跨域问题。最终通过调整前端代码,使用`window.location.protocol`确保请求协议一致,解决了跨域问题。这一过程不仅提升了功能的健壮性,也让我深刻理解了安全性和兼容性的重要性。
469 7
|
11月前
|
存储 人工智能 缓存
AI助理直击要害,从繁复中提炼精华——使用CDN加速访问OSS存储的图片
本案例介绍如何利用AI助理快速实现OSS存储的图片接入CDN,以加速图片访问。通过AI助理提炼关键操作步骤,避免在复杂文档中寻找解决方案。主要步骤包括开通CDN、添加加速域名、配置CNAME等。实测显示,接入CDN后图片加载时间显著缩短,验证了加速效果。此方法大幅提高了操作效率,降低了学习成本。
5809 16
|
11月前
|
算法 Java Linux
java制作海报四:java BufferedImage 转 InputStream 上传至OSS。png 图片合成到模板(另一个图片)上时,透明部分变成了黑色
这篇文章主要介绍了如何将Java中的BufferedImage对象转换为InputStream以上传至OSS,并解决了png图片合成时透明部分变黑的问题。
532 1
|
存储 JavaScript 前端开发
Vue中实现图片上传,上传后的图片回显,存储图片到服务器 【使用对象存储OSS】
这篇文章介绍了在Vue中实现图片上传到阿里云OSS对象存储服务的完整流程,包括服务端签名直传的前提知识、后端设置、前端组件封装以及图片上传和回显的效果展示。
|
运维 Serverless 对象存储
函数计算产品使用问题之如何配合OSS实现接口收到的图片或文件直接存入OSS
函数计算产品作为一种事件驱动的全托管计算服务,让用户能够专注于业务逻辑的编写,而无需关心底层服务器的管理与运维。你可以有效地利用函数计算产品来支撑各类应用场景,从简单的数据处理到复杂的业务逻辑,实现快速、高效、低成本的云上部署与运维。以下是一些关于使用函数计算产品的合集和要点,帮助你更好地理解和应用这一服务。
166 0
|
文字识别 算法 安全
视觉智能开放平台产品使用合集之如何将返回的图片链接转存到OSS(对象存储服务)
视觉智能开放平台是指提供一系列基于视觉识别技术的API和服务的平台,这些服务通常包括图像识别、人脸识别、物体检测、文字识别、场景理解等。企业或开发者可以通过调用这些API,快速将视觉智能功能集成到自己的应用或服务中,而无需从零开始研发相关算法和技术。以下是一些常见的视觉智能开放平台产品及其应用场景的概览。
112 0