admin管理员组

文章数量:1295866

I am trying to create a zip file using jsZip . The contents of the zip file are images from the web. I have created the following code. But when i run it all am getting is an empty zip file of 22kb.

<html>
<body>
  <script type="text/javascript" src="jszip.js"></script>
  <script type="text/javascript" src="FileSaver.js"></script>
  <script type="text/javascript" src="jszip-utils.min.js"></script>
  <script>
    var imgLinks = ["url1", "url2", "url3"];

    function create_zip() {
      var zip = new JSZip();
      for (var i = 0; i < imgLinks.length; i++) {
        JSZipUtils.getBinaryContent(imgLinks[i], function(err, data) {
          if (err) {
            alert("Problem happened when download img: " + imgLink[i]);
            console.erro("Problem happened when download img: " + imgLink[i]);
            deferred.resolve(zip); // ignore this error: just logging
            // deferred.reject(zip); // or we may fail the download
          } else {
            zip.file("picture" + i + ".jpg", data, {
              binary: true
            });
            deferred.resolve(zip);
          }
        });
      }
      var content = zip.generate({
        type: "blob"
      });
      saveAs(content, "downloadImages.zip");
    }
  </script>
  <br/>
  <br/>
  <center>
    Click the button to generate a ZIP file
    <br/>
    <input id="button" type="button" onclick="create_zip()" value="Create Zip" />
  </center>
</body>
</html>

(url1 , url2 and url3 replaced by image urls i want to download).

Why am i getting these empty zip files?

I am trying to create a zip file using jsZip . The contents of the zip file are images from the web. I have created the following code. But when i run it all am getting is an empty zip file of 22kb.

<html>
<body>
  <script type="text/javascript" src="jszip.js"></script>
  <script type="text/javascript" src="FileSaver.js"></script>
  <script type="text/javascript" src="jszip-utils.min.js"></script>
  <script>
    var imgLinks = ["url1", "url2", "url3"];

    function create_zip() {
      var zip = new JSZip();
      for (var i = 0; i < imgLinks.length; i++) {
        JSZipUtils.getBinaryContent(imgLinks[i], function(err, data) {
          if (err) {
            alert("Problem happened when download img: " + imgLink[i]);
            console.erro("Problem happened when download img: " + imgLink[i]);
            deferred.resolve(zip); // ignore this error: just logging
            // deferred.reject(zip); // or we may fail the download
          } else {
            zip.file("picture" + i + ".jpg", data, {
              binary: true
            });
            deferred.resolve(zip);
          }
        });
      }
      var content = zip.generate({
        type: "blob"
      });
      saveAs(content, "downloadImages.zip");
    }
  </script>
  <br/>
  <br/>
  <center>
    Click the button to generate a ZIP file
    <br/>
    <input id="button" type="button" onclick="create_zip()" value="Create Zip" />
  </center>
</body>
</html>

(url1 , url2 and url3 replaced by image urls i want to download).

Why am i getting these empty zip files?

  • javascript
  • jszip
Share edited Feb 28, 2021 at 12:46 Mosh Feu 29.3k18 gold badges93 silver badges141 bronze badges asked Jan 2, 2015 at 18:45 Sreeraj T ASreeraj T A 1521 gold badge2 silver badges9 bronze badges 2
  • do you have the fixed version of this? – Nick Garver Commented Sep 28, 2016 at 1:11
  • I just used a CORS proxy . " corsproxy./mangacow.co/wp-content/manga/29/172/0002.jpg" .. instead of the direct url i appended it to the free CORS proxy URL, and that solved the problem. – Sreeraj T A Commented Sep 30, 2016 at 13:09
Add a ment  | 

1 Answer 1

Reset to default 7

JSZipUtils.getBinaryContent is asynchronous : the content will be added after the call to zip.generate(). You should wait for all images before generating the zip file.

Edit :

If the files you are loading are on a different server, this server need to send additional HTTP headers, like Access-Control-Allow-Origin: server-hosting-the-page.. The Firefox or Chrome debug console will show an error in that case. The js library can't detect a CORS issue (see here) and will trigger a success with an empty content.

本文标签： javascriptAdding images from url to a zip file using jsZipStack Overflow

版权声明：本文标题：javascript - Adding images from url to a zip file using jsZip - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1741625446a2389054.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。