url to blob javascript code example

Example 1: url to blob js

fetch('https://upload.wikimedia.org/wikipedia/commons/7/77/Delete_key1.jpg')
  .then(res => res.blob()) // Gets the response and returns it as a blob
  .then(blob => {
    // Here's where you get access to the blob
    // And you can use it for whatever you want
    // Like calling ref().put(blob)

    // Here, I use it to make an image appear on the page
    let objectURL = URL.createObjectURL(blob);
    let myImage = new Image();
    myImage.src = objectURL;
    document.getElementById('myImg').appendChild(myImage)
});

Example 2: create file object from url typescript

fetch('//my-image-url')
      .then((e) => {
        return e.blob()
      })
      .then((blob) => {
        let b: any = blob
        b.lastModifiedDate = new Date()
        b.name = ''
        return b as File
      })
// Promise returning a File Object
// (usefull for previewing image in updating forms)