CODEWITHSUNDEEP
angularjsajax
Daga Arihant
Daga Arihant

Reputation: 484

unable to send Cross domain ajax requests with Angular

I am facing a problem in sending cross domain request to a web api(api.worldbank.org) . It says

No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://127.0.0.1' is therefore not allowed access.

So as someone suggested, i used this- 

app.config( function($httpProvider) {
        $httpProvider.defaults.useXDomain = true;
            delete $httpProvider.defaults.headers.common['X-Requested-With'];
        }
    );

but still the error is same and also no change occurs in headers with or without adding this code.

Complete code is this- 

'use strict';
    var app=angular.module('myapp',[]);
    app.config( function($httpProvider) {
        $httpProvider.defaults.useXDomain = true;
            delete $httpProvider.defaults.headers.common['X-Requested-With'];
        }
    );
app.factory('dataFactory',function($http){
        var O={};
        O.getLifeExpectancy=function(){
            var dataToSend={};
            $http({
                method:'GET',
                url:'http://api.worldbank.org/countries/in/indicators/SP.DYN.LE00.IN?format=json&date=2000:2015'

            }).then(function(data){
                dataToSend=data;
            });
            return dataToSend;
        };

Am i doing something wrong ? is $http and $httpProvider two different things, because no change is reflected in headers with or without app.config code.

here are my headers in both the situations-

Accept:application/json, text/plain, / Accept-Encoding:gzip, deflate, sdch Accept-Language:en-US,en;q=0.8 Cache-Control:max-age=0 Connection:keep-alive Host:api.worldbank.org Origin:127.0.0.1 Referer:127.0.0.1/myApp/ User-Agent:Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/51.0.2704.106 Safari/537.36

Upvotes: 2

Views: 1027

Answers (1)

Bartek Cichocki
Bartek Cichocki

Reputation: 661

This messages says that your server-side code doesn't allow request from different domain, so the best solution is to enable CORS with header Access-Control-Allow-Origin: '*' at the server-side.

EDIT: If your Angular app will run in browser - you need to set CORS server-side or just make some proxy on your domain (some browsers on default block such requests).

But if you're doing Cordova/PhoneGap mobile app you'll be able to disable it in config.xml so currently for testing purposes you can just disable it in your browser.

Upvotes: 1

Related Questions