什么因素会导致 jquery.ajax 每次都认为响应是错误的

Posted 2023-02-21

【中文标题】什么因素会导致 jquery.ajax 每次都认为响应是错误的

【英文标题】：What factors would cause jquery.ajax to consider the response to be error, every time

【发布时间】：2017-10-14 21:37:34

【问题描述】：

前端：

<script type="text/javascript">
jQuery("#FormButtonRun").click(function(event)
    submitEmailForm();
);

var submitEmailForm = function ()  
    var submitdata = 'Email':jQuery('#FormEmail').val(), 'fName':jQuery('#FormName1').val(), 'lName':jQuery('#FormName2').val(), 'listnews':"Yes";

    jQuery.ajax(
        type:'POST',
        url:'https://dev.formserver.com/ajax.php',
        data:submitdata,
        success: submitwrkd,
        error: submitfaild,
        dataType:'json'
    );


var submitwrkd = function(response, more, xhr)
    alert("It worked!);
    alert(response.msg);


var submitfaild = function(response, more, xhr)
    alert("allegedly that failed");

后端：ajax.php：

<?php
header('Content-type:application/json');
echo json_encode(array('success'=>true, 'msg'=>'It was a success'));
?>

Content-Control-Allow-Origin 在内容服务器和发布到服务器上都设置为 *

完整标题：

POST /ajax.php HTTP/1.1
Host: dev.dataserver.org
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.12; rv:51.0) Gecko/20100101 Firefox/51.0
Accept: application/json, text/javascript, */*; q=0.01
Accept-Language: en-US,en;q=0.5
Accept-Encoding: gzip, deflate, br
Content-Type: application/x-www-form-urlencoded; charset=UTF-8
Referer: https://dev.dataserver.org/popuptest
Content-Length: 127
Origin: https://dev.contentserver.org
Connection: keep-alive
Email=removed post data

回复：

HTTP/1.1 200 OK
Server: nginx/1.8.1
Date: Tue, 16 May 2017 00:44:49 GMT
Content-Type: application/json
Transfer-Encoding: chunked
Connection: keep-alive
Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: POST

数据："success":true,"msg":"It was a success"

按钮成功触发提交 目标服务器日志文件显示请求和响应"POST /ajax.php HTTP/1.1" 200 67 "-" "Mozilla/5.0 ... 浏览器开发工具显示响应：http code:200，响应内容识别为json：success: true, msg: 'It was a success'

javascript 警报宣布：allegedly that failed

我已经检查了内容控制标头Access-Control-Allow-Origin: *; Access-Control-Allow-Methods: POST;，显然它正在经历，数据类型、json 错误、javascript 错误（未抛出）、不同的浏览器...

如何让它在成功时运行定义的success函数，并在出现问题时运行错误函数？

我可以回退到 .done()，但强烈希望知道它有效。

【问题讨论】：

Access-Control-Allow-Origin: * 对，Access-Control-Allow-Methods POST 没有 : ... 但假设这只是问题中的拼写错误，这些 Access-Control-Allow-* 标头肯定是由服务器发送的?您的后端 php 代码并未显示这种情况，但我确信还有其他方法可以为每个请求添加此类标头。您能否发布 ALL 请求标头和 ALL 您在浏览器开发人员工具网络选项卡中看到的此请求的响应标头

Content-Control-Allow-Origin - 这是一个错字，应该是Access-Control-Allow-Origin，就像问题后面一样

好收获！我从服务器复制并粘贴了错误的行。请求是通过 POST 发出的，尽管我打字很仓促，但标题格式正确

content-length: 41. 输出中没有隐藏字符

这很奇怪......如果您的 Response: 文本是正确的，那么您显然会收到该标题 - 这几乎就像涉及凭据一样，这需要Access-Control-Allow-Origin: dev.contentserver.org 而不是比*

【参考方案1】：

ajax 调用参数无效 目标服务器或源服务器上缺少 Access-Control-Allow-Origin 标头 目标或源上的访问控制标头不正确 标头损坏（例如：无效的域名/源名称，或Access-Control-Allow-Origin: '*） 来自目标服务器的无效响应标头或内容流 广告拦截源域或目标域 Javascipt 从第三台服务器 CDN 加载（CDN 需要设置其域标头，并且目标服务器设置为 CDN 作为源） 使用过时的 ajax 框架（旧的 jquery、scriptaculous 或原型），在当前浏览器 Access-Control 中无法正常工作