9

I keep getting the below error when developing my ionic app. It's an authorization header not allowed by the backend.

enter image description here

Solutions tried:

enter image description here

  • as well as started chrome disabling web security as below

open -a Google\ Chrome --args --disable-web-security --user-data-dir

but I still can't bypass cors check, the error persists. Need some help.

ir2pid
  • 5,604
  • 12
  • 63
  • 107

5 Answers5

38

If you want to disable the CORS on chrome on mac you can run this command on your terminal/Item. it will open a new instance of chrome and all the tabs of this instance will have disabled the CORS. So you can run your application here for testing. I hope this you are doing just for testing your APIs and you know this is not a permanent fix. Also, remember this is disabling your web security. so I think this is a good option for testing your API when you are not worried about the security and you will have all the web security place when you are going to run your application on another environment like dev, and qa, and prod.

open -n -a /Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --args --user-data-dir="/tmp/chrome_dev_test" --disable-web-security
Seeta Ram Yadav
  • 847
  • 9
  • 16
5

In terminal enter :

open -n -a /Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --args --user-data-dir="/tmp/chrome_dev_test" --disable-web-security
rjmunro
  • 27,203
  • 20
  • 110
  • 132
Suraj Kumar
  • 51
  • 1
  • 3
  • 1
    Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Jun 18 '22 at 07:43
3

Check the version of your Chrome browser. Probably it is one with a bug. Here are bug reports posted on May about this feature not working: https://bugs.chromium.org/p/chromium/issues/detail?id=857032

I have faced the same issue few weeks ago and here is how I managed to get disabled CORS: Firstly download the Chromium browser or Chrome canary browser, which are actually very good for developers (I user chromium, but it is up to you): https://www.google.com/intl/en/chrome/canary/ or https://download-chromium.appspot.com/

Then:

  • Install browser
  • If you run browser - close it and make sure that there is no more running instances
  • Then run it with such command: open -a ChromiumOrCanaryPathHere --args --disable-web-security --user-data-dir"

Now it should work. You probably will see warning message about security on the top of the window - that is OK.

P.S. Probably just updating chrome to latest version can help, but I prefer approach with separate browser as it is more secure because I can isolate not secure browser from my default browser.

Artem Arkhipov
  • 7,025
  • 5
  • 30
  • 52
  • 2
    thank you, Canary release works! Tried upgrading the regular chrome flavor and launched with disabled security, but that didn't help. – ir2pid Aug 19 '19 at 07:59
3

Just a heads up to folks reading this in 2022:

This trick still works, but you have to do an extra step.

  • Open Chrome (or any Chrome Derivative like Canary) via terminal and open -n -a /Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --args --user-data-dir="/tmp/chrome_dev_test" --disable-web-security
  • Inside of Chrome, open the Privacy & Security Settings (chrome://settings/security) and set the browser to "No Protection" or custom equivalent)

To summarize, you can no longer just open Chrome from the terminal with the argument and expect the CORS bypass to work in my experience.

Cheers

My machine is using Google Chrome Canary Version 106.0.5223.0 (Official Build) canary (arm64) as of writing this.

notdan
  • 31
  • 6
1

CORS needs to be handled from the backend, Mostly is use this extension and it works https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi?utm_source=chrome-ntp-icon but still backend needs to handle CORS for ionic applications

Agha Ali Abbas
  • 195
  • 1
  • 10