Skip to content

Instantly share code, notes, and snippets.

@genevera
Last active April 10, 2023 19:49
Show Gist options
  • Save genevera/61cc5205579941219e2614d828a13c35 to your computer and use it in GitHub Desktop.
Save genevera/61cc5205579941219e2614d828a13c35 to your computer and use it in GitHub Desktop.
Download all images from a webpage using Chrome/Brave/Edge/Safari/Firefox console
// taken from Patrick Brosset's entry located at
// https://devtoolstips.org/tips/en/download-all-images
// hosting here for postierity/to help ppl who might not have the google-fu
// to find it
$$('img').forEach(async (img) => {
try {
const src = img.src;
// Fetch the image as a blob.
const fetchResponse = await fetch(src);
const blob = await fetchResponse.blob();
const mimeType = blob.type;
// Figure out a name for it from the src and the mime-type.
const start = src.lastIndexOf('/') + 1;
const end = src.indexOf('.', start);
let name = src.substring(start, end === -1 ? undefined : end);
name = name.replace(/[^a-zA-Z0-9]+/g, '-');
name += '.' + mimeType.substring(mimeType.lastIndexOf('/') + 1);
// Download the blob using a <a> element.
const a = document.createElement('a');
a.setAttribute('href', URL.createObjectURL(blob));
a.setAttribute('download', name);
a.click();
} catch (e) {}
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment