ionic3文件上传（android）

所用插件：cordova-plugin-file

cordova-plugin-file-transfer可以实现单个文件的上传、下载，但是看了半天只能传文件，还有其他的数据怎么办？所以就去研究文件的传输类型了。

在浏览器中用input获取的文件，属性下面有files的数组，里面文件是以二进制的形式存放的，还有文件的类型、名称和路径等。

所以想着能不能在移动设备上把获取的文件转成二进制的形式再通过post上传，然后看了看插件，插件中有很多方法，可以以各种形式获取文件：

Base64: readAsDataURL(url,filename)

文件流:readAsBinaryString(url,filename)

ArrayBuffer:readAsArrayBuffer(url,filename)

fileEntry:resolveLocalFilesystemUrl(fileurl) 注意：里面还有个getFile(directoryEntry, filename, flags)方法返回的和这个一模一样

这些方法返回的都是promise对象

用这些方法获取的文件都不是我要的形式，base64传虽然简单，但是体积会比文件大30%左右，而且也比较慢。

突然想到了Blob()对象，这不是用来处理二进制的吗？

查了下资料，可以先以base64的形式获取文件，或者把文件转换成base64

js提供了window.atob(base64)的方式对base64进行解码。再通过charCodeAt()的方式转成Uint类型。

    var bytes=window.atob(base64),      //解码  
    n=bytes.length,
    u8arr=new Uint8Array(n),
    while(n--){
        u8arr[n]=bytes.charCodeAt(n);   //将编码转换成Unicode编码
    }

我对这一操作做了封装

//文件处理
  dataURLtoBlob(dataurl) {
      let arr = dataurl.split(',');
      let mime = arr[0].match(/:(.*?);/)[1];// 结果：   image/png
      console.log("arr[0]====" + JSON.stringify(arr[0]));//   "data:image/png;base64"
      console.log("arr[0].match(/:(.*?);/)====" + arr[0].match(/:(.*?);/));// :image/png;,image/png
      console.log("arr[0].match(/:(.*?);/)[1]====" + arr[0].match(/:(.*?);/)[1]);//   image/png
      let bstr = atob(arr[1].replace(/\s/g, ''));
      let n = bstr.length;
      let u8arr = new Uint8Array(n);
      while (n--) {
          u8arr[n] = bstr.charCodeAt(n);
      }
      return new Blob([u8arr], {type: mime});//值，类型
  }

上传时的Content-Type不用设置，用formdata的形式上传会自动添加

image.png

Request Payload中的参数显示

image.png

参考：
js-用于上传的FormData与Blob
Blob对象