样例代码:

  

<html>
<head>
<title>hangge.com</title>
<meta charset="utf-8"/>
<script type="text/javascript" src="./jquery-1.11.1.min.js"></script>
<script>
//全局的ajax访问,处理ajax清求时session超时
$.ajaxSetup({
contentType:"application/x-www-form-urlencoded;charset=utf-8",
complete:function(XMLHttpRequest,textStatus){
//通过XMLHttpRequest取得响应头,sessionstatus,
var sessionstatus=XMLHttpRequest.getResponseHeader("sessionstatus");
if(sessionstatus=="timeout"){
//如果超时就处理 ,指定要跳转的页面(比如登陆页)
window.location.replace("/login/index.php");
}
}
});

//获取数据
function getContent() {
$.get("content.php", function (data){
alert(data);
});
} //登录或注销
function login(value) {
$.get("login.php",{"login":value} , function (data){
alert(data);
});
}
</script>
</head>
<body>
<button onclick="getContent()">获取数据</button>
<button onclick="login(true)">登录</button>
<button onclick="login(false)">注销</button>
</body>
</html>

 

一、统一处理返回结果

我们可以将超时或是其他异常情况放置在返回结果中,前台统一解析结果来进行各种异常处理。

1,后台返回数据样例

比如后台返回如下格式的 JSON 数据,包括正常情况和异常情况。

//正常数据返回
{"state":1, "msg":"", "data":"欢迎访问hangge.com"} //session超时数据返回
{"state":-1, "msg":"session超时,请重新登录!"} //异常情况数据返回
{"state":0, "msg":"服务器繁忙,请稍后再试。"}

  

2,前台处理样例

 

//全局的ajax访问,处理ajax清求时异常
$.ajaxSetup({
contentType:"application/x-www-form-urlencoded;charset=utf-8",
complete:function(XMLHttpRequest,textStatus){
//通过XMLHttpRequest取得响应结果
var res = XMLHttpRequest.responseText;
try{
var jsonData = JSON.parse(res);
if(jsonData.state == -1){
//如果超时就处理 ,指定要跳转的页面(比如登陆页)
alert(jsonData.msg);
window.location.replace("/login/index.php");
}else if(jsonData.state == 0){
//其他的异常情况,给个提示。
alert(jsonData.msg);
}else{
//正常情况就不统一处理了
}
}catch(e){
}
}
}); //获取数据
function getContent() {
$.get("content.php", function (data){
var jsonData = JSON.parse(data);
//只处理正常的情况
if(jsonData.state == 1){
alert(jsonData.data);
}
});
}

  

三、统一处理异常的HTTP状态码

我们还可以通过 Ajax 拦截,根据异常的 HTTP 状态码(404、500等)统一处理各种请求错误、服务器错误等情况。

$.ajaxSetup({

   contentType:"application/x-www-form-urlencoded;charset=utf-8",
   complete:function(XMLHttpRequest,textStatus){
   },
   statusCode: {
     404: function() {
         alert('数据获取/输入失败,没有此服务。404');
     },
     504: function() {
         alert('数据获取/输入失败,服务器没有响应。504');
     },
     500: function() {
         alert('服务器有误。500');
     }
   }
});

