When developing a website/web app on localhost which makes requests to another server, you might run into Cross Origin Resource Sharing (CORS) issues. I won’t go into too much detail about what CORS is in this post. All I will say is that CORS exists for security reasons, but when you’re developing locally it can be a pain! You can read more about CORS on the MDN docs.
I have written this simple guide to explain the two main solutions for disabling cross origin restrictions on localhost (and therefore fixing any CORS errors whilst developing your app locally), which I will explain in more detail below.
1. Disable CORS in the browser
You can directly disable CORS in the browser. If you do this, please be aware that you are disabling security restrictions which are there for a reason. I wouldn’t recommend browsing the web with CORS disabled; Just disable it whilst developing your website/app.
Chrome (on Mac):
The most reliable way to disable CORS in the latest version of Chrome on Mac (tested on v84) is to run it with web security disabled.
- Force quit Chrome by going to the mac menu and pressing “force quit” (or pressing command Q).
- Then run this command to open Chrome with web security disabled
#javascript-tips #cors #front-end-development #javascript #web-development
