How to download multiple files and images in a Chrome extension.

content.js

// in your extension's background script
chrome.browserAction.onClicked.addListener(function(tab) {
  // inject the content script to the current tab
  chrome.tabs.executeScript(tab.id, {file: 'content.js'});
});

// listen for messages from the content script
chrome.runtime.onMessage.addListener(function(message, sender, sendResponse) {
  if (message.action == 'getImages') {
    // message.data is an array of image urls
    console.log(message.data);
    // do something with the image urls, such as download them
  }
});

// in your content script (content.js)
// get all the <img> tags in the document
var images = document.getElementsByTagName('img');
// create an empty array to store the image urls
var imageUrls = [];
// loop through the images and get their src attributes
for (var i = 0; i < images.length; i++) {
  var src = images[i].src;
  // optionally, you can filter the image urls by some criteria, such as size, type, etc.
  // for example, only get the jpg images
  if (src.endsWith('.jpg')) {
    // push the image url to the array
    imageUrls.push(src);
  }
}
// send the array back to the extension
chrome.runtime.sendMessage({action: 'getImages', data: imageUrls});

download.js

var fileURLs = ['http://www.test.com/img1.jpg', 'http://www.test.com/img2.jpg', 'http://www.test.com/img3.jpg'];
var zip = new JSZip();
var count = 0;
for (var i = 0; i < fileURLs.length; i++) {
  var xhr = new XMLHttpRequest();
  xhr.open('GET', fileURLs[i], true);
  xhr.responseType = 'blob';
  xhr.onreadystatechange = function() {
    if (xhr.readyState == 4) {
      var blob = xhr.response;
      var fileName = fileURLs[count].substring(fileURLs[count].lastIndexOf('/')+1);
      zip.file(fileName, blob);
      count++;
      if (count == fileURLs.length) {
        // all files are downloaded, create the zip
        zip.generateAsync({type: 'blob'}).then(function(content) {
          // use the chrome.downloads.downloadBytes method to download the zip file
          var zipName = 'download.zip';
          chrome.downloads.downloadBytes(content, {filename: zipName});
        });
      }
    }
  };
  xhr.send();
}

download2.js

var fileURLs = ['http://www.test.com/img1.jpg', 'http://www.test.com/img2.jpg', 'http://www.test.com/img3.jpg'];
var zip = new JSZip();
var count = 0;
for (var i = 0; i < fileURLs.length; i++) {
  var xhr = new XMLHttpRequest();
  xhr.open('GET', fileURLs[i], true);
  xhr.responseType = 'blob';
  xhr.onreadystatechange = function() {
    if (xhr.readyState == 4) {
      var blob = xhr.response;
      var fileName = fileURLs[count].substring(fileURLs[count].lastIndexOf('/')+1);
      zip.file(fileName, blob);
      count++;
      if (count == fileURLs.length) {
        // all files are downloaded, create the zip
        zip.generateAsync({type: 'blob'}).then(function(content) {
          // trigger the download of the zip file
          var zipName = 'download.zip';
          var a = document.createElement('a');
          a.href = URL.createObjectURL(content);
          a.download = zipName;
          a.click();
        });
      }
    }
  };
  xhr.send();
}