Downloading multiple files and zip - Chrome extens

2019-02-07 08:25发布

Is it possible to download multiple images into the sandbox file system (without the "save as" dialog box, or at-max one saveas dialog) ?

after downloading them, i'd like to ZIP them into one.. is there any javascript archive library?

Thanks in advance..

2条回答
戒情不戒烟
2楼-- · 2019-02-07 08:34

You can access images as regular parts of some web-pages or download them separately by means of XMLHTTPRequests. After this you can zip them in a single archive using JSZip JavaScript library. The zip can be stored as a file without a "Save As" dialog (try the example on the site). Though I'm not sure why you need the sandbox.

There exist other JavaScript libraries for zipping, for example, some are mentioned in other SO answer.

查看更多
我只想做你的唯一
3楼-- · 2019-02-07 08:45

You can use zip.js for this. It does already have API for fetching contents to be zipped from HTTP (cf. zip.HttpReader constructor) and for writing generated zip on HTML5 filesystem (cf. zip.FileWriter constructor).

Here is an example using the filesystem API:

index.html file:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Zip JSON data from the BBC into HTML5 FileSystem</title>
</head>
<body>
  <script src="zip.js"></script>
  <script src="zip-fs.js"></script>
  <script src="zip-ext.js"></script>
  <script src="example.js"></script>
</body>
</html>

example.js file:

// create a zip virtual filesystem
var fs = new zip.fs.FS();

// add some files into the zip filesystem 

// add the "bbc-music.json" file in the root directory
fs.root.addHttpContent("bbc-music.json", 
  "http://www.bbc.co.uk/programmes/genres/music.json");
// add the "bbc-learning.json" file in the root directory
fs.root.addHttpContent("bbc-learning.json", 
  "http://www.bbc.co.uk/programmes/genres/learning.json");

// create a file named "test.zip" in the root directory of the HTML5 filesystem 
createFile("test.zip", function(fileEntry) {
  // export the zip content into "test.zip" file
  fs.root.exportFileEntry(fileEntry, function() {
    console.log("done");
  });
});

// function to create a file in the HTML5 temporary filesystem
function createFile(filename, callback) {
  webkitRequestFileSystem(TEMPORARY, 4 * 1024 * 1024, function(fs) {
    fs.root.getFile(filename, { create : true }, callback);
  });
}
查看更多
登录 后发表回答