AngularJS $http 错误时 http 状态错误

2024-05-03

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

所以这是场景:

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

索引.html
(查看实际效果:http://private.peterbagi.de/jsfiddle/ng500status/ 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>

app.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,并且 响应主体也丢失了。

output

{
  "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 输出中看到相同的结果。

为什么会发生这种情况或者我做错了什么?

Update:

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

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


根据角度源httpBackend.js line 63 https://github.com/angular/angular.js/blob/master/src/ng/httpBackend.js#L63 and line 190 https://github.com/angular/angular.js/blob/master/src/ng/httpBackend.js#L190,

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

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

UPDATE:

在我上面的回答中:

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

这意味着 Angular 给出的响应该请求的状态。

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

但是,它有局限性,例如在大多数情况下您无法进行跨域XMLHttp请求(除非您已经设置了allow-cross-domain服务器端的标头)。

这样我们就需要JSONP帮助我们发出跨域请求。事实上 'jsonp' 正在附加<script>您的文档的标签(请求完成后始终会被删除)src属性是您给定的 URL。

在角度中,侦听器被添加到此<script>跟踪请求的状态。然而,这些听众只能判断是否script已加载成功。如果成功,Angular 将响应的状态设置为 200。如果失败,则分配 404。这就是为什么状态字段要么是 404 要么是 200,无论服务器实际给出什么。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

AngularJS $http 错误时 http 状态错误 的相关文章

随机推荐

  • 简化情况下能否保证mqtt消息送达顺序?

    如果只有一个代理 一个发布者 一个主题和干净的会话 在这个简化的情况下 能否保证订阅者端的消息传递顺序与发布者端的发送顺序相同 会受到QoS的影响吗 Section 4 6 http docs oasis open org mqtt mqt
  • IQKeyboardManager 从 UITextField 导航到 UITextView

    IQKeyboardManager在键盘上方的工具栏中提供箭头以从一个跳转UITextField到另一个 但我正在寻找是否可以在混合之间跳转UITextFields and UITextViews 我知道完成此任务的正常程序 但我有兴趣知道
  • 更改 Visual Studio 2013 IDE 中选项卡的字体颜色

    我找不到如何更改 Visual Studio 2013 IDE 中选项卡的字体颜色 环境 gt 字体和颜色没有任何允许这样做的内容 我看不出有什么其他的帮助 我的问题是 所选页面在相对较暗的背景上有粗体黑色字体 我必须睁大眼睛才能看到选择了
  • 导入错误:无法导入名称 urandom

    我正在构建一个新的 Linux 环境 并在 Python 上看到以下错误 python c import random Traceback most recent call last File
  • Flask-httpauth: get_password 装饰器如何为 basic-auth 工作?

    我想知道有没有人用过这个烧瓶延伸 https github com miguelgrinberg flask httpauth简化 http basic auth 基本上我不明白这个example https github com migu
  • Sublime Text 2 将颜色粘贴到 MS Word

    我想将代码粘贴到 Word 文档中 同时保留突出显示的彩色文本 有没有办法做到这一点 您可以安装高亮插件 https github com n1k0 SublimeHighlight然后使用SublimeHighlight copy to
  • JavaScript 中 == 和 === 的区别[重复]

    这个问题在这里已经有答案了 有什么区别 and 在 JavaScript 中 我也见过 and 运营商 还有更多这样的运营商吗 看看这里 http longgoldenears blogspot com 2007 09 triple equ
  • 无法加载标签“s:form”的标签处理程序类“org.apache.struts2.views.jsp.ui.FormTag”

    如果我在 NetbeansIDE 中运行代码 它会显示以下错误 org apache jasper JasperException InvestorConfirm jsp 53 12 PWC6032 无法加载标签处理程序类 org apac
  • 在列表视图中颤动网格视图

    我想构建像 Ios 应用商店这样的设计 如下图所示 我想要实现的是有 5 个顶级类别 每个类别都有显示图像的网格 我这样尝试过 return new Scaffold backgroundColor Colors white appBar
  • 可重用的 Tensorflow 卷积网络

    我想重用来自Tensorflow 专业人士的 MNIST CNN 示例 http www tensorflow org tutorials mnist pros index md 我的图像尺寸为 388px X 191px 只有 2 个输出
  • Spring方法获取给定类型的所有bean

    我试图从一个相同类型的豆子中获取所有豆子FileSystemXmlApplicationContext 我正在使用factory getBeansOfType SomeType class 但我注意到它只返回顶级 bean 是否有任何其他方
  • 关于使用outer()和用户定义函数的简单问题?

    gt fun1 lt function x y x y gt outer seq 1 5 length 5 seq 6 10 length 5 fun1 1 2 3 4 5 1 7 8 9 10 11 2 8 9 10 11 12 3 9
  • F1 2019 UDP解码

    我目前正在为 F1 方向盘开发自己的显示器 F1 2019 由codemasters提供 通过UDP发送数据 该数据存储在字节数组中 我在解码返回的数组时遇到一些问题 问题是我得到了很多信息 但我不知道如何处理它们 我将向您介绍我所尝试过的
  • 如何在 mysql 正则表达式中匹配大写 ÅäÖ

    当我在 MySQL 中进行 REGEXP 比较时 我得到了瑞典字符大写版本的一些奇怪结果 我正在使用 utf8 swedish ci 排序规则 我想查找大写单词 SELECT ster REGEXP BINARY A Z a z 应该返回
  • 不区分大小写的关键字匹配

    我正在编写一种用于解析计算机语言的语法 可以与解析 Eyapp http search cpan org casiano Parse Eyapp 1 182 lib Parse Eyapp pod 这是一个 Perl 包 可以简化常规语言解
  • 优化 SELECT 和 WHERE 子句中的存储函数调用

    我有一个具有以下结构的 SQL 查询 SELECT storedfunc param table field as f FROM table WHERE storedfunc param table field lt value ORDER
  • 如何默认选中collection_check_boxes?

    我试图默认选中这一行 In db t text committed 我尝试过的变体checked true 但也许我忽略了一些事情 这是Gist http gist github com RallyWithGalli c66dee6dfb9
  • Struts 2 - 使用 CKEditor 拦截上传的图像文件

    我有一个CKEditor在网站的不同页面上 所以我将上传内容设置为true以及让它工作的所有配置内容 并且图像上传工作得很好 Send it to the Server 标签 但从这里我想拦截或互动upload函数能够将图像上传到文件夹中
  • Linux 缓冲区溢出环境变量

    我一直在审查不同类型的缓冲区溢出 并遇到了一个我不记得为什么会发生的问题 下面的代码是我尝试执行缓冲区溢出的程序 include
  • AngularJS $http 错误时 http 状态错误

    我正在尝试使用 AngularJS 的 http 服务构建 JSONP 请求 并且在出现错误时 我收到错误的 http 状态代码 404 而不是 500 并且页面正文也丢失了 所以这是场景 我调用的 URL 返回 500 内部服务器错误 并