<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>维修指南</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=0, maximum-scale=0.85, user-scalable=yes" />
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<link href="../css/mui.min.css" rel="stylesheet" />
<link rel="stylesheet" type="text/css" href="../css/mui.picker.min.css" />
<link href="../css/mui.poppicker.css" rel="stylesheet" />
<style>
html,
body {
background-color: #efeff4;
}
</style>
</head>
<body>
<header class="mui-bar mui-bar-nav">
<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
<h1 id="title" class="mui-title">维修指南</h1>
</header>
<div class="mui-content mui-scroll-wrapper">
<div class="mui-scroll">
<div class="mui-card">
<ul class="mui-table-view" id="treeMenu">
</ul>
</div>
</div>
</div>
<script src="../js/jq.js"></script>
<script src="../js/mui.min.js"></script>
<script src="../js/device_status.js"></script>
<script>
(function(jq, $, doc) {
var info = {};
info.type="directory";
info.fileName="";
info.filePath="";
$.init({
swipeBack: true
});
$.plusReady(function() {
getFileListInfo();
});
mui("#treeMenu").on('tap','.mui-table-view-cell',function(e){
info.type="file";
info.fileName = this.getAttribute("id");
info.filePath = this.getAttribute("val");
getFileListInfo()
})
mui("#treeMenu").on('tap','.download',function(e){
var infoDownload = {}
infoDownload.fileName = this.getAttribute("id");
infoDownload.filePath = this.getAttribute("val");
var routePath='/viewFile';
routePath=deviceStatus.getAddress()+routePath + '?fileName=' + infoDownload.fileName + '&filePath=' + infoDownload.filePath;
console.log(routePath)
var url = encodeURI(routePath);
//方式一
// var downToak =plus.downloader.createDownload(routePath, {retryInterval:10}, function(d, status){
// if(status == 200){
// var btnArray = ['否', '是'];
// mui.confirm('是否采用第三方方式打开？', '预览', btnArray, function(e) {
// if (e.index == 1) {
// plus.runtime.openFile(d.filename, {}, function(e) {//打开文件
// plus.nativeUI.toast('打开失败');
// });
// } else {
// }
// });
// }else{
// plus.nativeUI.alert("文件查看失败！");
// }
// });
// downToak.start();
//方式二
var wait = plus.nativeUI.showWaiting("正在打开文件...");
var dtask = plus.downloader.createDownload(url, {retryInterval:10}, function(d, status) {
if(status == 200) {
plus.runtime.openFile(d.filename, {}, function(e) {
wait.close();
mui.alert("无法打开此文件：" + e.emssage, "我的软件");
});
wait.close();
} else {
wait.close();
mui.alert("文件打开失败: " + status, "我的软件");
}
});
dtask.start();
})
function getFileListInfo(){
deviceStatus.FileGetListInfo(info,function(list, err){
if(err){
$.toast(err);
return;
}
var menu = ''
mui.each(list,function(i,n){
menu = menu + treeMenu(n)
})
// console.log("menu:"+menu)
if(info.type=="directory"){
jq('#treeMenu').append(menu);
}
else{
jq('#'+info.fileName).empty();
menu = '<a class="mui-navigate-right" href="#">'+info.fileName+'</a>'+menu
jq('#'+info.fileName).append(menu);
}
});
}
function treeMenu(n){
var result = ''
if(n.children != undefined){
result = '<li class="mui-table-view-cell mui-collapse" id="'+n.label+'" val="'+n.path+'">'+
'<a class="mui-navigate-right" href="#">'+n.label+'</a>'
var childFile = ''
mui.each(n.children,function(i,n){
childFile = childFile + treeMenu(n)
})
result = result + childFile + '</li>'
}else if(n.size != undefined){
result = '<div class="mui-row mui-collapse-content">'+
'<p class="mui-col-sm-10 mui-col-xs-10" style="padding: 1%;">'+n.label+'</p>'+
'<p class="mui-col-sm-2 mui-col-xs-2 download" style="padding: 1%;color:blue;" id="'+n.label+'" val="'+n.path+'">查看</p>'+
'</div>'
}
return result
}
}($, mui, document));
//允许滑动
(function() {
mui('.mui-scroll-wrapper').scroll({
bounce: true, //是否启用回弹
indicators: true, //是否显示滚动条
deceleration: 0.0006
});
})();
</script>
<style>
</style>
</body>
</html>
Ajax
owner.FileDownload = function(info) {
var routePath='/viewFile';
// callback = callback || $.noop;
routePath=owner.getAddress()+routePath + '?fileName=' + info.fileName + '&filePath=' + encodeURI(info.filePath);
// var userId=owner.getUser();
// //创建访问参数
// var paraJson={};
// paraJson.userID=userId;
// paraJson.file_name=info.fileName;
// paraJson.file_path=info.filePath;
// var paraData=JSON.stringify(paraJson);
console.log(routePath)
var wait = plus.nativeUI.showWaiting("正在打开文件...");
var dtask = plus.downloader.createDownload(routePath, {retryInterval:10}, function(d, status) {
if(status == 200) {
plus.runtime.openFile(d.filename, {}, function(e) {
wait.close();
mui.alert("无法打开此文件：" + e.emssage, "我的软件");
});
wait.close();
} else {
wait.close();
mui.alert("文件打开失败: " + status, "我的软件");
}
});
dtask.start();
}；
以上为前端，以下为后端
@RequestMapping(value = "/viewFile",method = {RequestMethod.POST,RequestMethod.GET})
public void pdfStreamHandler(HttpServletResponse response,String fileName,String filePath) throws ServletException,IOException {
InputStream in = null;
String errorMsg=null;
String userID="-1";
try {
fileName =java.net.URLEncoder.encode(fileName,"UTF-8");很重要！！！如果没有这样编码文件名，下载的时候，如果是中文，下载文件名会乱码。
in = new FileInputStream(new File(filePath));//本地文件
String fileDirPath=uploadFileParentPath+fileName;
if(filePath==null || filePath.equals("")) {
filePath=fileDirPath;
}
File file=new File(filePath);
if(!file.exists()){
return;
}
// 重置response对象中的缓冲区，该方法可以不写，但是你要保证response缓冲区没有其他数据，否则导出可能会出现问题，
response.reset();
response.setContentType("bin");//application/octet-stream
// 直接下载时加attachment,预览时候不加
// response.addHeader("Content-Disposition", "attachment; filename=\""+fileName+"\"");
response.addHeader("Content-Disposition", "attachment; filename=\""+fileName+"\"");
byte[] buffer = new byte[1024];
int length;
while ((length = in.read(buffer)) > 0) {
response.getOutputStream().write(buffer, 0, length);
}
} catch (Exception e) {
// logger.error("下载文件出错", e);
e.printStackTrace();
} finally {
if (in != null) {
try {
in.close();
} catch (IOException e) {
}
}
}
}