作为一款app,下载文件功能,和打开文件功能,在某些场景下还是十分有必要的。使用cordova-plugin-file-transfer和cordova-plugin-file-opener2这两个插件能够在ionic比较容易的实现这个功能。
1、安装:
cordova plugin add cordova-plugin-file-transfer
cordova plugin add cordova-plugin-file-opener2
2、代码实现
angular.module("app").controller("accessoryDetailCtrl", ["$scope","$ionicLoading",
function ($scope $ionicLoading) {
"use strict";
$scope.downLoadFile = (downloadUrl) => {
let fileTransfer = new FileTransfer(),
uri = encodeURI(downloadUrl), // 文件的地址链接
fileUrl = cordova.file.dataDirectory + uri.substr(uri.lastIndexOf("/") + 1); // 文件的下载地址
fileTransfer.download(uri, fileUrl, entry => {
entry.file(data => {
cordova.plugins.fileOpener2.showOpenWithDialog(fileURL, data.type); // showOpenWithDialog使用手机上安装的程序打开下载的文件
});
console.log("download accessory successful. accessory information : " + JSON.stringify(entry));
}, error => {
console.error("download accessory fail. Because of : " + JSON.stringify(error));
});
fileTransfer.onprogress = function(progressEvent) { // 加载过程中的loading提示
const percentFinished = 99;
let downloadProgress = Math.round((progressEvent.loaded / progressEvent.total) * $scope.percentage);
$ionicLoading.show({
template: "正在下载" + downloadProgress + "%"
});
downloadProgress > percentFinished && $ionicLoading.hide();
};
};
}]);
3、注意事项
file-transfer除了支持下载还有上传文件的功能,下载的时候要注意的是下载的地址,ios和android可以路径是不同的,可以找出相同的路径,或者分别处理,这里使用的是cordova.file.dataDirectory,ios和android下载同一个路径
在使用file-opener2时,需要传入mineType,这个我们可以在file-transfer时获取。
file-opener2除了我们使用的showOpenWithDialog方法,还有open方法调用手机自带的打开功能,可以用来实现android的版本更新,下载新版本安装(以后有时间在写,网上的相关文档也很多)
另外还有uninstall和appIsInstalled功能,项目中没有使用,就不在研究了。
最后,在android7,android8上使用file-transfer插件有需要特殊的处理,详细可以查看一下github
cordova-plugin-file-transfer
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。