2014-10-29 94 views
1

我正在使用JSzip下载div的html。 div里面有图片(它们不是base64编码的)。有没有一种方法可以使用JSzip从他们的图像路径url下载文件?或者他们必须进行base64编码?使用JSzip从URL保存图像

我当前的代码是刚刚从JSzip网站(http://stuk.github.io/jszip/)所有你需要下载所有的图像与阿贾克斯的

var zip = new JSZip(); 
    var email = $('.Result').html(); 
    zip.file("test.html", email); 
    var content = zip.generate({type:"blob"}); 
    // see FileSaver.js 
    saveAs(content, "example.zip"); 

回答

1

首先,基本的演示代码。如果他们在同一个域名中,你很幸运,否则你需要CORS或代理。

var xhr = new XMLHttpRequest(); 

xhr.addEventListener('load', function(){ 
    if (xhr.status == 200){ 
     //Do something with xhr.response (not responseText), which should be a Blob 
    } 
}); 

xhr.open('GET', 'http://target.url'); 
xhr.responseType = 'blob'; 
xhr.send(null); 

当你有像你必须处理所有<img>的的src要么你使用Base64替换它们或转介他们到一个文件夹中,你已经把他们的文件夹中有JSZip

var reader = new FileReader(); 
reader.onload = function() { 
    showout.value = this.result; 
}; 
reader.readAsDataURL(xhr.response); 
0

你可能想尝试使用JSzip-utils它有一个调用只是为了从网址下载图片也看看JSzip文件中的例子,我发现它是非常好的。你可以找到工作example with code here.

这只是下载的一部分,我也用它来使用他们的图像源URL从社交媒体下载图像。

function urlToPromise(url) { 
return new Promise(function(resolve, reject) { 
    JSZipUtils.getBinaryContent(url, function (err, data) { 
     if(err) { 
      reject(err); 
     } else { 
      resolve(data); 
     } 
    }); 
}); 
} 
var zip = new JSZip(); 
zip.file(filename, urlToPromise(url), {binary:true}); 
zip.generateAsync({type:"blob"}) 
.then(function callback(blob) { 

    // see FileSaver.js 
    saveAs(blob, "example.zip"); 
});