如何将多个值与 jQuery ajax 数据类型一起使用

Question

我应该请求数据作为jsonp来执行跨域请求。但返回的实际结果是像 {"q":"iphone","r":["iphone 5","iphone","обмен на iphone","iphone 4","iphone 5s"]} 一样的 json。

我尝试在数据类型中使用多个值，例如：

$.ajax({
  url: url,
  type: 'GET',
  dataType: 'jsonp json',
  jsonp: false,
  ... 

但它返回parsererror(与 jsonp 相同(。

我还尝试在有和没有callback的情况下进行通话：

$.ajax({
  url: url,
  type: 'GET',
  dataType: 'jsonp json',
  cache: true,
  jsonpCallback: 'callbackFunctionName',
  jsonp: 'callback',

我该怎么做才能正确处理此类结果？

更新。我尝试使用 script 而不是 jsonp ，效果更好 - 调用success/done函数(而不是 error/fail(，但我无法获得响应文本 - 传递给 success() 的数据undefined以及传递给complete() jqXHR.responseText为空。

Answer 1

你不能使用多个数据类型，如果你使用 JSONP，这将返回一个 JSONP 块，你可以用它来调用回调来处理返回数据，如下所示：

• 将 .ajax(( 与 JSONP 一起使用的基本示例？

您希望返回一个以 JSONP 块形式形成的响应，如下所示：

callback({
    "q": "iphone",
    "r": ["iphone 5", "iphone", "обмен на iphone", "iphone 4", "iphone 5s"]
});

从这里，您可以使用回调，假设您正在使用带有 set 回调参数的 AJAX 调用。

Answer 2

如果需要从 URL 返回多个数据类型，则无需在 jQuery AJAX 调用中传递dataType。

$.ajax({
        type: "GET",
        url: url,
        data: data,
        //dataType: "json",  comment this line
        cache: false,
        beforeSend: function () {},
        success: function (data) {},
        error: function (xhr, ajaxOptions, errorThrown) {}
      });

Answer 3

如前一篇文章所述，您可以完全删除 dataType 属性。在这种情况下，JQuery Ajax 将智能地猜测输出并进行转换。

https://api.jquery.com/jquery.ajax/- 数据类型

确保响应标头 - "内容类型"是文本/纯文本，并且 MIMEType 未作为 AJAX 选项的一部分显式提供。

ajaxHandleResponses - 将自动尝试根据 mimeType 和 Content-Type 标头检测转换类型。

function ajaxHandleResponses( s, jqXHR, responses ) {
var ct, type, finalDataType, firstDataType,
    contents = s.contents,
    dataTypes = s.dataTypes;
// Remove auto dataType and get content-type in the process
while ( dataTypes[ 0 ] === "*" ) {
    dataTypes.shift();
    if ( ct === undefined ) {
        ct = s.mimeType || jqXHR.getResponseHeader( "Content-Type" );
    }
}

另一种解决方案是使用自定义转换

根据对 JSON 的响应执行 AJAX 自定义转换，如果响应不是 JSON，则保留为字符串。

示例代码：

            return $.ajax({
                type: "GET",
                url: serviceURL,
                converters: {
                    'text mycustomtype': (result) => {
                        return this.getResponse(result);
                    }
                },
                dataType: 'mycustomtype'
            });
        this.getResponse = (result) => {
            let response;
            try {
                response = JSON.parse(result);
            }
            catch (e) {
                response = result;
            }
            return response;
        };