[英]Angular.js $http.post TypeError: Cannot read property 'data' of undefined
Angular.js v1.0.6 Angular.js v1.0.6
When making an $http.post and receiving a non 200 resposne (401 in this case) 制作$ http.post并收到非200 resposne(在这种情况下为401)
$http.post('http://localhost:3030/auth/login', {
username: 'username',
password: 'password'
})
.success(function(data) {
// Gets called on a 200 response, but not on a 401
console.log('success');
})
.error(function(err) {
// Never gets called & dies with error described below.
console.log('error');
});
Angular throws the following error: Angular会抛出以下错误:
TypeError: Cannot read property 'data' of undefined
at http://localhost:9000/components/angular/angular.js:8891:22
at wrappedCallback (http://localhost:9000/components/angular/angular.js:6797:59)
at http://localhost:9000/components/angular/angular.js:6834:26
at Object.Scope.$eval (http://localhost:9000/components/angular/angular.js:8011:28)
at Object.Scope.$digest (http://localhost:9000/components/angular/angular.js:7876:25)
at Object.Scope.$apply (http://localhost:9000/components/angular/angular.js:8097:24)
at done (http://localhost:9000/components/angular/angular.js:9111:20)
at completeRequest (http://localhost:9000/components/angular/angular.js:9274:7)
at XMLHttpRequest.xhr.onreadystatechange (http://localhost:9000/components/angular/angular.js:9244:11)
And never calls the either the .success()
callback or .error()
errback making it impossible to handle the response. 永远不会调用.success()
回调或.error()
使得无法处理响应。
Am I doing something wrong? 难道我做错了什么? The success call back gets called as expected on provision of legit credentials. 成功回调在提供合法凭证时按预期调用。
200 response: 200响应:
Access-Control-Allow-Headers:Content-Type, Authorization, Content-Length, X-Requested-With, Auth-Token
Access-Control-Allow-Methods:GET,PUT,POST,DELETE,OPTIONS
Access-Control-Allow-Origin:*
Connection:keep-alive
Content-Length:99
Content-Type:application/json
Date:Thu, 16 May 2013 13:57:51 GMT
{
"auth-token":"676932cc1e183a64334345944ad432d1908f8110bc",
"user": {
"id":1,
"username":"username"
}
}
401 response: 401响应:
Access-Control-Allow-Headers:Content-Type, Authorization, Content-Length, X-Requested-With, Auth-Token
Access-Control-Allow-Methods:GET,PUT,POST,DELETE,OPTIONS
Access-Control-Allow-Origin:*
Connection:keep-alive
Content-Length:45
Content-Type:application/json
Date:Thu, 16 May 2013 13:58:25 GMT
{
"error": [
{
"message":"Invalid Credentials"
}
]
}
Further, if I adopt the normal promise syntax in favour of the .success() shortcuts I get some interesting behaviour: 此外,如果我采用普通的promise语法来支持.success()快捷方式,我会得到一些有趣的行为:
$http.post('http://localhost:3030/auth/login', {
username: username,
password: password
}).then(function (resp) {
// On a 200 response, resp is a response object.
// On a 401 response, resp is undefined.
console.log(resp);
}, function() {
console.log('error');
});
Finally got to the bottom of this. 终于到了底。 The problem was due to the following global HTTP interceptor implementation: 问题是由于以下全局HTTP拦截器实现:
'use strict';
// register the interceptor as a service
angular.module('imvgm')
.factory('httpInterceptor', ['$q', '$rootScope', function($q, $rootScope) {
function success(response) {
return response;
}
function error(response) {
var status = response.status;
if (status === 401) {
$rootScope.$broadcast('event:loginRequired');
return
}
// otherwise
return $q.reject(response);
}
return function(promise) {
return promise.then(success, error);
};
}]);
NB NB
if (status === 401) {
$rootScope.$broadcast('event:loginRequired');
return // Returns nothing
}
FIX: 固定:
if (status === 401) {
$rootScope.$broadcast('event:loginRequired');
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.