移动端下载文件并打开对应程序查看
前言
在vue中用h5+plus下载文件并自动打开相应的应用程序
一、使用步骤
1.前端下载文件并打开应用方法
export default{
//下载文件并查看
_downFile(item){
let docBizNo = item.docBizNo;
let docNo = item.docNo;
let docName = item.docName;
let FileSystemURL = _downloads/ + docName;
plus.io.resolveLocalFileSystemURL(FileSystemURL, function(entry) {
plus.nativeUI.showWaiting("下载中");
if(entry.isFile) {
entry.remove();
let dtask = plus.downloader.createDownload(config.url + "/getFileDownload?docNo=" + docNo + "&docBizNo=" + docBizNo, {
method: "GET",
filename:FileSystemURL //利用保存路径，实现下载文件的重命名
}, function(d, status) {
// 下载完成
if(status == 200) {
plus.nativeUI.closeWaiting();
plus.runtime.openFile(d.filename, {
}, function(e) {
//调用第三方应用打开文件
alert(打开失败,请确认是否安装相应程序);
});
} else {
plus.nativeUI.closeWaiting();
alert("下载失败");
}
});
dtask.setRequestHeader(Content-Type, application/json); // 设置POST请求提交的数据类型为JSON字符串
dtask.start();
}
}, function() {
let w = plus.nativeUI.showWaiting("下载中...");
let dtask = plus.downloader.createDownload(config.url+"/b/doc/getFileDownload?docNo=" + docNo + "&docBizNo=" + docBizNo, {
method: "GET",
filename:FileSystemURL //利用保存路径，实现下载文件的重命名
}, function(d, status) {
// 下载完成
if(status == 200) {
plus.nativeUI.closeWaiting();
plus.runtime.openFile(d.filename, {
}, function(e) {
//调用第三方应用打开文件
alert(d.filename)
alert(打开失败,请确认是否安装相应程序);
});
} else {
plus.nativeUI.closeWaiting();
alert("下载失败");
}
});
dtask.setRequestHeader(Content-Type, application/json); // 设置POST请求提交的数据类型为JSON字符串
dtask.addEventListener(statechanged, (task) => {
if (!dtask) {
return; }
switch (task.state) {
case 1:
w.setTitle("开始下载...")
console.log(开始下载);
break;
case 2:
w.setTitle("链接到服务器...")
console.log(链接到服务器...);
break;
case 3:
var progressVal = 0;
progressVal = Math.ceil(task.downloadedSize / task.totalSize * 100);
w.setTitle("下载文件中...("+progressVal+"%)")
break;
case 4:
console.log(监听下载完成);
w.setTitle("监听下载完成...")
break;
}
});
dtask.start();
});
},
}
2.调用方法
if (window.plus) {
fileApi._downFile(item)
}
3.后端下载方法
public ResponseEntity<byte[]> getFileDownload(String docNo, String docBizNo) {
ResultBean<Map<String,Object>> resultBean=new ResultBean<Map<String,Object>>();
ResponseEntity<byte[]> entity = null;
try {
entity = docFeign.getFileDownload(docNo, docBizNo);
} catch (Exception e) {
logger.error("获取文件出错", e);
}
return entity;
}