0
267
ViewsFetching image from firebase produces CORS error
So I've uploaded an image onto my firebase, and I'm trying to retrieve it using javascript's fetch.
I've tried the solution here but it produces a CORS error.
I've also tried running python3 -m http.server inside the directory containing the html file but it produces a similar error.
Here's my code:
Index.html
<!DOCTYPE html>
<html>
<body>
<div id="myImg"></div>
<script src="script.js"></script>
</body>
</html>
script.js
fetch("https://firebasestorage.googleapis.com/v0/b/mvp1-354320.appspot.com/o/Parts%2F7.jpg?alt=media&token=c2049b23-b406-407c-b39e-86da7fcce764")
.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)
});
Here's my error message without running a python server
Error message while running python3 -m http.server
·
Santiago Gelvez
Answer question