Download multiple images into 1 zip file using javascript

  javascript, laravel

I am getting images or files from db in array using laravel but currently I am getting empty download folder when i click to download button not getting images or files into zip folder please help me how can do that ? thanks.

html view

 <a href="javascript:;"   class="download text-primary p-5" data-original-title="Download Files"  title=""   data-placement="top" data-toggle="tooltip" >
          <i class="fa fa-download" aria-hidden="true"></i>
          </a>

script

    let url="{{Config('yourstitchart.file_url')}}"
      //url = http://localhost/yourstitichart/yourstitichart.com/web/public/uploads/images/
 
      window.onload = function(event) {
        let val= document.querySelector('.download')
            

         let files= {!!$event->image_gallery!!}

       // let files=["zFbf2cGRPLTaXbqzA5VWt8FZTjhXkt4LoC041fIH.jpeg",
       // "ucy0WknOKMhuNtfqcRgmWUgpvp2IPKhU84lU2tAq.jpeg"]

        var zip = new JSZip();
  
      var folder = zip.folder("files");
  
    files.map(async item=>folder.file(url+item))

    val.addEventListener("click",(e)=>{

      zip.generateAsync({type:"blob"})

            .then(function(content) {

            saveAs(content, "example.zip");
      });
    });
      }
    },
  },

Source: Ask Javascript Questions

LEAVE A COMMENT