使用JSzip从URL保存图像

问题描述：

我正在使用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");

答

首先，基本的演示代码。如果他们在同一个域名中，你很幸运，否则你需要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);

答

你可能想尝试使用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"); 
});

使用JSzip从URL保存图像

相关推荐