CODEWITHSUNDEEP
restangularcors
Vladimir Despotovic
Vladimir Despotovic

Reputation: 3505

I can't get the REST service response in Angular

Inside our company's VPN I can call the web service (which is a REST service) fine, on FF and Chrome. I need to connect to it from Angular 2 though. Now, I tried to call the REST service(which is inside VPN) from Angular 2, in several ways, and I am always getting the message about CORS("No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:4200' is therefore not allowed access. The response had HTTP status code 401." in Chrome and "Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://webwassvc-test.servizi.gr-u.it/essigEAIM/rest/monitoring/integrations/all?pag=1. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing)." in Firefox). I tried setting the about:config:security.fileuri.strict_origin_policy to false, and it didn't help. The sysadmin on the REST server end told me he opened the server for CORS (cross domain) calls, so I think the problem is on my end, but I don't know what can it be. Any advice, please?

UPDATE: I can access the REST service and get the data from it, through PHP as middleware (localhost/angular2_site/file.php), but not from angular directly (localhost:4200).

Upvotes: 1

Views: 2339

Answers (1)

Victor Godoy
Victor Godoy

Reputation: 1692

Another option it's to manage it with a proxy or load balancer.

If you are developing with anuglar-cli you can use the Proxy To Backend support of the angular-cli. --proxy-config

from the angular-cli readme:

Say we have a api server running on http://localhost:3000/api and we want all calls to http://localhost:4200/api to go to that server.

We create a file next to projects package.json called proxy.conf.json with the content

{
  "/api": {
    "target": "http://localhost:3000",
    "secure": false
  }
}

You can read more about what options are available here webpack-dev-server proxy settings

and then we edit the package.json file's start script to be

"start": "ng serve --proxy-config proxy.conf.json", now run it with npm start

So at the end you can call your services as:

getUsers() : Observable<any>{
  return this.http.get('/api/users').map(res => res.json());
}

Upvotes: 1

Related Questions