imgzip v2.0.10

imgZip

图片压缩插件

Demo示例

图片压缩

安装

npm

 npm i imgzip

script

<script src="https://unpkg.com/imgzip@2.0.8/dist/index.min.js"></script>

@2.0.8为固定版本,可自行调整

使用方法

2.x版本（支持ts）

import imgzip from "imgzip";

export default {
  name: "App",
  mounted() {
    // 监听选择文件
    document.getElementById("file").onchange = function () {
      // @2.x版本后采用 class Api。所以需要 new 一个 imgZip 对象
      let compress = new imgzip({ quality: 0.5 });
      // 调用图片压缩
      compress.photoCompress(this.files[0], function (base64) {
        // document.getElementById('img').src = base64  //预览图片
        // 转 blob 流上传 convertBase64UrlToBlob函数为 imgzip 的静态函数
        let blob = imgzip.convertBase64UrlToBlob(base64);
        let formData = new FormData();
        formData.append("file", blob, "file_" + Date.parse(new Date()) + ".jpg"); // 文件对象
        // 上传操作....
      });
    };
  },
};

函数说明

@2.x版本后改用class api, 原photoCompress函数中传入的options参数改为实例化imgzip时传入。

• new imgZip(options)

• photoCompress(图片压缩函数) 无返回值

1.x版本(不支持ts)

import imgzip from "imgzip";

export default {
  name: "App",
  mounted() {
    // 监听选择文件
    document.getElementById("file").onchange = function () {
      // 调用图片压缩
      imgzip.photoCompress(this.files[0], {}, function (base64) {
        // document.getElementById('img').src = base64  //预览图片
        // 转 blob 流上传
        let blob = imgzip.convertBase64UrlToBlob(base64);
        let formData = new FormData();
        formData.append("file", blob, "file_" + Date.parse(new Date()) + ".jpg"); // 文件对象
        // 上传操作....
      });
    };
  },
};

函数说明

• photoCompress(图片压缩函数)

• convertBase64UrlToBlob(base64编码转blod流) 1.x版本和2.x版本均为imgzip的静态函数