AngularJS: $ HTTP.GET viene annullato

Question

Sto cercando di utilizzare il servizio $ http di angularJS ma non sembra funzionare. Ho letto online su un problema del genere ma le soluzioni fornite non aiutano. Ho il seguente nel mio controller:

app.controller('Ctrl', function($scope, $http){  
    var url = http://someurl?name=foo; 
    $scope.submitRules = function(){ 
     $http({method: 'GET', url: url}). 
       success(function(data, status) { 
       $scope.status = status; 
       $scope.data = data; 
       }). 
       error(function(data, status) { 
       $scope.data = data || "Request failed"; 
       $scope.status = status; 
       }); 
    }; 
}); 

Sto usando questa versione di angularJS <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.1.4/angular.min.js"></script>

ogni volta che provo l'invio della richiesta dimostra che lo stato della richiesta è annullato. L'URL a cui sto inviando la richiesta funziona molto bene, ma non funziona in AngularJS. Qualcuno può aiutare?

Answer 1

Trovo tutto questo roba CORS confusionario. Ma cosa posso dire? Sono uno studente lento. Il problema che descrivi potrebbe essere risolvibile dal controller, ma penso che sia meglio impostare le cose direttamente al punto di entrata. Per esempio:

angular.module('myApp', ['ngResource', 'ui.bootstrap']). 
    config(function($httpProvider) { 

     // Enable CORS 
     $httpProvider.defaults.useXDomain = true; 
     delete $httpProvider.defaults.headers.common['X-Requested-With']; 

     ... 
    }); 

dato il codice che ci hai fornito, questo può anche funzionare (non testato):

app.controller('Ctrl', function($scope, $http, $httpProvider){  
    var url = http://someurl?name=foo; 
    $scope.submitRules = function(){ 

     // Enable CORS 
     $httpProvider.defaults.useXDomain = true; 
     delete $httpProvider.defaults.headers.common['X-Requested-With']; 

     $http({method: 'GET', url: url}). 
       success(function(data, status) { 
       $scope.status = status; 
       $scope.data = data; 
       }). 
       error(function(data, status) { 
       $scope.data = data || "Request failed"; 
       $scope.status = status; 
       }); 
    }; 
}); 

In entrambi i casi, tutta la magia accade in questi due linee:

$httpProvider.defaults.useXDomain = true; 
delete $httpProvider.defaults.headers.common['X-Requested-With']; 

Answer 2

Se non è CORS, che si possono verificare utilizzando il cromo con estensione CORS, cercare di impostare il timeout della richiesta:

app.controller('Ctrl', function($scope, $http){  
    var url = http://someurl?name=foo; 
    $scope.submitRules = function(){ 
     $http({ 
      method: 'GET', 
      url: url, 
      timeout: 50000 
     }). 
     success(function(data, status) { 
      $scope.status = status; 
      $scope.data = data; 
     }). 
     error(function(data, status) { 
      $scope.data = data || "Request failed"; 
      $scope.status = status; 
     }); 
    }; 
}); 

Impostazione $ httpProvider mai ha funzionato per me, è piuttosto questione di server.