如何把服务器上的文件下载到本地，打开时，在本地打开

yuyunyun051

如何把服务器上的文件下载到本地，打开本地文件，当App退出时，本地文件删除。
                无纸化会议管理系统App端本地文件处理思路

一、准备工作C端开发文件下载服务，打开文件的地址如下：http://172.16.22.60:8080/wzhhy/file/download?path=/wzhhy/view/xheditorUpload/file/20170904/&name=测试113021.doc&aliases=测试113021.doc
其中，path是文件的存储路径，name和aliases是文件名称

二、App端的页面中点击文件名称，要先通过pc端的文件下载服务把文件下载到客户端本地，打开本地的文件。
var fileApi = require("$UI/system/components/justep/docCommon/fileApi");//先引入fileApi.js

Model.prototype.modelLoad = function(event){
                var self = this;
                var extension= this.params.extension;//文件后缀
                var url= this.params.url;//下载地址（pc端的文件下载服务地址）
                var name = this.params.name;//文件名称（不包含后缀）
                alert(name);
                if(extension=='jpg'||extension=='png'){//如果是图片，直接显示图片
                        var imageHtml="<img src='"+url+"' xid='image1' style='height:auto;width:100%;'></img>";
                        $(this.getElementByXid('div1')).append(imageHtml);
                }else if(extension=='doc'||extension=='docx'||extension=='pdf'||extension=='ppt'|| extension=='pptx'|| extension=='txt'||extension=='xlsx'||extension=='xls'){//如果是以上类型
                var fileFullPath =name+"."+extension;//文件名
                fileApi.download(url,fileFullPath).done(function(entry){//先把文件下载到本地
                 fileApi.browse(entry.toURL()).done(function(){//从本地打开文件
                                    justep.Util.hint("成功打开");
                                }).fail(function(){
                                    justep.Util.hint("打开出错");
                                });
        }).fail(function(error){
       });       
                }else if(extension=='mp4'){//如果是视频，通过video 组件打开
                   var html=" <video controls='controls'  preload='auto' loop='loop' src='"+url+"' type='video/mp4' style='width:100%;height:100%;'></video>";
                   $(this.getElementByXid('div1')).append(html);
                }
        };

fileApi.js
download : function(url,fileName,option){
                        alert("进入下载方法了");
                        var dtd = $.Deferred();
                        option = option || {};
                        fileName = encodeURIComponent(fileName);
                        var self = this;
                        var _url = this._toFullUrl(url);
                        if(typeof FileTransfer != 'undefined'){
                                //window.PERSISTENT
                                //window.TEMPORARY
                                this.getFS(window.PERSISTENT, 0).done(function(fileSystem){
                                        var ft = new FileTransfer();
                                        var destPath = cordova.file.externalRootDirectory+"wzhhy/downLoad/"+ fileName;//下载的文件在本地的保存路径
//resolveLocalFileSystemURL如果解析成功，代表本地已经存在该文件，把文件地址直接返回即可，如果解析失败，代表本地不存在该文件，需要重新下载，并把下载后的文件地址返回（）第二个参数代表解析成功，第三个参数代表解析失败
                                        window.resolveLocalFileSystemURL(destPath, function (dirEntry) {
                                                justep.Util.hint("客户端已经存在该文件，不需要重新下载。");
                                                        dtd.resolve(dirEntry);//把本地文件实体返回到dtd中，在页面中获取dirEntry，通过browse进行打开
                                        }, function() {
                                                justep.Util.hint("客户端没有该文件,需重新下载。");
                                                ft.download(_url, destPath, function(entry) {
                                                dtd.resolve(entry);//把本地文件实体返回到dtd中，在页面中获取dirEntry，通过browse进行打开
                                        }, function(err){
                                                dtd.reject(err);
                                        },false,
                                    {
                                        headers: {
                                            "Authorization": "Basic dGVzdHVzZXJuYW1lOnRlc3RwYXNzd29yZA=="
                                        }
                                    });
                                });
                                }).fail(function(){
                                        dtd.reject();
                                });
                        }else{
                                var downLoadFrame = $('#_downloadFrame');
                                if(downLoadFrame.length === 0){
                                        downLoadFrame = $('<iframe id="_downloadFrame"></iframe>').css('display','none').appendTo(document.body);
                                }
                                downLoadFrame.attr('src',_url);
                    dtd.resolve(_url);
                        }
                        return dtd.promise();
                },


browse:function(url,fileName, option){
                        var dtd = $.Deferred();
                        var self = this;
                        if(Browser.isX5App){
                                if(this._isLocalFile(url)){
                                        if(Browser.isAndroid){
                                                window.open(url,"_system");
                                                dtd.resolve(url);
                                        }else if(Browser.isIOS){
                                                window.open(url, '_blank', 'toolbarposition=top,location=no,enableViewportScale=yes');
                                                dtd.resolve(url);
                                        }
                                }else{
                                        url = this._toFullUrl(url);
                                        plugins.toast.showShortBottom("正在载入文件，请稍候。。。。");
                                        handleDocumentWithURL(function(){
                                                dtd.resolve(url);
                                        },function(err){
                                                dtd.reject(err);
                                        },url);
                                }
                        }else{
                                //TODO:支持浏览器中filesystem的文件浏览
                                window.open(url, '_blank');
                                dtd.resolve(url);
                        }
                        return dtd.promise();
                },
