vue upload 图片转base64、转二进制数组，保存编码数据到文件

功能需求

1.图片转base64

2.base 64 转二进制数组

3.保存二进制数据到文件下载到本地

解决方法

问题1：

参考资料

vue element upload图片 转换成base64

具体代码

getBase64(file) {
      return new Promise(function (resolve, reject) {
        let reader = new FileReader();
        let imgResult = "";
        reader.readAsDataURL(file);
        reader.onload = function () {
          imgResult = reader.result;
        };
        reader.onerror = function (error) {
          reject(error);
        };
        reader.onloadend = function () {
          resolve(imgResult);
        };
      });
}
beforeUpload(file) {
    this.getBase64(file).then(res => {
        console.log(res);
   })
}

问题2

参考资料

base 64 转bytes数组

具体代码

    beforeUpload(file) {
      var fileName = file.name || ''

      this.getBase64(file).then(res => {
        // console.log(res);
 
        //二进制数组转换
        var bytes = window.atob(res.split(',')[1]);        //去掉url的头，并转换为byte

        //处理异常,将ascii码小于0的转换为大于0
        var ab = new ArrayBuffer(bytes.length);
        var ia = new Uint8Array(ab);
        for (var i = 0; i < bytes.length; i++) {
          ia[i] = bytes.charCodeAt(i);
        }

        console.log("ia", ia)
      });
}

问题3

参考资料

将内存中的数据保存为文件下载到本地

具体实施

参考资料里面的方法二

具体代码

  function  downFile(json1) {
      var elementA = document.createElement('a');

      elementA.setAttribute('href', 'data:text/plain;charset=utf-8,' + json1);
      elementA.setAttribute('download', +new Date() + ".txt");
      elementA.style.display = 'none';
      document.body.appendChild(elementA);
      elementA.click();
      document.body.removeChild(elementA);
    },

 beforeUpload(file) {
      var fileName = file.name || ''

      this.getBase64(file).then(res => {
        // console.log(res);
        //二进制数组转换
        var bytes = window.atob(res.split(',')[1]);        //去掉url的头，并转换为byte

        //处理异常,将ascii码小于0的转换为大于0
        var ab = new ArrayBuffer(bytes.length);
        var ia = new Uint8Array(ab);
        for (var i = 0; i < bytes.length; i++) {
          ia[i] = bytes.charCodeAt(i);
        }
        this.downFile(ia)
        console.log("ia", ia)
      });
}