tinypng upload一键压缩上传工具,告别人肉
地址
项目地址:tinypng-upload
有兴趣的可以玩一玩,因为平时经常会用到图片压缩,上传,如果你也觉得很繁琐的话,这个将会解决你的痛点。
关于 tinypng-upload
这是一个基于 electron
的图片压缩上传工具,压缩过程主要通过调用tinypng
提供的API完成。上传配置参考iView
的文件上传配置。
因为是桌面端,所以很方便我们将图片拖拽到任务托盘进行压缩上传,极大地提升了前端的工作效率,可以让我们更专注于业务开发。
操作过程:
压缩前后体积对比(图片压缩完成已自动上传到指的CDN):
使用
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
:
然后将该值粘贴到我们的配置一栏中:
只不过有一点限制,免费的每个月可以压缩 500 张图片。github 上也有人通过循环注册的过程,生成了多个账户API key
达到近似于不限制压缩次数的目的。有兴趣也可以了解一下~
3. 配置压缩后图片上传请求
压缩完成之后,我们希望图片可以直接上传到我们公司的CDN
上,tiny-png upload
上传参考了iView
的图片上传参数和设置:上传 upload
Property | Decription | Type | Default |
---|---|---|---|
action | Upload request URL, required. | String | - |
headers | Upload request header. | Object | {} |
data | Extra data with upload request. | Object | {} |
name | The key in upload request targeting to the file. | String | file |
with-credentials | Enable certification info in Cookie or not. | Boolean | false |
灵感来源
之前在掘金上看了一篇关于electron
图片上传的工具PicGo
,很感谢作者提供的文章参考PicGo的star数破1000的心路历程。
tinypng upload一键压缩上传工具,告别人肉的更多相关文章
- spring boot 文件上传工具类(bug 已修改)
以前的文件上传都是之前前辈写的,现在自己来写一个,大家可以看看,有什么问题可以在评论中提出来. 写的这个文件上传是在spring boot 2.0中测试的,测试了,可以正常上传,下面贴代码 第一步:引 ...
- HTML5 图片本地压缩上传插件「localResizeIMG」
移动应用中用户往往需要上传照片,但是用户上传的照片尺寸通常很大,而手机的流量却很有限,所以在上传前对图像进行压缩是很有必要的. 原生应用可以直接对文件进行处理,网页应用就没有这个优势了.不过 canv ...
- PHP 图片上传工具类(支持多文件上传)
====================ImageUploadTool======================== <?php class ImageUploadTool { private ...
- Html5+asp.net mvc 图片压缩上传
在做图片上传时,大图片如果没有压缩直接上传时间会非常长,因为有的图片太大,传到服务器上再压缩太慢了,而且损耗流量. 思路是将图片抽样显示在canvas上,然后用通过canvas.toDataURL方法 ...
- swfupdate flash上传工具
引用:http://baike.baidu.com/view/1332553.htm 下载地址:http://code.google.com/p/swfupload/ 什么是SWFUpload? SW ...
- 小白日记20:kali渗透测试之后渗透测试阶段(一)--上传工具
后渗透测试阶段--上传工具 为防止管理员将漏洞补上后,我们无法再通过该漏洞控制对方主机,所以需要进行后渗透测试阶段 1.上传各种工具 2.提权:为了全面控制目标系统 3.擦除攻击痕迹:防止管理员通过日 ...
- 文件上传工具swfupload[转]
转至:http://zhangqgc.iteye.com/blog/906419 文件上传工具swfupload 示例: 1.JavaScript设置SWFUpload部分(与官方例子类似): var ...
- js 图片压缩上传(纯js的质量压缩,非长宽压缩)
下面是大神整理的demo,很实用,这里存一下备用,感谢大神! 此demo为大于1M对图片进行压缩上传 若小于1M则原图上传,可以根据自己实际需求更改. demo源码如下 <!DOCTYPE ht ...
- H5图片压缩上传
1.所用到技术 HTML5 API:filereader.canvas 以及 formdata 目前来说,HTML5的各种新API都在移动端的webkit上得到了较好的实现.本次使用到的FileRea ...
随机推荐
- 6月份值得一看的 Java 技术干货!
6月过完了,这一年都 TM 过了一半了,大家都回想下自己这大半年,你都收获了什么??技术有提升吗?对象搞定了吗? 说多了都是泪,唯有 WIFI.空调.西瓜.足球能够解忧.. 话说中国队怎么还不上场?哈 ...
- spring boot -thymeleaf-逻辑控制
th:if th:switch
- Hadoop服务库与事件库的使用及其工作流程
Hadoop服务库与事件库的使用及其工作流程 Hadoop服务库: YARN采用了基于服务的对象管理模型,主要特点有: 被服务化的对象分4个状态:NOTINITED,INITED,STARTED, ...
- h5端呼起摄像头扫描二维码并解析
2016年6月29日补充: 最近做了一些与表单相关的项目,使用了h5的input控件,在使用过程中遇到了很多的坑.也包括与这篇文章相关的. 首先我们应该知道使用h5新提供的属性getUserMedia ...
- 关于 Nginx 配置 WebSocket 400 问题
今天把项目升级了 asp.net core 到 2.1 的版本,使用了 signalr 的功能,由于阿里云不支持 websocket 协议,所以使用了 nginx 代理方式来解决,后续就报了一个登陆 ...
- mongodb数据库添加权限及简单数据库命令操作笔记
加固mongodb建议:修改数据库默认端口,添加数据库访问权限: 启动数据库(裸奔):C:\mongodb\bin>mongod --dbpath C:\MongoDB\data(同时用--db ...
- java-Timer类使用方法
Timer: public Timer()创建一个新计时器.相关的线程不 作为守护程序运行. 方法摘要: void schedule(TimerTask task, Date time) ...
- 从零开始学 Web 之 DOM(三)innerText与innerHTML、自定义属性
大家好,这里是「 Daotin的梦呓 」从零开始学 Web 系列教程.此文首发于「 Daotin的梦呓 」公众号,欢迎大家订阅关注.在这里我会从 Web 前端零基础开始,一步步学习 Web 相关的知识 ...
- 从零开始学 Web 之 jQuery(六)为元素绑定多个相同事件,解绑事件
大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...
- window下安装绿色版5.7
1. 在mysql的安装目录下创建my.ini,并配置必要参数. 2. 执行命令mysqld --initialize-insecure --basedir=/opt/mysql/mysql --d ...