tinypng upload一键压缩上传工具

简介:

地址

项目地址:tinypng-upload

有兴趣的可以玩一玩,因为平时经常会用到图片压缩,上传,如果你也觉得很繁琐的话,这个将会解决你的痛点。

关于 tinypng-upload

这是一个基于 electron的图片压缩上传工具,压缩过程主要通过调用tinypng提供的API完成。上传配置参考iView的文件上传配置。 因为是桌面端,所以很方便我们将图片拖拽到任务托盘进行压缩上传,极大地提升了前端的工作效率,可以让我们更专注于业务开发。

操作过程:


作者:muwoo
链接:https://juejin.im/post/5b3239d36fb9a00e9e59d932
来源:掘金
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。
45337f5364d9179757c83039cdbfa601367c0f84
99a31c7fc87db06a8eca957e01f4c677cfc1bfdf
压缩前后体积对比(图片压缩完成已自动上传到指的CDN):
e0e944510b0a2ff3a084ce66afe814df0ce4bd35

使用

1. 下载可执行文件

因为暂时没有发布到应用商店,所以需要自己编译出可执行文件:


git clone https://github.com/muwoo/tinypng-upload.git
cd tinypng-upload
npm i
npm run build

然后会在build目录下生成对应的可执行文件,运行改文件即可

2. 配置tinypng API key

因为该项目压缩过程是通过调用 tinypng API来实现的,所以我们需要去tinypng网站上注册一个API key

3b6c2c93632febe890ec24d81df4c2dd00fc4ec6

然后将该值粘贴到我们的配置一栏中:

200859e2deed014513f62fca227fa54f33c8d637

只不过有一点限制,免费的每个月可以压缩 500 张图片。github 上也有人通过循环注册的过程,生成了多个账户API key达到近似于不限制压缩次数的目的。有兴趣也可以了解一下~

3. 配置压缩后图片上传请求

压缩完成之后,我们希望图片可以直接上传到我们公司的CDN上,tiny-png upload上传参考了iView的图片上传参数和设置:上传 upload

bc517745c82b102c0b68f1dc9eb61683cd09bf96
原文发布时间为:2018年06月26日
作者:muwoo
本文来源: 掘金  如需转载请联系原作者
相关文章
|
7月前
视频上传
视频上传
66 0
|
小程序 应用服务中间件 Shell
laravel8(三)文件上传提示 “The file deos not exits ” ,但确实已经上传了文件
Laravel 文件上传提示 “The file "" deos not exits ” ,但确实已经上传了文件
74 1
|
Java 开发工具 UED
“文件的上传与下载:实现与优化“
“文件的上传与下载:实现与优化“
70 0
|
编解码 Java 应用服务中间件
文件的上传和下载
文件的上传和下载
97 0
|
前端开发 网络协议 API
大文件处理(上传,下载)思考
在计算文件hash的方式,主要有以下几种: 分片全量计算hash、抽样计算hash。在这两种方式上,分别又可以使用web-work和浏览器空闲(requestIdleCallback)来实现.
大文件处理(上传,下载)思考
|
Serverless 对象存储 Python
函数计算实现 oss 上传超大 zip 压缩文件的自动解压处理
在本文中,以用户上传超大压缩文件( zip 类型)到 oss, oss 系统捕获 PutObjec/PostObject 的事件, 自动触发函数执行, 函数将压缩文件解压,并将对应的解压文件放在oss 指定的 bucket 的某个目录下为例,展示 FC 的灵丹妙手
8873 0
函数计算实现 oss 上传超大 zip 压缩文件的自动解压处理
|
存储 Apache 安全
文件的上传和下载学习小结
文件的上传和下载学习小结 一、文件上传 客户端通过浏览器将文件上传至服务器。 对于我们写代码来说,就是IO操作。 二、实现文件上传 对表单有什么要求? 1. 提交方式必须为post 2. enctype="multipart/form-data" 3. 对于服务器的servlet有什么要求? request.getParameter("name"); 不能用该方式获取表单数据了,若非要用,则返回null。
1250 0