三、App退出时，本地文件删除
页面中引入fileApi.js
var fileApi = require("$UI/system/components/justep/docCommon/fileApi");//先引入fileApi.js

点击退出按钮的事件
Model.prototype.image3Click = function(event){
                        //退出APP
                        alert("确定要退出么？");
                        var fileFullPath ="简历.docx";
                 fileApi.deleteFile(fileFullPath).done(function(){
                 alert("删除成功");
        }).fail(function(error){
         alert("删除失败");
       });
                        navigator.app.exitApp();

        };

fileApi.js
deleteFile:function(fileName){//点击退出按钮，删除客户端的downLoad文件夹
                        var dtd = $.Deferred();
         window.resolveLocalFileSystemURL(cordova.file.externalRootDirectory+"wzhhy/downLoad/", function (dirEntry) {
                                dirEntry.removeRecursively(function() {//removeRecursively: 递归删除目录
                                        //说明：删除目录将会删除其下的所有文件及子目录 不能删除根目录，如果操作删除根目录将会删除目录下的文件及子目录，不会删除根目录自身。 删除目录成功通过succesCB回调返回，失败则通过errorCB返回。

                                        //remove: 删除目录,与removeRecursively是有区别的
                                    //entry.remove( succesCB, errorCB );
                                    //说明：以下情况删除目录将会导致失败： 目录中存在文件； 删除根目录； 删除目录成功通过succesCB回调返回，失败则通过errorCB返回。
                                        justep.Util.hint("文件删除成功");
                    dtd.resolve();
            }, function() {
                    justep.Util.hint("文件删除失败1");
        });
                        }, function() {
                                justep.Util.hint("文件删除失败2");
                });


                        return dtd.promise();
                },


以上代码仅供参考。

yuyunyun051

qq1242337204 发表于 2018-1-22 09:38
无法加载PDF文档

请先下载pdf阅读器

zzytxx

感谢分享！

qq1242337204

无法加载PDF文档

qiruiqq3

android手机，提示下载成功了，但是没有找到文件。

yuyunyun051

qiruiqq3 发表于 2018-3-8 10:53
android手机，提示下载成功了，但是没有找到文件。

文件类型是什么？我的目前也出现问题了，ceb文件找不到。其他的文件可以。

qiruiqq3

yuyunyun051 发表于 2018-3-20 16:40
文件类型是什么？我的目前也出现问题了，ceb文件找不到。其他的文件可以。 ...

音频。我的已经解决了，没有用此帖子的方法。
参考：https://cordova.apache.org/docs/ ... ordova-plugin-file/
fileTransfer.download

yuyunyun051

qiruiqq3 发表于 2018-3-21 17:42
音频。我的已经解决了，没有用此帖子的方法。
参考：https://cordova.apache.org/docs/en/latest/referen ...

能否分享下你的思路。

qiruiqq3

yuyunyun051 发表于 2018-3-22 15:05
能否分享下你的思路。

        var fileLocalPath;
        if(justep.Browser.isIOS){
                fileLocalPath = cordova.file.applicationStorageDirectory +'/Documents/audio/a.mp4';
        }else if(justep.Browser.isAndroid){
                   fileLocalPath = cordova.file.externalRootDirectory +'/Documents/audio/a.mp4';
        }
        var fileonlineuri = encodeURI('http://xxxx.mp4'); //下载地址,在线地址
        var fileTransfer = new FileTransfer();
        fileTransfer.onprogress = function(progressEvent) { //文件传输插件对象的进度方法调用
            var percentProgress = parseInt((progressEvent.loaded / progressEvent.total) * 100)+ "%"; //获取已下载和总大小的百分比
            $(self.getElementByXid("downloaddiv4")).html(percentProgress);
            if (progressEvent.lengthComputable)//获取浏览器返回HEAD信息包含CONTENT-LENGTH为TRUE 则执行下面
            {      
                    console.log(percentProgress);
                    $(self.getElementByXid("downloaddiv4")).html(percentProgress);
                //divProgress.css("width",percentProgress); //设置进度条的样式
                //divProgress.html(percentProgress);        //设置进度条里面的数字
            }
        };
        fileTransfer.download( //调用对象的下载方法，开始下载
            fileonlineuri,
            fileLocalPath,
            function(entry) {
                console.log("download complete: " + entry.fullPath);//下载完成后调用方法
                //这里下载完成后，将进度条隐藏或者写其他需要的代码
                //downLoadBtn.hide();
                $(self.getElementByXid("downloaddiv4")).html("download"+entry.fullPath);
            },
            function(error) {  //出错回调函数
                console.log("download error source " + error.source);
                console.log("download error target " + error.target);
                console.log("upload error code" + error.code);
                console.log(error);
            },
            false,
            {
                headers: {
                    "Authorization": "Basic dGVzdHVzZXJuYW1lOnRlc3RwYXNzd29yZA=="
                }
            }
        );

yuyunyun051

qiruiqq3 发表于 2018-3-22 15:19
var fileLocalPath;
        if(justep.Browser.isIOS){
                fileLocalPath = cordova.file.appli ...

哦哦,看明白了。谢谢