반응형
AngularJS $http 오류 함수가 호출되지 않았습니다.
간단한 코드가 있어요
$http.get("/api/test")
.success(function (data, status, headers, config) {
console.log(data);
return data;
}).error(function (data, status, headers, config) {
alert("error");
return status;
});
정상적으로 작동하지만 서버에서 404(찾을 수 없음)를 반납해도 에러 함수가 호출되지 않습니다...이 경우 상태 = 404의 '성공' 기능이라고 부릅니다.
그것이 맞습니까?
감사해요.
피들러:
Request
GET http://localhost:41234/api/test HTTP/1.1
Host: localhost:41234
Connection: keep-alive
Accept: application/json, text/plain, */*
X-Requested-With: XMLHttpRequest
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.22 (KHTML, like Gecko) Chrome/25.0.1364.172 Safari/537.22
Referer: http://localhost:41234/
Accept-Encoding: gzip,deflate,sdch
Accept-Language: pt-BR,pt;q=0.8,en-US;q=0.6,en;q=0.4
Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.3
Cookie: ASP.NET_SessionId=bd1b3rib5j4beub0xbuhb1hm; FormsAuthentication=xxxxx
Response
HTTP/1.1 404 Not Found
Cache-Control: no-cache
Pragma: no-cache
Expires: -1
Server: Microsoft-IIS/8.0
X-AspNet-Version: 4.0.30319
X-SourceFiles: =?UTF-8?B?RDpcUGVzc29hxvY2FyLkFwaVxhcGcg==?=
X-Powered-By: ASP.NET
Content-Length: 0
저도 같은 문제가 있었는데 솔직히 이 게시물의 힌트에 따라 잘못된 방향으로 가고 있습니다.따라서, 저는 제 사례/해결 방법을 공유함으로써 동일한 상황에 있는 다른 사람들이 시간을 절약할 수 있습니다.
Angular.js 1.2.14 + WebApi 2를 사용하고 있습니다. NotFound 상태에 대한 나의 응답:
Cache-Control:no-cache
Content-Length:0
Date:Sat, 15 Mar 2014 14:28:35 GMT
Expires:-1
Pragma:no-cache
Server:Microsoft-IIS/8.0
X-AspNet-Version:4.0.30319
X-Powered-By:ASP.NET
X-SourceFiles:=?UTF-8?B?QzpcU3ZpbHVwcG9EaXNjaXR1clxhcGlcTWFnMTRcYXBpXGxlc3Nvblw4NA==?=
보시다시피 Content-Lengnight:0이지만 괜찮습니다.
제 문제는 Angular.js 인터셉터를 잘못 사용했다는 것입니다. 특히 이런 것 말이죠.
responseError: function (result) {
// check something
return result;
}
예외 없이 결과를 반환하거나 약속을 거부하는 경우(문서에 기재된 대로) Angular는 내가 거부를 올바른 해상도로 변환하고 싶다고 믿게 하고, 그 후 성공 콜백이 호출됩니다.
다음과 같이 코드를 수정합니다.
responseError: function (result) {
// check something
return $q.reject(result);
}
문제는 웹 서버가 HTTP/1.1 사양에서 볼 수 있듯이 유효한 값임을 의미하는 내용 길이를 0으로 설정하고 있다는 것입니다.
또한 저는 JSFiddle에 오류와 성공 사례를 보여주는 예시를 만들었습니다.여기 보세요.
오류 예제의 머리글:
요청:
GET /error/ HTTP/1.1
Host: fiddle.jshell.net
Connection: keep-alive
Accept: application/json, text/plain, */*
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_8_3) AppleWebKit/537.31 (KHTML, like Gecko) Chrome/26.0.1410.65 Safari/537.31
DNT: 1
Referer: http://fiddle.jshell.net/danielcsgomes/cAMc6/1/show/
Accept-Encoding: gzip,deflate,sdch
Accept-Language: en-US,en;q=0.8
Accept-Charset: UTF-8,*;q=0.5
Cookie: csrftoken=4tNVNxC5v6BSq9yJCKkHlGFJBz3cClqd`
응답:
HTTP/1.1 404 NOT FOUND
Server: nginx/0.8.54
Date: Fri, 12 Apr 2013 00:38:07 GMT
Content-Type: text/html; charset=utf-8
Transfer-Encoding: chunked
Connection: keep-alive
Vary: Cookie
Content-Encoding: gzip
Angular를 사용하는 경우JS 버전 1.1.1 이상...
.json'을(를) 추가할 수 있습니까?
$http.get("/api/test.json")
.success(function (data, status, headers, config) {
console.log(data);
return data;
}).error(function (data, status, headers, config) {
alert("error");
return status;
});
그렇다면 다음을 사용하여 수정할 수도 있습니다.
myModule.config(['$httpProvider', function ($httpProvider) {
$httpProvider.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
}]);
보기 => 1.1.0에서 1.1.1로 업그레이드한 후 각진 JS가 실패함
조금 늦었을 수도 있지만...현재 Angular $http request는 다음과 같이 변경할 수 있는 전제 조건을 제시합니다.
$http({
method: "yourMethod",
url: "yourUrl",
data: {yourDataObj}
}).then(function (res) { //first function "success"
console.log(res.data);
}, function (err) { //second function "error"
console.log(err);
});
우리는 공장으로 게시물을 옮겼습니다. 우리는 $http를 테스트하는 것에 대해 별로 신경 쓰지 않습니다. 단지 성공이나 오류에 대해 어떤 일을 하는지에 대해서만 말입니다.
factoryModule.factory('GiftFactory', function ($http, Settings) {
var saveUrl = Settings.endpoints.saveUrl;
return {
createGift: function (data) {
var gift = { gift: JSON.stringify(angular.toJson(data.gift)) };
return $http.post(saveUrl, gift);
}
};
});
우리는 이를 이렇게 부릅니다.
$scope.submit = function () {
$scope.submitting = true;
GiftFactory.createGift($scope)
.success(function () {
$window.location = Giving.endpoints.indexUrl;
}).error(function() {
$scope.submitting = false;
alert('an error occurred');
});
};
다음과 같이 테스트합니다.
describe('donation controller', function () {
var $scope, q, window, controller;
beforeEach(module('giving.donation'));
beforeEach(inject(function ($controller, $rootScope, $q) {
$scope = $rootScope.$new();
window = {};
q = $q;
giftFactory = {};
controller = $controller('DonationController', { $scope: $scope, $window: window, GiftFactory: giftFactory });
}));
describe('submit', function () {
var deferred;
beforeEach(function () {
deferred = q.defer();
deferred.promise.success = function (fn) {
deferred.promise.then(
function (response) {
fn(response.data, response.status, response.headers);
});
return deferred.promise;
};
deferred.promise.error = function (fn) {
deferred.promise.then(null,
function (response) {
fn(response.data, response.status, response.headers);
});
return deferred.promise;
};
});
it('should redirect on success', function () {
//Arrange
Giving = { endpoints: { indexUrl: "/testurl" } };
giftFactory.createGift = function () {
return deferred.promise;
};
//Act
$scope.submit();
deferred.resolve({});
$scope.$apply();
//Assert
expect($scope.submitting).toBeTruthy();
expect(window.location).toBe('/testurl');
});
it('should set submitting back to false on error', function () {
//Arrange
Giving = { endpoints: { indexUrl: "/testurl" } };
giftFactory.createGift = function () {
return deferred.promise;
};
//Act
$scope.submit();
deferred.reject({});
$scope.$apply();
//Assert
expect($scope.submitting).toBeFalsy();
expect(window.location).toBeUndefined();
});
});
});
언급URL : https://stackoverflow.com/questions/15888162/angularjs-http-error-function-never-called
반응형
'source' 카테고리의 다른 글
| CentOS에서 Python.h 파일을 찾을 수 없습니다. (0) | 2023.10.24 |
|---|---|
| 단일 항목이 있는 배열로 변환 (0) | 2023.10.24 |
| 내 자바스크립트 파일의 캐싱을 방지하는 방법은? (0) | 2023.10.24 |
| Larravel 5에서 Expellent를 사용하여 피벗 테이블을 업데이트하는 방법 (0) | 2023.10.24 |
| 워드프레스에 모더니즈를 제대로 추가하는 것? (0) | 2023.10.24 |