Search code examples
javascriptangularcorsrxjshttp-status-code-405

CORS ISSUE in Angular2

I am using webpack angular2 starter kit (https://github.com/AngularClass/angular2-webpack-starter) for my application and now i have an issue.

I try to make get call

getSomeData(): Observable<any> {
  let url =  here is my api URL;
  let headers = new Headers({ 'Content-Type': 'application/json; charset=utf-8', "Access-Control-Allow-Origin": "*", 'dataType': 'json', });
  let options = new RequestOptions({ headers: headers });

  return this._http.get(url, options).map(res => res.json());
}

And I have next error

XMLHttpRequest cannot load (my URL) Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access. The response had HTTP status code 405.

This Api (It using firebird) returns XML by default, maybe this cause a problem.

  1. How to make that always came JSON?
  2. How to fix this problem with CORS?
Solution

  • This issue is at the server side. The latter must return a Access-Control-Allow-Origin header in the response of the HTTP call.

    Most of time, there are tools you can plug into your server application to do this for you. The server knows that CORS headers must be returned when the client sends a Origin header (automatically added by the browser).

    See this article for more details about CORS: