XMLHttpRequest cannot load - No 'Access-Control-Allow-Origin'

ionic-v1
1

Dear Friends,

i’m new in ionic and angular. Before now I’m developing webApp with intel framework and jqm and making succesfull ajax call to php and asp page adding
for php:

header('Access-Control-Allow-Origin: *');

for asp:

response.addHeader "Access-Control-Allow-Origin", "*"
response.addHeader "Access-Control-Allow-Credentials", "true"

but with ionic I have the problem of No ‘Access-Control-Allow-Origin’ …
I also add in web.config of the server

<httpProtocol>
     <customHeaders>
       <add name="Access-Control-Allow-Origin" value="*" />
     </customHeaders>
   </httpProtocol>

but it’s same… why with other app works fine???

2

Previously in jqm were you using a standard GET request or JSONP to query your server?

If you are are getting this error now in Angular using a GET, you could try JSONP, but I agree, if GET was working before and now it’s not that seems strange.

3

This is my code for asp page:

  $scope.doLogin = function() {
	  $http.post('http://www.digitalxp.it/appwork/include/login.asp?username='+$scope.loginData.username+'&password='+$scope.loginData.password, $scope.loginData).success(function(data, status, headers, config){if (data.msg != ''){$scope.msgs.push(data.msg)} else {$scope.errors.push(data.error)}; $state.go("logoutMenu.mappa")}).error(function(data, status){$scope.errors.push(status)});

and that for php page:

$scope.SignUp = function() {
		$scope.errors.splice(0, $scope.errors.length); // remove all error messages
		$scope.msgs.splice(0, $scope.msgs.length);

	$http.post('http://www.digitalxp.it/appwork/include/register.php', {'uname': $scope.username, 'pswd': $scope.password, 'email': $scope.useremail}
	).success(function(data, status, headers, config) {
		alert($scope.username);
		if (data.msg != ''){$scope.msgs.push(data.msg)}
		else {$scope.errors.push(data.error)};$state.go("logoutMenu.mappa");
	}).error(function(data, status) {$scope.errors.push(status);});
}
4

OK, so it’s a POST request. jqm uses simple POST requests but AngularJS uses pre-flighted POSTs.

See http://stackoverflow.com/questions/24083329/angularjs-cannot-send-post-request-with-appropiate-cors-headers

You need to enable CORS on the server side to allow the pre-flighted POST that Angular is sending - not sure what you need to add to enable this though - sorry.