Logo

dev-resources.site

for different kinds of informations.

How to Run Google Chrome without CORS Error

Published at
10/25/2024
Categories
chrome
macos
windows
linux
Author
junian
Categories
4 categories in total
chrome
open
macos
open
windows
open
linux
open
Author
6 person written this
junian
open
How to Run Google Chrome without CORS Error

If you're a Web developer you probably have a task to test your REST API locally.
When you're using a browser like Google Chrome, you may experience some issues like the following message.

Access to fetch at 'http://localhost:8080/api' from origin 'http://localhost:8000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

Don't worry, it's actually a good security measure by modern web browsers.

I don't want to bother you with the details about CORS, you can read it on official documentation. But if you must know, here's the summary from wikipedia.

Cross-origin resource sharing (CORS) is a mechanism to safely bypass the Same-origin policy, that is, it allows a web page to access restricted resources from a server on a domain different than the domain that served the web page.

An example of a cross-origin request: the front-end JavaScript code served from https://example.com/ uses fetch() to make a request for https://example.org/api/data.json.

Fortunately, it's easy to bypass CORS restricton from Google Chrome. Just follow one of these guides based on the Operating System you're currently using.

How to Run Google Chrome without CORS on macOS

Open your Terminal and type the following command to start a new Google Chrome instance without CORS.

open -n "/Applications/Google Chrome.app" --args --user-data-dir="$HOME/chrome-dev-data" --disable-web-security
Enter fullscreen mode Exit fullscreen mode

How to Run Google Chrome without CORS on Windows 11

There are 2 kinds of command-line interpreters on Windows: PowerShell and Command Prompt (cmd.exe).
I personally prefer Windows Terminal on modern Windows and it's using PowerShell by default.

Here's how to start Google Chrome with CORS disabled with PowerShell.

. "C:\Program Files\Google\Chrome\Application\chrome.exe" --user-data-dir=C:\chrome-dev-data\ --disable-web-security
Enter fullscreen mode Exit fullscreen mode

If you're still using the Command Prompt / cmd.exe, you can start Google Chrome without CORS with the following command. Notice that I just simply removed the dot as the first character.

"C:\Program Files\Google\Chrome\Application\chrome.exe" --user-data-dir=C:\chrome-dev-data\ --disable-web-security
Enter fullscreen mode Exit fullscreen mode

How to Run Chromium / Google Chrome without CORS on Linux (Ubuntu, Debian, etc.)

On Linux, you can just open the Terminal and use the following command to open a Chrome window without CORS.

chromium --user-data-dir="$HOME/chrome-dev-data" --disable-web-security
Enter fullscreen mode Exit fullscreen mode

I personally use Chromium on a Linux system. If you're using Google Chrome, simply replace chromium with google-chrome.

Video

I also created a video to show you how to execute the command for each operating system.

Subscribe to Junian Dev YouTube channel

Conclusion

That's all I can show you.
You can start a Google Chrome window without CORS enabled and without polluting the main Google Chrome user data.

Thanks for reading and see you next time!

chrome Article's
30 articles in total
Favicon
Test your website in different Timezone
Favicon
Chrome starts to look cute now with its new Chrome MV
Favicon
The latest version of Chrome browser enable the solidWorks 3D ActiveX control
Favicon
Deploy Puppeteer As a Serverless API: Solutions Compared
Favicon
🎄 Instant Local Translation with Chrome 🌐
Favicon
8 AI-Powered Chrome Extensions to Save Hours of Manual Work 🧙‍♂️
Favicon
🔅 Adjust Page Brightness: Take Control of Your Screen's Luminosity
Favicon
The Best Chrome Heart Jeans for a Luxe Casual Look
Favicon
FREE: Password Generator ⚡ PRO (extension/add-on) + [source code]
Favicon
Chrome OS Guide to go from Zero to DevOps Hero in a nutshell
Favicon
Avoiding a "Host Permission" Review Delay When Publishing a Chrome Extension
Favicon
How to disconnect WebSocket from Chrome Developer tool
Favicon
How to Choose the Best Free VPN Chrome Extension for Your Needs
Favicon
Chrome Hearts Shirts: A Fusion of Luxury and Streetwear
Favicon
JSON Viewer Plus: The Last JSON Extension You'll Ever Need
Favicon
9 AI-Powered Chrome Extensions to Save Hours of Manual Work 🧙‍♂️🔥
Favicon
How to Run Google Chrome without CORS Error
Favicon
From WHOIS to SSL: How DNS Checker Pro Unveils the Hidden Details of Any Website
Favicon
How to Publish a Chrome Extension
Favicon
How to Launch Google Chrome Without CORS Protection on macOS
Favicon
Exclusive Chrome Hearts Ring: Unique Design for Bold Style
Favicon
Live Captions!
Favicon
Capture Browser XHR/Fetch API Response Automatically into JSON Files
Favicon
Learn Spanish Chrome extension
Favicon
17 Lesser Known Chrome Extensions You Wish You Knew Sooner 🤩⚡
Favicon
Resolving Issues from Unexpected Changes to `container-type: inline-size` in Chrome 129
Favicon
20 Best Chrome Extensions for Developers in 2024
Favicon
Going beyond the classic console.log
Favicon
How to create a Chrome extension
Favicon
Top 10 must have Chrome extension for webdevelopers

Featured ones: