0

We are developing a web application using AngularJS in which we want to call few rest api services from another application. It is a cross domain request, so we are not able to call it and we are getting the below error . (en.wikipedia.org/wiki/Same-origin_policy))

XMLHttpRequest cannot load http://appserver:9090/checkAndUpdate. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access. The response had HTTP status code 400.

We are using the angular service from our typescript module (docs.angularjs.org/api/ng/service/$http) like below,

////////

 static $inject = ["$http"];



    constructor(private $http: ng.IHttpService) {

    }



    public testApi(): ng.IPromise<any> {



        var baseUrl = "http://appserver:9090";

        var data  = {requestData};

        var response = this.$http.post(url+"/checkAndUpdate", data);

        return response;

    }

/////

We would like to know what is the best way to achieve this by AngularJS, please direct us if there is any existing solution.

Thank you.

SriP
  • 15
  • 4
  • 3
    This isn't an AngularJS issue. You must enable CORS on your server. http://stackoverflow.com/questions/23823010/how-to-enable-cors-in-angularjs/23824093#23824093 – Anid Monsur Sep 02 '15 at 18:43

2 Answers2

0

The error is not caused by AngularJS. This is a problem with the headers in the API server response.

The API server must allow this communication with CORS. Do you control the API server?

Brandon Brooks
  • 271
  • 1
  • 6
  • It's a third party application our company is intended to use and we need to call their rest api services. So do we have to request them to modify their application to accept the request ?(we are not sure about if they do it) or is there any other way like using a proxy? – SriP Sep 02 '15 at 19:17
  • You could use a proxy which will communicate to the third party API and provide an internal API to which your application may communicate. Many public consumable API servers require signing up and utilizing some type of authentication to be included in the header of requests. – Brandon Brooks Sep 02 '15 at 19:53
0

It's obviously a CORS issue.

If it's a GET method request then you can use jsonp to overcome this issue.Remember jsonp only works for GET requests. If not then there are many ways to overcome this issue. One of them in Windows.PostMessage but it is not compatible with all browsers. The best approach would be to use reverseProxy and from your main domain and then proxy pass it to the sub-domain.

There are many ways to overcome CORS issue.You can just google it.

Ritt
  • 3,181
  • 3
  • 22
  • 51