移动端下载文件并打开对应程序查看

前言

在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;
 }