Найти все blob по url blob и занести их в массив используя xhr

const lengthFiles = Object.keys(data[path]["media"]).length; //получаю количество url Blob
const blobArray = [];
let xhr = new XMLHttpRequest()
xhr.responseType = "blob"
//перебираю все url по порядку
for (let i = 0; i < lengthFiles; i++) {
  const blobURL = data[path]["media"][i]["preview"];
  xhr.open("GET", blobURL);
  xhr.send();
};
//выгружаю из буфера необходимый blob и заношу в массив blobArray
xhr.onload = function() {;
  const recoveredBlob = xhr.response;
  const reader = new FileReader();
  reader.onload = function() {;
    const blobAsDataUrl = reader.result;
    blobArray.push(blobAsDataUrl);
  };
  reader.readAsDataURL(recoveredBlob);
};
console.log(blobArray) // получаю только лишь один blob, вместо нескольких

const blobArray = [];
const urls = data[path]["media"];
 
Promise.all(
    urls.map(url => fetch(url["preview"])
        .then(resp => resp.blob())
        .then(blob => {
            blobArray.push(blob);
        })
        .then(() => {
            console.log(blobArray);
        })));