js打包下载图片

引入jszip
jszip链接

<script src="./js/jszip.min.js"></script>

封装方法

  // 打包下载
    function zip(imgList,specimenIdList) {
				      var zip = new JSZip();
				      // 创建images文件夹
					  for(var i= 0;i<specimenIdList.length;i++){
							console.log(specimenIdList.length)
							 for (let j = 0; j < imgList[i].length; j++) {
								 let ii = i
							   getBase64(imgList[i][j]).then(function (base64) {
								 imgFolder = zip.folder(specimenIdList[ii]);
							     base64 = base64.split('base64,')[1]
							     imgFolder.file(specimenIdList[ii]  + '-' + j +'.png', base64, {
							       base64: true
							     })
								if (ii===specimenIdList.length-1) {
									zip.generateAsync({
									  type: "blob"
									}).then((blob) => {
									console.log(01)
									  saveAs(blob, "fossilImg.zip")
									})
								}
							   }, function (err) {
							     console.log(err); //打印异常信息
							   });
							 }
					  } 
				    }
					
					function getBase64(img) {
					  function getBase64Image(img, width, height) { //width、height调用时传入具体像素值，控制大小 ,不传则默认图像大小
					    var canvas = document.createElement("canvas");
					    canvas.width = width ? width : img.width;
					    canvas.height = height ? height : img.height;
									
					    var ctx = canvas.getContext("2d");
					    ctx.drawImage(img, 0, 0, canvas.width, canvas.height);
					    var dataURL = canvas.toDataURL();
					    return dataURL;
					  }
					  var image = new Image();
					  image.crossOrigin = '*';
					  image.src = img;
					  var deferred = $.Deferred();
					  if (img) {
					    image.onload = function () {
					      deferred.resolve(getBase64Image(image)); //将base64传给done上传处理
					    }
					    return deferred.promise(); //问题要让onload完成后再return sessionStorage['imgTest']
					  }
					}