jQuery ajax 请求具有不同类型的响应来处理

Question

我正在通过$.ajax() 方法提交表单。我的要求是这样的：

       $.ajax(url, {
            type: "POST",
            contentType: "application/x-www-form-urlencoded; charset=UTF-8",
            dataType: "html json",
            data: formData,
            headers: {
                "X-Requested-With": "XMLHttpRequest"
            }
        }).done(function (result) {
                //handle correct json response or html response
        }).fail(function (jqXHR, textStatus, errorThrown) {
            console.log(jqXHR);
            console.log(textStatus);
            console.log(errorThrown.stack);
        });

当服务器返回 JSON 响应时，一切都按预期工作。但是当响应是 Html 时，会执行 fail() 回调（响应的状态码是 200 - OK）并且 errorThrown.stack 作为这个值：

"SyntaxError: Unexpected token <
    at Object.parse (native)
    at jQuery.extend.parseJSON (http://localhost/Scripts/jquery-1.10.2.js:550:23)
    at ajaxConvert (http://localhost/Scripts/jquery-1.10.2.js:8429:19)
    at done (http://localhost/Scripts/jquery-1.10.2.js:8185:15)
    at XMLHttpRequest.jQuery.ajaxTransport.send.callback (http://localhost/Scripts/jquery-1.10.2.js:8778:8)"

所以我认为它正在尝试解析 JSON 而不是 html。我不明白，因为我已将dataType 选项设置为"html json"...

以下是有关请求/响应的一些信息：

请求标头

Accept:text/html, */*; q=0.01
Accept-Encoding:gzip,deflate
Accept-Language:pt-PT,pt;q=0.8,en-US;q=0.6,en;q=0.4
Connection:keep-alive
Content-Length:2386
Content-Type:application/x-www-form-urlencoded; charset=UTF-8
X-Requested-With:XMLHttpRequest

响应标头

Cache-Control:private, s-maxage=0
Content-Length:56392
Content-Type:text/html; charset=utf-8
Date:Fri, 03 Oct 2014 09:52:13 GMT
Server:Microsoft-IIS/8.5
Vary:Accept-Encoding
X-AspNet-Version:4.0.30319
X-AspNetMvc-Version:4.0
X-Powered-By:ASP.NET

为什么会这样？

解决方案（基于@Oscar Bout 回复）

        $.ajax(url, {
            type: "POST",
            contentType: "application/x-www-form-urlencoded; charset=UTF-8",
            dataType: "html",
            data: formData,
            headers: {
                "X-Requested-With": "XMLHttpRequest"
            }
        }).done(function (result) {
            try {
                var jsonResult = $.parseJSON(result);
                //handle json result
            } catch (e) {
                $("#myDiv").html(result); //handle html result
            }
        }).fail(function (jqXHR, textStatus, errorThrown) {
            console.log(jqXHR);
            console.log(textStatus);
            console.log(errorThrown.stack);
        });

我认为使用 try/catch 不是最好的方法，所以我正在听取其他选择。

Answer 1

您在 dataType 中所说的是“将 html 响应视为 JSON”。

dateType 函数中的 2 个值并不意味着它可以处理 2 种类型。 意思是“把第一个当作第二个”。

所以遗憾的是，这个错误是正确的。当 html 进来时，它被视为 JSON。 解析它并且很好......因为它不是 JSON 但实际上是 HTML 它失败了。

该函数用于“语法正确但带有 html 标头的 json”。 您的响应可能是“带有 html 标头的语法正确的 html”，因此输出中的“

也许对您来说有一种方法可以使用 try {} catch (e) {} 函数？

这里是dataType的解释： http://api.jquery.com/jquery.ajax/