gpt4 book ai didi

AngularJS $http 错误的 http 状态错误

转载 作者:可可西里 更新时间:2023-11-01 15:13:28 27 4
gpt4 key购买 nike

我正在尝试使用 AngularJS 的 $http 服务构建 JSONP 请求,但出现错误时,我收到了错误的 http 状态代码 404 而不是 500,并且页面正文也丢失了。

场景是这样的:

我调用的 URL 返回 500 内部服务器错误,JSON 输出包含错误消息:

http://private.peterbagi.de/jsfiddle/ng500status/api.php?code=500&callback=test

index.html
(查看实际效果:http://private.peterbagi.de/jsfiddle/ng500status/)

<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title></title>
<script src= "//ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script>
<script src= "app.js"></script>
</head>
<body ng-app="app" ng-controller="UploadController">
<button ng-click="upload(200)" value="OK">OK</button>
<button ng-click="upload(500)" value="Fail">Fail</button>
<pre>{{response | json}}</pre>
</body>
</html>

应用程序.js

var app = angular.module('app', []);

app.constant('BASE_URL','http://private.peterbagi.de/jsfiddle/ng500status/');

app.controller("UploadController", ['$scope','Upload','BASE_URL',
function($scope,Upload,BASE_URL) {

$scope.upload = function(code) {

Upload(code).then( function(response) {
$scope.response = response;
}, function(error) {
$scope.response = error;
} );
}
}]);

app.factory('Upload', ['$http','BASE_URL', function($http,BASE_URL) {
return function (code) {
var callUrl = BASE_URL + "api.php?code="+code;
return $http({
method: 'JSONP',
url : callUrl+"&callback=JSON_CALLBACK"
});
}
}]);

当您单击“失败”按钮时,返回的状态为 404,并且响应正文也丢失了。

输出

{
"status": 404,
"config": {
"method": "JSONP",
"transformRequest": [
null
],
"transformResponse": [
null
],
"url": "http://private.peterbagi.de/jsfiddle/ng500status/api.php?code=500&callback=JSON_CALLBACK",
"headers": {
"Accept": "application/json, text/plain, */*"
}
},
"statusText": "error"
}

在 Chrome DevTools Network 面板中,您会看到正确的响应代码 (500),我希望在 Angular 输出中看到相同的结果。

为什么会这样或者我做错了什么?

更新:

我构建了一个类似的示例,但使用 GET-Requests 而不是 JSONP,并且效果很好:http://private.peterbagi.de/jsfiddle/ng500status2/

这似乎是一个 JSONP 特定问题。尽管如此,它并没有解决我最初的问题,因为我必须处理跨域请求。有什么想法吗?

最佳答案

根据 Angular 源的httpBackend.js line 63line 190 ,

“JSONP”请求的状态只能是 -1、404 或 200。

原因是 Angular “JSONP”请求不是 XMLHttpRequest。 AFAIK 无法以这种方式处理特定的错误代码。 javascript 唯一知道的是这个请求是否成功。

更新:

在我上面的回答中:

the status of a 'JSONP' request can only be -1, 404, or 200.

这表示angular为这个请求的响应给出的状态。

XMLHttpRequest 是我们在ajax中常用的标准请求类型。它向服务器发送请求并获取响应,因此您可以看到服务器给出的HTTP状态码(200,404,500,401等)边。

但是,它有一些限制,例如在大多数情况下您不能创建跨域 XMLHttpRequest(除非您在服务器端设置了 allow-cross-domain header )。

这样我们就需要JSONP来帮助我们进行跨域请求。事实上 'jsonp' 附加了 <script>标记到您的文档(请求完成后总是被删除)其 src属性是您提供的 URL。

在 Angular 中,监听器被添加到这个 <script>跟踪请求的状态。但是,这些听众只能判断 script 是否存在。加载成功。如果成功, Angular 将您的响应状态设置为 200。如果没有,则分配 404。这就是状态字段为 404 或 200 的原因,无论服务器实际提供什么。

关于AngularJS $http 错误的 http 状态错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37351695/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com