Foad Saeidi Nik Foad Saeidi Nik -4 years ago 123
AngularJS Question

Get null response in http get ionic

I'm developing a mobile app using ionic and angularjs. Every thing is so fine , but i don't know why when I'm trying to make a http get request , the failure mathod is called and data is null and the status is 0. What am I doing wrong ? Here is my app.js

angular.module('starter', ['ionic'])//, 'starter.controllers'])
.run(function($ionicPlatform) {

$ionicPlatform.ready(function() {
// Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
// for form inputs)
if(window.cordova && window.cordova.plugins.Keyboard) {
cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
}
if(window.StatusBar) {
StatusBar.styleDefault();
}
});
})

.config(function($stateProvider, $urlRouterProvider) {
$stateProvider

.state('login_page', {
url: '/login_page',
templateUrl: 'templates/login_page.html',
controller: 'LoginPageCtrl'
})
$urlRouterProvider.otherwise('/login_page');
})

.controller('LoginPageCtrl', function($scope , $http) {
$http.get('http://91.109.23.124:3000/api/v1/discounts.json').success(function(data, status, headers, config) {
console.log('success');
})
.error(function(data, status) {
console.log('error');
}) ;
})

Answer Source

0 is a vague status code and can mean a lot of things. See this answer for more information https://stackoverflow.com/a/26451773/1487831

So I created a plunker with your code http://plnkr.co/edit/2OWOxuI7kjEzcbOzp9lZ?p=preview

script.js

// Code goes here

angular.module('starter', []) //, 'starter.controllers'



.controller('LoginPageCtrl', function($scope, $http) {
  $scope.status = '';
  $scope.data = '';
  $scope.headers = '';
  $scope.config = '';
  $scope.showResponse = false;

  $http.get('http://91.109.23.124:3000/api/v1/discounts.json').success(function(data, status, headers, config) {
          $scope.showResponse = true;
      $scope.data = data;
      $scope.status = status;
      $scope.headers = headers;
      $scope.config = config;
  })
    .error(function(data, status,headers,config) {
      $scope.showResponse = true;
      $scope.data = data;
      $scope.status = status;
      $scope.headers = headers;
      $scope.config = config;
    });
})

index.html

<!DOCTYPE html>
<html ng-app="starter">

<head>
  <script data-require="angular.js@1.3.6" data-semver="1.3.6" src="https://code.angularjs.org/1.3.6/angular.js"></script>
  <link rel="stylesheet" href="style.css" />
  <script src="script.js"></script>
</head>

<body ng-controller="LoginPageCtrl">
  <div ng-if="!showResponse">
    <span>Requesting...</span>
  </div>
  <div ng-if="showResponse">
    <span>Request finished with </span>
    <span>status {{status}}</span> 
    <br/>

    <span>Url : {{config.url}}</span> 
    <br/>
    <span>method : {{config.method}}</span> 
    <br/>
    <span>Request : {{config.transformRequest}}</span> 
    <br/>
    <span>Response : {{config.transformResponse}}</span> 
    <br/>

    <span>Header : {{config.headers}}</span> 
    <br/>
  </div>
</body>

</html>

and it looks like you are having CORS issue.

If you have control at the server side. Include Access-Control-Allow-Origin to the response header and you should be good to go.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download