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.
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."