ทำไม FileSaver saveAs จะไม่ทำงานกับ JSZip?

ครั้งแรกที่โพสข้อความนี่คือทั้งรหัส(ส่วนใหญ่ของมันฉันพบออนไลน์และอาจจะเดาะนิดหน่อของบางอย่างเพื่อรับใช้จุดประสงค์ของผ)แต่ยิ่งไปกว่านั้นของฉันเกิดข้อผิดพลาดคือไปทางตอนจบตอนที่ฉันเข้าใจแล้ว

Uncaught TypeError:ล้มเหลวในการประมวลผล'createObjectURL'กับ'ที่อยู่ URL':โอเวอร์โหลดความละเอียดล้มเหลว

ตอนที่ฉันแค่ใช้ saveAs(img_url,"img.png")ที่ตัวเลือกนี้เพื่อบันทึกกาแล็ปท็อก็โผล่ขึ้นมา แต่ฉันได้ข้อผิดพลาดฉันพูดถึงอยู่เหนือตอนที่พยายามจะใช้"เนื้อหา". ฉันต้อง filesaver และ jszip ในสคริปต์,ฉันแค่ไม่สามารถดูเหมือนจะหาทางแก้ไขข้อผิดพลาดซึ่งนั่นก็หยุดระหว่างประมวลผลอะไรมากกว่านั้น ขอโทษที่ยุ่งเหยิงรหัสจะรู้สึกซาบซึ้งใจอย่างมาช่วย

ส่วนหลักไปทางด้านล่างส่วนที่เหลืออยู่แค่ incase ใครบางคนอาจต้องการจะเห็น Theres ที่อยู่ url ที่ต้องแก้จุดเหลือจากนั้นก็วิ่งเครื่องมือสร้าง,ฉันแค่ไม่รู้ว่าทำไมมันไม่ยอมช่วย

!function() {
    function dataURLtoBlob(dataURL, type) {
      var binary = atob(dataURL.split(',')[1]),
          length = binary.length,
          binaryArray = new Uint8Array(length);
      for (var i = 0; i < length; i++) {
        binaryArray[i] = binary.charCodeAt(i);
      }
      return new Blob([binaryArray], {type: type});
    }

    var SolidImage = function() {
      var canvas = document.createElement('canvas'),
          ctx = canvas.getContext('2d');
      this.img = new Image();
      this.make = function(color) {
        canvas.width = 500;
        canvas.height = 500;
        
        ctx.fillStyle = color;
        ctx.fillRect(0, 0, canvas.width, canvas.height);
        ctx.fillStyle = "#FFFFFF";
        ctx.textAlign = "center";
        ctx.font = "bold 50px Courier New";
        ctx.fillText(color.substring(3), 250, 250);
        var dataURL = canvas.toDataURL('image/png')
        this.img.src = dataURL;
        if (this.blobURL) URL.revokeObjectURL(this.blobURL);
        this.blob = dataURLtoBlob(dataURL, 'image/png');
        this.blobURL = URL.createObjectURL(this.blob);
      }
    };
    
    var solidImage = new SolidImage(),
        button = document.getElementById('make'),
        result = document.getElementById('result'),
        link = document.createElement('a');
    
    link.setAttribute('target', '_blank');
    result.appendChild(solidImage.img);
    result.insertAdjacentHTML('beforeend', 'Save this image or<br>');
    result.appendChild(link);
    solidImage.img.width = 600;
  
    
    button.addEventListener('click', function(){
        var zip = new JSZip();
        console.log("after zip");
        //var img = zip.folder("rdm_imgs");
        //////////////////////////////////
        for (var i = 0; i < 1; i++) {
            setTimeout(function() {
        var rgb_r = Math.floor(Math.random() * (256+1)),
            rgb_g = Math.floor(Math.random() * (256+1)),
            rgb_b = Math.floor(Math.random() * (256+1)),
            random_color = "rgb(" + rgb_r + ", " + rgb_b + ", " + rgb_g + ")";
      var filename = random_color.replace(/\s/g, "") + '.png';
      solidImage.make(random_color);
      link.innerHTML = 'Download content ' + filename;
      var img_url = solidImage.blob;
      //console.log(img_url.replace(/^data:image\/(png|jpg);base64,/, ""));
      console.log(img_url);
      //link.setAttribute('href', img_url);
      //link.setAttribute('download', filename);
      result.className = 'generated';

      zip.file(filename, img_url);
            },i * 500)}
        console.log("after loop");
        var content = zip.generateAsync({type:"blob"});
        console.log("after zip generate");
        saveAs(content, "imgs.zip");
        console.log("after saveAs");
        //link.innerHTML = 'Download Contents.zip';
        //var img_url = solidImage.blobURL;
        //link.setAttribute('href', content);
        //link.setAttribute('download', "content.zip");
    });
  }();