0

Context : I have an apache server working locally. I wanted to do a GET request in a specific script.

Client side : on my computer ipaddr :localhost:4200 (ng serve)

Server side : locally - 172.xx.xx.xx (LAMP)

But i got this message.

Blocage d’une requête multiorigines (Cross-Origin Request)

Sorry for the french copy/paste but it says something like this "blocked due to multi-origin request".

Http request part below with : http : HttpClient from @angular/core

this.http.get("localIP/script.php").subscribe((data) => {do stuff})

Commonly it's a server side issue. So i tried some stuff as :

  • adding headers server side :

     header('Access-Control-Allow-Origin: *');
 header('Access-Control-Allow-Methods: GET, POST, OPTIONS');
 header('Content-type: text/html; charset=UTF-8');    
 header('Access-Control-Allow-Headers: X-Requested-With');

  • Trying to do the request with POSTMAN => WORKING

  • Trying to do the request with AJAX => WORKING

  • Accesing the ressource from a webbrowser typing the Url => WORKING

Well, actually i use an AJAX call in my angular app, it's working, but I feel dumb doing this way. I don't get it why it's not working while all other methods work fine. The server side seems to be okay, if i can access by postman or browser. Looks like an angular issue. If someone has some idea to solve this problem, i'll be glad to hear it.

UPDATE 06-20 :

New try. Running my anuglar app locally with the port 80 instead of 4200, it works by doing the same get as mentioned in my post. I have already my apache server on this port, so it's not a good workaround.

UPDATE 06-29 :

I still don't know how to get out of this issue. I'm using ajax and the use of the "arrow function" for my success handler and error to be in my component scope, it does the job. When i will have some time, i will dig for a solution. I heard about reverse proxy stuff. Maybe after the build of the app it will work with charm.

UPDATE 15-09 : The error seems to be angular blocked the request without https if your app is in a https server. So to make it works, I generate my certificate for my local server and do request behind the HTTPS protocol.

Nico
  • 518
  • 2
  • 11
  • 1
    Does this answer your question? [How to add CORS request in header in Angular 5](https://stackoverflow.com/questions/47345282/how-to-add-cors-request-in-header-in-angular-5) – ale Jun 29 '20 at 10:41
  • I'have seen this post. The reverse proxy it's not what i'm looking for. [The 4th answer](https://stackoverflow.com/a/60176179/9705167) about the fetch seems to be a good way of doing it. I will check it when i have some time. – Nico Jun 29 '20 at 11:46

0 Answers0