1

我在 Phonegap 中构建了一个离线应用程序，JSON 数据被推送并到达它需要去的地方。但是总是有一堆图像需要跟随，而 html5 缓存不会在应用程序关闭时看到它清除。我已经打破了我的掘金很长一段时间了。

问题是您要检查文件系统上是否存在图像。我选择使用“async:false”AJAX 调用来执行此操作，因此代码运行到一定程度。我没有使用phonegap（几乎是hack）方式，通过写入并将overwrite设置为false（这会产生错误）看到这是我不想处理的另一个异步函数（问题出在哪里：异步）。

另一个问题是Phonegap 浏览器一次最多允许3 次下载（查了一下）。我以前的功能遇到了这种崩溃，因为如果同时下载的数量很高，它只会切断下载图像，当时大约有 20 到 40 个（取决于大小）图像（当然，看到下载速度并不奇怪当您将其划分为多个下载时会直线下降）。

所以问题是，如何构建：

  1. 循环遍历 JSON 数据（图像变量）的函数。
  2. 同时下载三个（并设置元数据，因为 Apple 告诉它必须这样做）
  3. 从磁盘中删除不再需要的那些（就我所读到的，最后一个是整个 inet 的问题，所以我们将保持这个可选，因为现在我真的不再关心空间了）。
  4. 下载所有图像后应该运行一个函数。

我的代码：

var datadir = "";
var pics_at_the_time = 0;
var external_url_pics = "http://Folder on server where images are";

// new_config.pics holds the JSON data. Built: '[ key (same as id) { "id": 1234567890, "tld":"jpg" }'. id+'.'+tld = the image name. 

window.requestFileSystem( // get the root folder path
    LocalFileSystem.PERSISTENT,
    0,
    function(fileSystem) {
        datadir = fileSystem.root.fullPath;
    },
    function() {
        console.log("Could not get root FS");
    }
);

function fetch_images() {
    var len = new_config.pics.length; // amount of pictures that need to be here
    var all_in_counter = 0;
    $.each(new_config.pics,function(index,val){ // loop through all pics
        pic_exists(val);
    });
}

function pic_exists(val) {
    $.ajax({ // pic on disk or not
        async:false,
      url: 'file://'+datadir+'/'+val.id+'.'+val.tld, //or your url
      success: function(){
        var obj = val.id;
        delete new_config.pics.obj;
      },
      error: function(){
        var obj = val.id;
        delete new_config.pics.obj;
        downloadImage(val);
      }
    });
}

function downloadImage(val){
    if(pics_at_the_time < 3) { // only 3 at a time. else wait for a download to finish
        pics_at_the_time++;
        var ft = new FileTransfer();
        ft.download(
        external_url_pics+val.id+'.'+val.tld,
        datadir + "/" + val.id+'.'+val.tld,
        function(entry) {
            if(debug_console) { console.log("download complete: " + entry.name); }
            entry.setMetadata(function(metadata) { } , function(error) { console.log("Could not set meta data: "+val.id); }, { "com.apple.MobileBackup": 1}); // no apple cloudbackup for these pics. We can always re-download apparently
            pics_at_the_time--;
            fetch_images();
        },
        function(error) {
        if(debug_console) { console.log("download error target " + error.target); }
        pics_at_the_time--;
        fetch_images();
        });
    }
}

正如您可能知道的那样，代码不是很复杂，它肯定不会检查已经存在的图像。因为虽然这行得通，但看到它每次都重新循环，这远非完美，起初这似乎是个好主意。但现在我有了第二个想法。

显然感谢任何帮助

4

0 回答 0