当jquery ajax遇上401请求的解决方法

 更新时间:2016年05月19日 12:07:38   投稿:jingxian  
下面小编就为大家带来一篇当jquery ajax遇上401请求的解决方法。小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

jquery ajax是个很常用接口,而在请求时候,可能存在响应401的情况(身份认证过期或未登录),比较容易出现在混合应用上,如何进行身份认证,重发失败请求,还是值得注意的。

ajax请求有两种方式

1. 回调

最常写的方式,成功失败处理以回调方式传入。

$.ajax({
   ajax参数...
   success : xxxxxx
   error: xxxxxx
});

2. Deferred方式

Deferred模式我在《js异步编程》有说明, ajax调用本身返回就是一个Deferred对象,成功失败回调不以参数传入。

$.ajax({
   ajax参数...
}).then(function(res){
  //成功处理片段
},function(err){
  //失败处理片段
});

既然有这两种方式,那应对处理401的方式也是有两种。

401处理的两种方式

1. 回调

这种方式的处理比较简单,在失败回调里面判断401,如果是则进行身份认证,成功重发请求。

function getXXXX(type, url, data, success, error){
  $.ajax({
    ajax参数...
     success : xxxxxx
     error : function(xhr,textStatus,errorThrown){
      if (xhr.status == 401) {
         刷新身份认证方法(function(){
         getXXXX(type, url, data, success, error);
        });
      } else{
        // 调用外部的error
        error && error(xhr,textStatus,errorThrown);
      }
    }
  });
}

2. Deferred方式

这种方式目前我找到的处理方式需要修改jquery源码。

//全局设置一个方法
$.ajaxSetup({
   authError : function(callback){
      刷新身份认证方法( function(){
        callback && callback();
      });
   }
});
 
//jquery2.1.4版本源码,大概是8261行
// Success/Error
if ( isSuccess ) {
   deferred.resolveWith( callbackContext, [ success, statusText, jqXHR ] );
} else {
   if(( jqXHR.status == 401 || jqXHR .status == 403) && callbackContext.authError){
     callbackContext.authError(function (){
      state = 0;
      jqXHR.setRequestHeader( "Authorization", XXXXXX);
      jqXHR.readyState = 1;
      try {
        state = 1;
        transport.send( requestHeaders, done );
      } catch ( e ) {
        // Propagate exception as error if not done
        if ( state < 2 ) {
           done( -1, e );
        // Simply rethrow otherwise
        } else {
          throw e;
        }
      }
     });
     return;
   } else {
      deferred.rejectWith( callbackContext, [ jqXHR, statusText, error ] );
   }
}

这里说下为什么不能像第一种方式那样进行请求。

有两个原因:

1. then这种链式写法,导致这请求的回调不是在参数里,而是在jQuery.Callbacks一个optionsCache全局变量里,我们无法在ajax error里拿到回调函数进行重发。

2. 写在then里的回调触发一次就会被销毁,当触发了error时,回调执行后就销毁。

最后的处理方式就是在要触发error之前,拦截401的错误,重新进行身份认证,然后重置状态,重发请求。

以上这篇当jquery ajax遇上401请求的解决方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • jquery 仿锚点跳转到页面指定位置的实例

    jquery 仿锚点跳转到页面指定位置的实例

    下面小编就为大家带来一篇jquery 仿锚点跳转到页面指定位置的实例。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-02-02
  • jQuery实现“扫码阅读”功能

    jQuery实现“扫码阅读”功能

    这篇文章主要介绍了jQuery实现“扫码阅读”功能方法的相关资料,需要的朋友可以参考下
    2015-01-01
  • jQuery ajax动态生成table功能示例

    jQuery ajax动态生成table功能示例

    这篇文章主要介绍了jQuery ajax动态生成table功能,结合具体实例形式分析了jQuery基于ajax数据交互动态创建table表格的相关操作技巧,需要的朋友可以参考下
    2017-06-06
  • 无需 Flash 使用 jQuery 复制文字到剪贴板

    无需 Flash 使用 jQuery 复制文字到剪贴板

    需要做的只是引入其脚本,在HTML标签上赋一个“data-clipboard-target”属性然后写一小段JavaScript片段。为了演示假定有一个货币转换应用,在一个文本框中输入数值时同时将兑换结果显示在另一个文本框中,当点击文本框时,会触发事件将其复制到剪贴板然后显示一条消息。
    2016-04-04
  • jquery $.getJSON()跨域请求

    jquery $.getJSON()跨域请求

    以前总是没搞明白是怎么回事,现在是迫不得已,就仔细看了看说明文档,终于测试成功了,记下
    2011-12-12
  • jQuery的.live()和.die() 使用介绍

    jQuery的.live()和.die() 使用介绍

    很多开发者都知道jQuery的.live()方法,他们大部分知道这个函数做什么,但是并不知道是怎么实现的,所以用的并不那么舒适。而且他们却从未听过还有解除绑定的.live()事件的.die()方法。即使你熟悉这些,但是你意识到.die()了吗?
    2011-09-09
  • jquery实现自适应banner焦点图

    jquery实现自适应banner焦点图

    本文主要分享了jquery实现自适应banner焦点图的示例代码,具有很好的参考价值,下面跟着小编一起来看下吧
    2017-02-02
  • jQuery中even选择器的定义和用法

    jQuery中even选择器的定义和用法

    这篇文章主要介绍了jQuery中even选择器的定义和用法,较为详细的分析了event选择器的语法结构与具体用法,并以一个设置偶数行为蓝色字体的例子总结了其用法与功能特点,需要的朋友可以参考下
    2014-12-12
  • jquery实现浮动的侧栏实例

    jquery实现浮动的侧栏实例

    这篇文章主要介绍了jquery实现浮动的侧栏,实例分析了基于jQuery的stickySidebar插件实现浮动层的相关技巧,需要的朋友可以参考下
    2015-06-06
  • Jquery实现纵向横向菜单

    Jquery实现纵向横向菜单

    这篇文章主要介绍了Jquery实现纵向横向菜单的相关资料,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-01-01

最新评论