• tinypng upload一键压缩上传工具,告别人肉


    地址

    项目地址:tinypng-upload

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

    关于 tinypng-upload

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

    操作过程:

    image

    image

    压缩前后体积对比(图片压缩完成已自动上传到指的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

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

    只不过有一点限制,免费的每个月可以压缩 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的心路历程

  • 相关阅读:
    使用SpringAOP
    Alpha 冲刺 (5/10)
    Alpha 冲刺 (4/10)
    Alpha 冲刺 (3/10)
    Alpha 冲刺 (2/10)
    Alpha 冲刺 (1/10)
    项目需求分析答辩总结
    项目UML设计(团队)
    项目选题报告答辩总结
    第七次作业--项目需求分析
  • 原文地址:https://www.cnblogs.com/tiedaweishao/p/9233110.html
Copyright © 2020-2023  润新知