如何使用jQuery在JSON Ajax请求中回调404函数?

2021/01/31 02:31 · jquery ·  · 0评论

我想用JSON发出带有响应的Ajax请求。所以我提出了这个Ajax请求:

$.ajax({
    url: 'http://my_url',
    dataType: "json",
    success: function(data){
      alert('success');
    },
    error: function(data){
      alert('error');
    },
    complete: function(data) {
      alert('complete')
    }})

这段代码运作良好,但是当我的网址向我发送HTTP代码404时,则不使用任何回调,甚至不使用完整的回调。经过研究,这是因为我的dataType是'json',所以404返回为HTML并且JSON解析失败。因此没有回调。

您是否有解决方案,在引发404时调用回调函数?

编辑:complete回调不叫是回报404。如果你想要一个URL机智404您可以拨打:http://twitter.com/status/user_timeline/jksqdlmjmsd.json?count=3&callback=jsonp1269278524295&_=1269278536697它与此URL我有问题。

$.ajax({
    url: 'http://twitter.com/status/user_timeline/jksqdlmjmsd.json?count=3&callback=jsonp1269278524295&_=1269278536697',
    dataType: "json",
    success: function(data) {
        alert('success');
    },
    error: function(data) {
        alert('error');
    },
    complete: function(xhr, data) {
        if (xhr.status != 0)
             alert('success');
        else
             alert('fail');
    }
})

通过您的配置,jQuery使用jsonp传输数据。通过动态插入脚本元素并将URL设置为指定值来工作。然后,将服务器返回的数据评估为JavaScript-通常调用提供的回调。如果服务器返回404,则内容显然不是JavaScript,并且永远不会调用该回调。某些浏览器在script标记上支持错误处理程序,在这些情况下会调用这些错误处理程序。不幸的是IE不支持此功能。检测错误的最佳方法是依靠超时。

在您的情况下,您应该指定一个附加timeout选项,如果未及时调用回调,则会导致错误处理程序被调用(404响应就是这种情况)。

$.ajax({
  url: 'http://my_url',
  timeout: 2000, // 2 seconds timeout
  dataType: "json",
  success: function(data){
    alert('success');
  },
  error: function(data){
    alert('error');
  },
  complete: function(data) {
    alert('complete')
  }
});

如果要在使用Javascript和jsonp访问Twitter API时处理错误,则需要suppress_response_codes在请求中包含参数这使得来自Twitter API的所有响应都带有200 OK响应并包含错误。然后,您需要检查响应是否包含error参数。

$.ajax({
  url: "https://api.twitter.com/1/users/show.json",
  dataType: 'jsonp',
  jsonp: "callback",
  data: {
    screen_name: "simongate1337",
    suppress_response_codes: true // <- Important part
  },
  success: function(data) {
    if(data.error) {
      console.log("ERROR: "+data.error);
    } else {
      console.log("Success, got user " + data.screen_name);
    }
  }
});

使用statusCode-Option

$.ajax({
    url: 'http://my_url',
    dataType: "json",
    statusCode: {
        404: function() {
            alert("I could not find the information you requested.");
        }
    },
    success: function(data) {
      alert('success');
    },
    error: function(data) {
      alert('error');
    },
    complete: function(data) {
      alert('complete');
    }
})

您是否不认为问题不在于dataType而是不允许您进行的跨域请求?

当您从同一域请求数据时,下面的代码可以按预期工作,而在进行跨域请求时,则不能执行以下代码:

function handle404(xhr){
    alert('404 not found');
}

function handleError(xhr, status, exc) {
     // 0 for cross-domain requests in FF and security exception in IE 
    alert(xhr.status);
    switch (xhr.status) {
        case 404:
            handle404(xhr);
            break;
    }
}

function dumbRequest() {
    var url = 'http://twitter.com/status/user_timeline/jksqdlmjmsd.json?count=3&callback=jsonp1269278524295&_=1269278536697';
    url = 'http://twitter.com/';    
    url = '/mydata.json';    
//    url = 'mydata.json';    
    $.ajax(
        {url: url,
         dataType: 'json',
         error: handleError}
    );
}

仅仅是因为将dataType设置为“ json”吗?如果是这样,请尝试将其更改为text并自己评估JSON:

