我有一个JavaScript数组,我想下载数组中的每个图像

时间:2019-08-20 20:50:21

标签: javascript arrays image hyperlink download

上下文:我的社交媒体上有很多图片。我想从社交媒体上下载所有图像,所以我制作了一个脚本,该脚本获取所有图像链接并将它们放置在一个数组中(脚本在控制台中执行)。到目前为止,它仅在Twitter上有效,并且每2秒滚动一次并获取新链接。

我想做的事情:我希望能够在不离开控制台的情况下浏览阵列并下载每个图像文件。我怎么做? (还可以下载视频)

我当然搜索了这个问题,但是我的知识有限。 我看到了一些有关下载标签的信息,但仅适用于html 可能有一种简单的方法,例如url.download,但我没有找到它

let timePassed = 0 ;
var listOfImages = [];
var videoThumb = "Video Thumb wasn't caught " ;
var timeToWait = 120 ; //You wait 120 before stopping scrolling and loging out the array 

var scroll = setInterval(function() { 
    timePassed += 2; //add 2 seconds to time passed 

    var getImage = document.querySelectorAll(".css-9pa8cd");    //Class that makes mhas the image with the url 

    for (let i = 2; i < getImage.length; i++) {
        let imageUrl = getImage[i].src ; 
        let newStrWithoutSmall  ; 

        if (imageUrl.includes("&name=small")) {
            if ((imageUrl.includes("video_thumb"))) {
                // To catch videos 
                videoThumb = "videoThumb was caught!";
            } else {
                // To catch the images they have &name=small in their url so we delete it 
                newStrWithoutSmall = imageUrl.substring(0, imageUrl.length - 11);
                listOfImages.push(newStrWithoutSmall);
            }
        }
    }

    if (timePassed > timeToWait) {
        clearInterval(scroll);
    }

    window.scrollBy(0,1000); // Scroll down by 1000px and 0on the side 
}, 2000);   //That means every 2 seconds 

var showListImageAndVideos = setTimeout(function() {    
        console.log(listOfImages); // Array of all of the images  
        console.log(videoThumb); // Array of all of the videos 
}, (timeToWait*1000)) //timeToWait

2 个答案:

答案 0 :(得分:0)

这可能适用于您的情况:

async function downloadFiles(array){
     array.map(async sUrl=>{

    await fetch(sUrl)
      .then(resp => resp.blob())
      .then(blob => {
        var fileName = sUrl.substring(sUrl.lastIndexOf('/') + 1, sUrl.length);
        const url = window.URL.createObjectURL(blob);
        const a = document.createElement('a');
        a.style.display = 'none';
        a.href = url;
        a.download = fileName;
        document.body.appendChild(a);
        a.click();
        window.URL.revokeObjectURL(url);
        document.body.removeChild(a);
      })
      .catch(() => {});
    })
    };

基于: http://pixelscommander.com/javascript/javascript-file-download-ignore-content-type/ Download File Using Javascript/jQuery 注意: 仅使用JDownloader这样的下载管理器可能会更好。

答案 1 :(得分:0)

在这里,您可以使用async / await使用获取功能在for循环中依次下载每个图像。

let timePassed = 0 ;
var listOfImages = [];
var videoThumb = "Video Thumb wasn't caught " ;
var timeToWait = 120 ; //You wait 120 before stopping scrolling and loging out the array 

function toDataURL(url) {
  return fetch(url).then((response) => {
    return response.blob();
  }).then(blob => {
    return URL.createObjectURL(blob);
  });
}

async function download(image) {
  const a = document.createElement("a");
  a.href = await toDataURL(image);
  a.download = image;
  document.body.appendChild(a);
  a.click();
  document.body.removeChild(a);
}

var scroll = setInterval( async function() { 
    timePassed += 2; //add 2 seconds to time passed 

    var getImage = document.querySelectorAll(".css-9pa8cd");    //Class that makes mhas the image with the url 

    for (let i = 2; i < getImage.length; i++) {
        let imageUrl = getImage[i].src ; 
        let newStrWithoutSmall  ; 

        if (imageUrl.includes("&name=small")) {
            if ((imageUrl.includes("video_thumb"))) {
                // To catch videos 
                videoThumb = "videoThumb was caught!";
            } else {
                // To catch the images they have &name=small in their url so we delete it 
                newStrWithoutSmall = imageUrl.substring(0, imageUrl.length - 11);
                listOfImages.push(newStrWithoutSmall);
                await download(newStrWithoutSmall);
            }
        }
    }

    if (timePassed > timeToWait) {
        clearInterval(scroll);
    }

    window.scrollBy(0,1000); // Scroll down by 1000px and 0on the side 
}, 2000);   //That means every 2 seconds