使用 PhoneGap 下载文件并在 AngularJS 中使用

Posted 2023-03-14

【中文标题】使用 PhoneGap 下载文件并在 AngularJS 中使用

【英文标题】：Download file with PhoneGap and use within AngularJS

【发布时间】：2014-06-02 12:42:37

【问题描述】：

我正在使用 AngularJS 构建一个 PhoneGap/Cordova 应用程序。我花了很多时间来找出如何成功地将远程文件下载到设备上。这是我的代码：

download: function() 
    console.log('start download');
    var remoteFile = "http://remoteserver.domain";
    var localFileName = "file.json";

    window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, function(fileSystem) 
        fileSystem.root.getFile(localFileName, create: true, function(fileEntry) 
            var localPath = fileEntry.toURL();
            var ft = new FileTransfer();
            ft.download(remoteFile,
                localPath, 
                function(entry)console.log(entry), 
                function(error)console.log(error.code)
            );
        , function(error)console.log(error.code));
    , function(error)console.log(error.code));

对于 ios，FileSystem API 返回的文件的本机路径是我的应用程序的 Documents 文件夹。但是因为我正在使用 AngularJS 并且它在 Appname.app 文件夹内的 www 文件夹中运行，所以我不知道如何从 AngularJS 访问该文件，以便它也可以在 android 和支持的其他操作系统中开箱即用电话间隙。

所以我想要做的是要么告诉文件 API 将文件保存在 Appname.app/www 文件夹中，要么告诉 AngularJS 使用 ../Documents/ em> 文件夹，但不是特定于平台的。也许我可以使用完全不同的解决方案？

【参考方案1】：

我们已经在我们的应用中实现了类似的功能，下面的代码会让你了解它

    $rootScope.download = function(ii,catalogs)

    var len = catalogs.length;
    if(ii==len)
    
        localStorage.setItem("catalogdwnld", 1);

            if($rootScope.loadingmodal)
                $rootScope.loadingmodal.opened.then(function () 
                  $rootScope.loadingmodal.dismiss( "cancel" );
            );

        

    
    else if(ii < catalogs.length)


    var id = catalogs[ii].id;

    /**/

        if(catalogs[ii].parentId==0)
        
            window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, fileSystemSuccess, fileSystemFail);
                function fileSystemSuccess(fileSystem) 
                var directoryEntry = fileSystem.root; // to get root path to directory
                            directoryEntry.getDirectory("catalogs", create: true, exclusive: false, onDirectorySuccess, onDirectoryFail);
                            // root directory path
                            var rootdir = fileSystem.root;
                            var fp = rootdir.toURL();
                            // storing images in catalogs folder
                            fp = fp+"/catalogs/"+id+".png";

                            var fileTransfer = new FileTransfer();

                            fileTransfer.download($window.service_url+"/catalog/cover/"+id+"",fp,  
                                function(entry) 
                                        var native_url = entry.toNativeURL();
                                /*****  Store it in db *******/ 

                                ,
                                function(error) 
                                    navigator.notification.alert(
                                    'Download failed, please try again',
                                    null,         
                                    'Download Failed',   
                                    'OK');


                                
                            );
                
        

获取可以使用的根目录路径，

fileSystem.root;

我们将本机路径存储在数据库中，以便以后可以使用它来显示图像。如果你不让你的应用离线，那么你可以使用 html4\5 localstorage。

我们已经在android和ios中测试了上面的代码，所以它应该可以在平台上运行。

谢谢..

【讨论】：

谢谢，试试看！

【参考方案2】：

在 Cordova 中也有用于下载文件的 ng 服务。使用cordova 文件api。在 Android 和 iOS 上测试。提供下载单个文件或文件数组的方法。

https://github.com/verico/ng-cordova-file-downloader

【参考方案3】：

这个 AngularJS 模块使用 cordova 文件 API 并且不需要文件传输插件。您可以创建多个队列来下载文件，并在文件下载后执行任何操作，并且有很好的文档记录。

downgularJS - https://github.com/kaikcreator/downgularJS