$.ajax({
    url: 'http://twitter.com/status/user_timeline/jksqdlmjmsd.json?count=3&callback=jsonp1269278524295&_=1269278536697',
    dataType: 'text',
    success: function(data, status, xmlHttp) {
        try {
            data = eval('(' + data + ')');
            alert('success');
        } catch (e) {
            alert('json parse error');
        }
    },
    error: function(xmlHttp, status, error) {
        alert('error');
    },
    complete: function(xmlHttp, status) {
        alert('complete');
    }
});

您是否知道即使HTTP状态为404,实际主体还是有效的JSON?例如,此链接具有以下JSON:

jsonp1269278524295({"request":"/status/user_timeline/jksqdlmjmsd.json?count=3&callback=jsonp1269278524295&_=1269278536697","error":"Not found"})

因此,您应该检查您的数据是否具有error常规回调函数中属性。

UPDATE:显然,即使页面的实际内容是有效的JSON,浏览器(我在Firefox中检查的)也不执行它,很可能是因为它是404。因为jQuery必须添加一个script元素(因为交叉域问题),则永远不会调用其JSONP包装器,因此,您的回调也不是。

简而言之,我认为没有手动添加该脚本元素并检查之后是否调用了预定义的回调函数的方法,就无法解决。

刚刚遇到了同样的问题,并且看到另一个问题提到jQuery-JSONP(jQuery插件) 支持捕获404错误或它们描述的错误:“在网络故障或格式错误的JSON响应的情况下进行错误恢复”

它工作完美:)

这是我的(简化的)代码,用于通过JSONP获取有关YouTube视频的详细信息:

$.jsonp(
{
    url: "https://gdata.youtube.com/feeds/api/videos/ee925OTFBCA",
    callbackParameter: "callback",
    data: 
    {
        alt: "jsonc-in-script",
        v: "2"
    },
    success: function(json, textStatus) 
    { 
        console.log("WEEEEEEEE!"); 
    },
    error: function(xOptions, textStatus) 
    {
        console.error(arguments);
    }
});

这是我的处理方式。在尝试使用返回的数据之前,我会检查是否有错误。下面显示的只是一个示例,您可以对其进行扩展以更符合您的要求。这也考虑了会话超时和其他情况...

我最初的电话:

  $.ajax({ type: 'POST', 
    url: '../doSomething',
    data: 'my data',
    success: function(data) {
      if (HasErrors(data)) return;
      var info = eval('(' + data + ')');
      // do what you want with the info object
    },
    error: function(xmlHttpRequest) {
      ReportFailure(xmlHttpRequest);
    }
  });

还有两个帮助器功能:

function HasErrors(data) {
  if (data.search(/login\.aspx/i) != -1) {
    // timed out and being redirected to login page!
    top.location.href = '../login.aspx';
    return true;
  }
  if (data.search(/Internal Server Error/) != -1) {
    ShowStatusFailed('Server Error.');
    return true;
  }
  if (data.search(/Error.aspx/) != -1) {
    // being redirected to site error reporting page...
    ShowStatusFailed('Server Error. Please try again.');
    return true;
  }
  return false;
}

function ReportFailure(msg) {
  var text;
  if (typeof msg == 'string') {
    text = msg;
  }
  else if (typeof msg.statusText == 'string') {
    if (msg.status == 200) {
      text = msg.responseText;
    }
    else {
      text = '(' + msg.status + ') ' + msg.statusText + ': ';
      // use the Title from the error response if possible
      var matches = msg.responseText.match(/\<title\>(.*?)\<\/title\>/i);
      if (matches != null)
      { text = text + matches[1]; }
      else
      { text = text + msg.responseText; }
    }
  }
  // do something in your page to show the "text" error message
  $('#statusDisplay')
    .html('<span class="ui-icon ui-icon-alert"></span>' + text)
    .addClass('StatusError');
}

以下解决方案对我来说很好:)

$.ajax({
    url: 'http://my_url',
    dataType: "json",
    success: function(data){
      alert('success');
    },
    error: function(data){
      alert('error');
    },complete: function(xhr, data) {
        if(data==="parsererror"){
             alert('404');
        }
    } 
});
本文地址:http://jquery.askforanswer.com/ruheshiyongjqueryzaijson-ajaxqingqiuzhonghuidiao404hanshu.html
文章标签: ,   ,   ,  
版权声明:本文为原创文章,版权归 admin 所有,欢迎分享本文,转载请保留出处!

文件下载

老薛主机终身7折优惠码boke112

上一篇:
下一篇:

评论已关闭!