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

ajax请求有两种方式

1. 回调

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

  1. $.ajax({
  2. ajax参数...
  3. success : xxxxxx
  4. error: xxxxxx
  5. });

2. Deferred方式

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

  1. $.ajax({
  2. ajax参数...
  3. }).then(function(res){
  4. //成功处理片段
  5. },function(err){
  6. //失败处理片段
  7. });

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

401处理的两种方式

1. 回调

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

  1. function getXXXX(type, url, data, success, error){
  2.   $.ajax({
  3.   ajax参数...
  4.    success : xxxxxx
  5.    error : function(xhr,textStatus,errorThrown){
  6.   if (xhr.status == 401) {
  7.      刷新身份认证方法(function(){
  8.   getXXXX(type, url, data, success, error);
  9.   });
  10.  } else{
  11.   // 调用外部的error
  12.   error && error(xhr,textStatus,errorThrown);
  13.    }
  14.   }
  15.   });
  16. }

2. Deferred方式

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

  1. //全局设置一个方法
  2. $.ajaxSetup({
  3. authError : function(callback){
  4. 刷新身份认证方法( function(){
  5. callback && callback();
  6. });
  7. }
  8. });
  9.  
  10. //jquery2.1.4版本源码,大概是8261行
  11. // Success/Error
  12. if ( isSuccess ) {
  13. deferred.resolveWith( callbackContext, [ success, statusText, jqXHR ] );
  14. } else {
  15. if(( jqXHR.status == 401 || jqXHR .status == 403) && callbackContext.authError){
  16.   callbackContext.authError(function (){
  17. state = 0;
  18. jqXHR.setRequestHeader( "Authorization", XXXXXX);
  19. jqXHR.readyState = 1;
  20. try {
  21. state = 1;
  22. transport.send( requestHeaders, done );
  23. } catch ( e ) {
  24. // Propagate exception as error if not done
  25. if ( state < 2 ) {
  26. done( -1, e );
  27. // Simply rethrow otherwise
  28. } else {
  29. throw e;
  30. }
  31. }
  32.   });
  33.   return;
  34. } else {
  35. deferred.rejectWith( callbackContext, [ jqXHR, statusText, error ] );
  36. }
  37. }

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

有两个原因:

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

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

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

本文为原创文章,转载请保留原出处,方便溯源,如有错误地方,谢谢指正。

当jquery ajax遇上401请求的更多相关文章

  1. jQuery.ajax( options ) : 通过 HTTP 请求加载远程数据

    jQuery.ajax( options ) : 通过 HTTP 请求加载远程数据 这个是jQuery 的底层 AJAX 实现.简单易用的高层实现见 $.get, $.post 等. $.ajax() ...

  2. 用JQuery Ajax 与一般处理程序 请求数据无刷新,以及如何调试错误

    通过 ajax() 与 一般处理程序,请求数据库数据,实现界面无刷新. Jquery ajax 请求参数详细说明 http://www.w3school.com.cn/jquery/ajax_ajax ...

  3. 简单的jquery ajax文件上传功能

    /* * 图片上传 * 注意如果不加processData:false和contentType:false会报错 */ function uploadImage(image) { var imageF ...

  4. 兼容ie的jquery ajax文件上传

    Ajax文件上传插件很多,但兼容性各不一样,许多是对ie不兼容的,另外项目中是要求将网页内容嵌入到桌面端应用的,这样就不允许带flash的上传插件了,如:jquery uploadify...悲剧 对 ...

  5. ASP.NET 异步Web API + jQuery Ajax 文件上传代码小析

    该示例中实际上应用了 jquery ajax(web client) + async web api 双异步. jquery ajax post $.ajax({ type: "POST&q ...

  6. struts2+jquery+ajax实现上传&&校验实例

    一直以为ajax不能做上传,直到最近看了一些文章.需要引入AjaxFileUploaderV2.1.zip,下载链接:http://pan.baidu.com/s/1i3L7I2T 代码和相关配置如下 ...

  7. jQuery ajax中的get请求方法汇总

    $.get() Defination and Usage 从服务端以HTTP GET方式获取数据 Examples 请求test.php,但是忽略返回的数据 $.get("test.php& ...

  8. Struts2 使用Jquery+ajax 文件上传

    话不多说 直接上代码 前台js: var formData = new FormData(); formData.append("file1",$("#file1&quo ...

  9. jQuery选择器遇上一些特殊字符

    学习jQuery过程中,发现一些特殊字符,如“.”,“#”,"(","]"等.它在选择器应用时,按照普通处理就会出错.解决办法,就是使用转义字符来处理,这有点象 ...

随机推荐

  1. js实现图片加载特效(从左到右,百叶窗,从中间到两边)

    /* 网上百度的,感觉”从中间到两边“的效果写的不是很好,改了一下,感觉可以了!*/<html> <head> <title></title> < ...

  2. ZZUOJ1196: 单调数

    /* 注意的事项:是输出小于 10^n的正整数的个数哦!开始的时候总比样例输出多一个数, 纠结了好久,原来是 0加了进去了! dpI[n][m]表示的是第n位添加数字m(0....9)的构成单调递增数 ...

  3. 新版本来袭:Apache Spark 1.5新特性介绍

    年9月9日发布了1.5版本,该版本由230+开发人员和80+机构参与,修复了1400多个补丁,该版本可以通过 http://spark.apache.org/downloads.html进行下载.Sp ...

  4. MyBaits学习

    一:配置MyBaits的开发环境 1.1.核心配置文件 正如hibernate一样,MyBaits也有一个核心的配置文件,它包含着数据源地址,用户名,密码等,还有着各个实体类的配置文件,配置文件是xm ...

  5. 十五个常用的jquery代码段【转】

    好的文章顶一个 回到顶部按钮 通过使用 jQuery 中的 animate 和 scrollTop 方法,你无需插件便可创建一个简单地回到顶部动画: 1 // Back to top 2 $('a.t ...

  6. 12种JavaScript MVC框架之比较

    Gordon L. Hempton是西雅图的一位黑客和设计师,他花费了几个月的时间研究和比较了12种流行的JavaScript MVC框架,并在博客中总结了每种框架的优缺点,最终的结果是,Ember. ...

  7. .Net魔法堂:开启IIS的WebGarden、WebFarm和StateServer之旅

    前言 公司系统虽然配置有1台NLB后拖4台App Server最后搭一台强劲无比的DB Server,但每天下午4点左右总被投诉系统慢,报表下载不了等问题.究其原因,原来NLB采用锁定sessionI ...

  8. jQuery+CSS3实现404背景动画特效

    效果:http://hovertree.com/texiao/jquery/74/ 源码下载:http://hovertree.com/h/bjaf/ko0gcgw5.htm 效果图如下: 代码如下: ...

  9. iOS阶段学习第15天笔记(NSDictionary与NSMutableDictionary 字典)

    iOS学习(OC语言)知识点整理 一.OC中的字典 1)字典:是一个容器对象,元素是以键-值对(key-value)形式存放的,key和value是任意类型的对象,key是唯一的,value可以重复 ...

  10. 【CTO讲堂】以API为核心的移动应用云大发展时代

    摘要:CTO线上讲堂5月20日正式登场,CTO俱乐部首期邀请到APICloud联合创始人兼CTO邹达与C粉之家微信群友一起聊聊如何快速玩转App开发,分享技术人的职场成长. 为了帮助IT从业者职业之路 ...