Ajax 状态为 200 但错误事件触发而不是成功

Posted 2023-03-04

【中文标题】Ajax 状态为 200 但错误事件触发而不是成功

【英文标题】：Ajax status is 200 but error event triggers instead of success

【发布时间】：2020-04-16 10:41:56

【问题描述】：

今天我面临一个以前从未遇到过的奇怪问题。我的 ajax 调用返回状态为 200 的响应，但不知何故它总是触发错误事件而不是成功。这就是我正在做的事情

$.ajax(
        type: "GET",
        url: "swap.php",
        data: "key=dbdcd39f0f8f5077e7308f3d3d5d8cac&code="+$("#code").val(),
        contentType: 'application/json; charset=utf-8',
        dataType:"json",
        beforeSend: function() 
                $("#msg").html("<img src='imgs/loading_circle.gif'/>");
        ,
        success: function(result)
                alert(result);
        ,
        error: function(xhr,status,error)
            alert(error.Message); // receiving Undefined message
        
    );

swap.php的PHP代码

<?php
header('Content-Type: application/json');
$resp["data"]="Record updated successfully";
print json_encode($resp);
?>

这是我直接把网址放在地址栏时得到的响应

下面是chrome的network tab截图

【问题讨论】：

您是否使用 json_encode 发送响应？

否，但响应状态为 200，我正在做一些数据库工作，这些工作也根据提供的参数成功更新。

在 jQuery .ajax() 中，如果指定了 dataType: 'json' 设置，服务器必须返回一个有效的 JSON 格式的字符串，否则会抛出错误。

是的，试试这个方法 echo json_encode($resp);die;

这可能是跨域错误，因为在您的代码中我可以看到它正在将请求作为选项而不是 get 发送

【参考方案1】：

您显示的响应图像不是实际请求，它是飞行前检查，检查请求方法它是 OPTIONS 而不是 "GET" 您正在尝试。它只是检查此请求中的"CORS"。不是实际的 ajax 调用。

在此之后检查实际请求。你会发现错误。

【讨论】：

在此请求的标头中，您会看到“请求方法：OPTIONS”。这意味着 ajax 只是通过某种握手技术验证它是否可以访问资源，而不是调用实际请求。所以会有2个ajax调用。过滤您的请求并检查所有“XHR”请求。你会在那里找到第 2 个请求。

以及您在响应另一个请求时看到的内容，以及状态如何？

console.log(xhr)，错误函数的第一个参数，看看那里发生了什么。

就是这样......这就是错误所在，这就是触发错误功能的原因。现在你需要解决这个问题，你可以看这里***.com/questions/50873764/…

通过从请求标头中删除内容和数据类型解决了该问题。 Corssorigin 不是问题，因为我在同一个项目中有很多 ajax 请求请求同一个服务器并且之前没有遇到过这个问题。但这是我第一次使用查询字符串参数进行 GET 操作。我以前总是使用表单值。

【参考方案2】：

您可以尝试传递自定义标头

headers: 
            'Content-Type': 'application/json',
            "Accept": 'application/json',
        

【讨论】：

它通过从请求标头中删除内容类型和数据类型来工作。因为我正在使用查询字符串参数。