JSZip 및 JS-Zip Utils로 이미지 다운로드 및 Zip으로 다운로드

Question

두 개의 이미지 파일을 다운로드하고 JavaScript 및 JSZip을 사용하여 단일 zip 파일에 저장하려고합니다. 그러나 이것은 빈 zip 파일을 리턴합니다. 내가 도대체 ​​뭘 잘못하고있는 겁니까? 나는 JSZip 및

function createZip() { 

//Create zip file object 
var zip = new JSZip(); 

//Add folders 

//Add files 
JSZipUtils.getBinaryContent("icons/8_Bit_Character.png", function (err, data) { 
    if(err) { 
     throw err; // or handle the error 
    } 
    zip.file("picture.png", data, {binary:true}); 
}); 

JSZipUtils.getBinaryContent("icons/16_Bit_Character.png", function (err, data) { 
    if(err) { 
     throw err; // or handle the error 
    } 
    zip.file("picture2.png", data, {binary:true}); 
}); 

//Compile all the data into memory. 
var base64 = null; 
if (JSZip.support.uint8array) { 
    promise = zip.generateAsync({type : "uint8array"}); 
} else { 
    promise = zip.generateAsync({type : "string"}); 
} 

//Generate the zip file and download it. 
zip.generateAsync({type:"base64"}).then(function (base64) { 
    location.href="data:application/zip;base64," + base64; 
}); 

} 

Answer 1

JSZipUtils.getBinaryContent 내부 함수가 비동기 적으로 일어나고 JSZip-의 Utils를 사용하고 있습니다. zip.generateAsync으로 전화하면 zip.file("picture.png", data, {binary:true});은 아직 발생하지 않았습니다. documentation에 Mini app : downloader 예에서 함수를 사용하여

var count = 0; 
....... 
JSZipUtils.getBinaryContent(imageUrl, function (err, data) { 
      if (err) { 
       // throw err; // or handle the error 
       console.log(err); 
      } 
      else { 
       zip.file(fileName, data, { binary: true }); 
       count++;      
       if (count == selectedImages.length) {       
        zip.generateAsync({ type: "blob" }).then(function (base64) {        
        // window.location.replace("data:application/zip;base64," + base64); 

         saveAs(base64, `archive.zip`); 

         console.log("inner"); 
        }); 
       } 
      } 
     }); 

Answer 2

시도 :

은 여기 내 예입니다. 이렇게하면 콘텐츠를 가져오고 해당 콘텐츠/이미지에 대한 약속을 반환합니다.

function urlToPromise(url) { 
return new Promise(function(resolve, reject) { 
    JSZipUtils.getBinaryContent(url, function (err, data) { 
     if(err) { 
      reject(err); 
     } else { 
      resolve(data); 
     } 
    }); 
    }); 
} 

zip.file(filename, urlToPromise(url), {binary:true});