【技巧】Ionic3多文件上传
关于ionic3多文件上传，网上资料非常少，特别是基于form方式的，有也大多因为代码过期而失效，因为有人问到，所以写一下。 因为写blog的网络环境打不开ionic的官网，所以链接都是指向github
文件上传，我们一般需要和本地文件打交道，先安装file插件（全称cordova-plugin-file）,
执行以下命令安装file插件及其对应的ionic-native模块：
ionic cordova plugin add cordova-plugin-file npm install @ionic-native/file --save
用时ts头部先导入：
import { File } from '@ionic-native/file';
接着构造函数注入File
constructor(private file:File){}
然后可以用两种方式实现：
fileTransfer插件 vs form上传
1、fileTransfer
先执行以下命令安装fileTransfer插件（全称cordova-plugin-file-transfer）及其对应的ionic-native模块：
ionic cordova plugin add cordova-plugin-file-transfer npm install @ionic-native/transfer --save
其中，fileTransfer提供三个方法：
upload: Sends a file to a server. download: Downloads a file from server. abort: Aborts an in-progress transfer.
直接按文档说明调用即可，它的特点是只支持一个文件的操作，所以相应后台服务只接收一个文件的处理，上传多个文件就多次调用，而每个方法是一个promise的异步操作，常规情况，把多个promise最后做一个同步即可。
单文件上传
多文件上传同步
2、form上传
上述上传文件方法，需要发送多次网络请求，有些人不喜欢这样，想一次性上传所有文件，那可以构建一个多个文件的表单数据提交。
首先，先写一个方法读取文件为form表单可识别的blob格式：
读取文件为blob格式
然后调用该方法构建form表单数据并上传提交：
构建表单数据并一次上传
其中这里要注意的是，后台接口服务要接收多个文件处理。commonProvider为封装的http请求方法，请求头为{'Content-Type':'multipart/form-data'}，另外代码完全可以不使用cacheData变量，直接在filePaths.foreach里面就构建formData，这样就省下一些代码，而我是因为其它原因保留这种写法。
当然也可以像fileTransfer一样，发送多次请求上传：
构建表单数据并多次上传
最后我建议把上述方法封装到一个provider里面，这样即方便维护和调用，也利于其它项目使用。