How to bypass the cors message?

Question

I would like to make an HTTP request to a website with my Angular App. However, I get the error message

"Access to XMLHttpRequest at 'url1' from origin 'url2' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource."

How can I avoid this?

On the internet, I read that you can handle this with a proxy. Unfortunately, I did not succeed.

I can't change anything on the server.

getinfo(): void {
      this.http.get('url1' ).subscribe(data => {
        console.log(data);
        }
      );
  }

take a look at this https://daveceddia.com/access-control-allow-origin-cors-errors-in-angular/ — Fjordo, May 07 '19 at 07:41

score 0 · Answer 1 · answered May 07 '19 at 09:06

On a short note, whenever a http request is made between two different domains/host , we will be needing to whitelist the host/origin from which the request has come. This assures that the sender and reciever are aware of the hosts which it can access/use.

Solution Add "Access-Control-Allow-Origin" Header in your requests. Set the cors policy in the backend service as well

score -1 · Answer 2 · answered May 07 '19 at 07:43

Usually you can't do this without tweaking the api. This is browser protection. If you need this only for dev environment you can use this plugin for Firefox:

https://addons.mozilla.org/en-US/firefox/addon/cors-everywhere/

If you need this on production you need a some sort of proxy on your server, it is basicly a script where you send your requests from angular and it is passing by them to the real api. So you don't get the cors error. Important, the script must be under the same domain or you modify headers to allow cors.

In php you do this like this:

header("Access-Control-Allow-Origin: *");

https://github.com/softius/php-cross-domain-proxy https://gist.github.com/marcusasplund/0a67562ec775c461a53b

How to bypass the cors message?

2 Answers2