jQuery - 拦截所有Ajax请求(统一处理超时、返回结果、错误状态码 )的更多相关文章

  1. js拦截全局ajax请求

    你是否有过下面的需求:需要给所有ajax请求添加统一签名.需要统计某个接口被请求的次数.需要限制http请求的方法必须为get或post.需要分析别人网络协议等等,那么如何做?想想,如果能够拦截所有a ...

  2. js 拦截全局 ajax 请求

    你是否有过下面的需求:需要给所有ajax请求添加统一签名.需要统计某个接口被请求的次数.需要限制http请求的方法必须为get或post.需要分析别人网络协议等等,那么如何做?想想,如果能够拦截所有a ...

  3. Java过滤器处理Ajax请求,Java拦截器处理Ajax请求,拦截器Ajax请求

    Java过滤器处理Ajax请求,Java拦截器处理Ajax请求,拦截器Ajax请求 >>>>>>>>>>>>>>&g ...

  4. 关于JQuery中的ajax请求或者post请求的回调方法中的操作执行或者变量修改没反映的问题

    前段时间做一个项目,而项目中所有的请求都要用jquery 中的ajax请求或者post请求,但是开始处理一些简单操作还好,但是自己写了一些验证就出现问题了,比如表单提交的时候,要验证帐号的唯一性,所以 ...

  5. phpStudy4——前端页面使用Ajax请求并解析php返回的json数据

    项目需求: 在html页面显示所有用户列表信息. 需求分析: 1. html页面使用ajax向后端php请求用户数据 2. php脚本查询数据库,并将查询后的结果以json格式返回前端html页面 3 ...

  6. Jquery progressbar通过Ajax请求获取后台进度演示

    项目源代码下载:http://download.csdn.net/detail/nuptboyzhb/6262253 1.简介 本文主要演示Jquery progressbar的进度条功能.js通过a ...

  7. spring security:ajax请求的session超时处理

    当前端在用ajax请求时,如果没有设置session超时时间并且做跳转到登录界面的处理,那么只是靠后台是很难完成超时的一系列动作的:但是如果后台 没有封装一个ajax请求公共类,那么在ajax请求上下 ...

  8. jQuery选择器,Ajax请求

    jQuery选择器: $("#myELement") 选择id值等于myElement的元素,id值不能重复在文档中只能有一个id值是myElement所以得到的是唯一的元素 $( ...

  9. jquery中的ajax请求用法以及参数详情

    url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. type: 要求为String类型的参数,请求方式(post或get)默认为get.注意其他http请求方法,例如put和 ...

随机推荐

  1. 【简明翻译】Hibernate 5.4 Getting Started Guide 官方入门文档

    前言 最近的精力主要集中在Hibernate上,在意识到Hibernate 5 的中文资料并不多的时候,我不得不把目光转向Hibernate的官方doc,学习之余简要翻一下入门文档. 原文地址:htt ...

  2. CentOS 8安装

    1.VMware workstation14Pro安装 ​ 下载蓝点网,序列号也有,直接输入,永久激活 2.CentOS8下载 CentOS8下载地址:清华源 3.CentOS8安装

  3. 孟文静浅谈AG百家庄闲技巧,下三路的运用以及三株路的正反打法

    关于三珠路的各种打法,这里我做个详细的讲解,如想了解更多打法可+qq<738不要字4633>或关注VX公众号<孟文静1> 三珠路的打法源于叶汉,叶汉的打法是——三珠路打反 先看 ...

  4. 想要金九银十面试通关,不懂 Java多线程肯定是不行的!

    作者 | 纳达丶无忌 如果对什么是线程.什么是进程仍存有疑惑,请先 Google 之,因为这两个概念不在本文的范围之内. 用多线程只有一个目的,那就是更好的利用 CPU 的资源,因为所有的多线程代码都 ...

  5. C#使用 OleDbConnection 连接读取Excel

    /// <summary> /// 读取Excel中数据 /// </summary> /// <param name="strExcelPath"& ...

  6. Linux防火墙的相关资料

    1.查看防火墙状态 [root@localhost ~]# service iptables status 2.编辑/etc/sysconfig/iptables文件.我们实例中要打开8080端口和9 ...

  7. 大白话简单工厂模式 (Simple Factory Pattern)

    大白话简单工厂模式 (Simple Factory Pattern) 从买车经历说起 毕业两年,码农张小两口无法忍受挤公交,凌晨起床抢火车票的痛苦,遂计划买车.逛了多家4S店,最终定下日产某车型的轿车 ...

  8. 千呼万唤始出来——uFUN开发板2.0开箱评测

    前言 今年3月,我参与了面包板社区组织的第一批uFUN开发板评测活动,并有幸能获得试用机会,那是我第一次了解到uFUN这个项目及背后的故事,4月份,uFUN 2.0版本来了,收到了张工送的一块样板,后 ...

  9. 5. abp集成asp.net core

    一.前言 参照前篇<4. abp中的asp.net core模块剖析>,首先放张图,这也是asp.net core框架上MVC模块的扩展点 二.abp的mvc对象 AbpAspNetCor ...

  10. Could not find any version that matches com.android.support:appcompat-v7:29.+

    新学Android开发设计用到Android Studio,说实话真的是BUG满天飞,稍有不慎就会蹦出一个不明所以的问题. 新建Android工程时编译运行报错: 目测是本地文件和工程对应的依赖包不匹 ...