leiless · March 12, 2022 23:42
diff --git a/blob_image_example.html b/blob_image_example.html
 <html>

  <body>
    <script>
      fetch('https://upload.wikimedia.org/wikipedia/commons/3/31/Red-dot-5px.png')
        .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;
          myImage.className = 'myImg';
          document.getElementById('myPanel').appendChild(myImage)
        });

    </script>
    <div id='myPanel'>
    </div>
  </body>

 </html>
	<html>

	<body>
	<script>
	fetch('https://upload.wikimedia.org/wikipedia/commons/3/31/Red-dot-5px.png')
	.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;
	myImage.className = 'myImg';
	document.getElementById('myPanel').appendChild(myImage)
	});

	</script>
	<div id='myPanel'>
	</div>
	</body>

	</html>