0

I am developing a mobile application in angularjs where I have to make call to web service. But, when I am making the call with $http.get it is giving the following error.

XMLHttpRequest cannot load http://example.com/First_Step.json. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://127.0.0.1:8020' is therefore not allowed access.

My function for this is as follows:

$scope.firstStepClick = function() {
    appSvc.selectedItem = "firstStep";
    $rootScope.go('parent/firststep', 'slideLeft');
    delete $http.defaults.headers.common['X-Requested-With'];            
    $http.get("http://example.com/First_Step.json").success(function(data) {
        $scope.firstStepData = data;
    }).error(function() {
        alert("an unexpected error occured");
    });
};

So, please help me to solve this CORS problem. I am using html5, css3 and angularjs for this mobile app development.

Thanks in advance

Anindya
  • 41
  • 1
  • 13

2 Answers2

5

You don't have to do anything in the Angular side.

The server side is the one responsible to send the rights headers to enable CORS

Take a look a this:

http://enable-cors.org/server.html

cuttlas
  • 971
  • 5
  • 17
  • and how will I do that. ie, how will I add header to enable CORS. – Anindya Jun 27 '14 at 08:15
  • Well, it depends on which technology you are using in the backend. There are examples for a lot of them in the link that I attached in the answer. – cuttlas Jun 27 '14 at 08:25
1

apache:

http://enable-cors.org/server_apache.html

nodejs

res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Headers", "Content-Type");

apache sling

http://sling.apache.org/apidocs/sling5/org/apache/sling/api/servlets/SlingSafeMethodsServlet.html#doOptions(org.apache.sling.api.SlingHttpServletRequest,org.apache.sling.api.SlingHttpServletResponse) utilise doOptions and return Allow

unfortunatelly I'm not an apache sling expert and that's how much i was able to google, check your network tab, the first call to your server is a 'OPTIONS' call which returns what options are allowed it should return * or specific ones like 'get' or 'post' depending on needs then the reall call will be made

maurycy
  • 8,455
  • 1
  • 27
  • 44