I’m trying to add an image to my HTML/CSS/JS Repl, but it won’t load for some reason, even though the same code loads the image perfectly fine when I download it as a zip file and run it locally.
I thought it might just be an issue with Chrome, but I tried it in Firefox as well and it still doesn’t work. It might be because the image I’m trying to load is from an external website, but I’m not sure why that would be an issue.
Here’s another Repl I made to demonstrate the issue
Any help is appreciated!
This seems to be a CORS problem.
You can either download the image, upload to your replit and reference it in your code.
Or use a proxy that bypass CORS to load the image.
Thanks for the reply!
Unfortunately I can’t really upload the image to my replit, because for the actual project I’m working on I need to randomly pick between hundreds of URLs, and downloading/importing all of them would take forever.
Also, I’m a complete noob to web dev haha, and I’m not exactly sure how to “use a Proxy that bypass CORS” and a google search wasn’t much help either
Usually the proxy will bypass certain restrictions like CORS. A common proxy for this is CORS Anywhere.
I picked this answer from Stackoverflow:
"CORS Anywhere helps with accessing data from other websites that is normally forbidden by the same origin policy of web browsers. This is done by proxying requests to these sites via a server (written in Node.js, in this case).
“To use the API, just prefix the URL with the API URL.”. That’s really all of it. So, instead of requesting
http://example.com, you will request
https://cors-anywhere.herokuapp.com/http://example.com. CORS Anywhere will then make the request on behalf of your application, and add CORS headers to the response so that your web application can process the response."
It does take up the website’s bandwidth when you hotlink images from them. Remove
/revision/latest and it works
Sorry I didn’t see your reply sooner, but that worked, thank you so much!
This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.