摘要:

  jQuery已经成为项目中最常见的js库,也是前端开发最喜欢使用的库。下面是在项目中封装了jQuery的Ajax,分享给大家。

代码:

// ajax 请求参数
var ajaxSettings = function(opt) {
var url = opt.url;
var href = location.href;
// 判断是否跨域请求
var requestType = 'jsonp';
if (url.indexOf(location.host) > -1)
requestType = 'json';
requestType = opt.dataType || requestType;
// 是否异步请求
var async = (opt.async === undefined ? true : opt.async);
return {
url: url,
async: async,
type: opt.type || 'get',
dataType: requestType,
cache: false,
data: opt.data,
success: function(data, textStatus, xhr) {
/*
*如果dataType是json,怎判断返回数据是否为json格式,如果不是进行转换
* 成功数据通用格式
* {
* "code": 200,
* "data": [],
* "success": true // 成功
* }
* 失败返回的数据
* {
* "code": 200,
* "info": 'error',
* "success": false // 失败
* }
*/
if((requestType === 'json' || requestType === "jsonp") && typeof(data) === "string") {
data = JSON.parse(data);
}
if(data.success) {
opt.success(data);
} if(opt.error) {
opt.error(data);
} },
error: function(xhr, status, handler) {
if (opt.error)
opt.error();
}
};
};
function unescapeEntity(str) {
var reg = /&(?:nbsp|#160|lt|#60|gt|62|amp|#38|quot|#34|cent|#162|pound|#163|yen|#165|euro|#8364|sect|#167|copy|#169|reg|#174|trade|#8482|times|#215|divide|#247);/g,
entity = {
' ' : ' ',
' ' : ' ',
'&lt;' : '<',
'<' : '<',
'&gt;' : '>',
'&62;' : '>',
'&amp;' : '&',
'&' : '&',
'&quot;' : '"',
'"' : '"',
'&cent;' : '¢',
'¢' : '¢',
'&pound;' : '£',
'£' : '£',
'&yen;' : '¥',
'¥' : '¥',
'&euro;' : '€',
'€' : '€',
'&sect;' : '§',
'§' : '§',
'&copy;' : '©',
'©' : '©',
'&reg;' : '®',
'®' : '®',
'&trade;' : '™',
'™' : '™',
'&times;' : '×',
'×' : '×',
'&divide;' : '÷',
'÷' : '÷'
};
if (str === null) {
return '';
}
str = str.toString();
return str.indexOf(';') < 0 ? str : str.replace(reg, function(chars) {
return entity[chars];
});
}
// 转换html的实体
$.ajaxSetup({
global : true,
cache : false,
converters : {
'text json' : function(response){
return jQuery.parseJSON(unescapeEntity(response));
}
}
});
/*
*Ajax 请求权限异常
* 用户权限错误跳转登陆页
* 404错误跳转404页面
*/
$(document).ajaxComplete(function(evt, req, settings){
if(req && req.responseJSON){
var json = req.responseJSON;
if(json.code === 403 && json.info === 'perm error' && !json.success){
window.location.href = location.protocol + '//' + location.hostname;
return;
}
if(json.code === 404 && !json.success) {
window.location.href = location.protocol + '//' + location.hostname + '/404.html';
}
}
});
/*
*Ajax 请求错误提示
*例如:500错误
*返回错误信息格式
*{
* code: 500,
* info: 系统发生异常
*}
*/
$(document).ajaxError(function(evt, req, settings){
if(req && (req.status === 200||req.status === 0)){ return false; }
var msg = '错误:';
if(req && req.responseJSON){
var json = req.responseJSON;
msg += json.code||'';
msg += json.info||'系统异常,请重试';
}else{
msg = '系统异常,请重试';
}
alert(msg);
});

小结:

  在执行Ajax请求时只需要调用ajaxSettings函数即可,如下:

$.ajax(ajaxSettings({
url: '',
data: ''
}))

Ajax请求全局配置的更多相关文章

  1. ajax请求中的6个全局事件

    //事件触发顺序ajaxStart,ajaxSend,ajaxSuccess或ajaxError,ajaxComplete,ajaxStop $(document).ajaxStart(functio ...

  2. 使用es6的then()方法封装jquery的ajax请求

    使用场景: jsp页面中使用jquery的ajax请求比较频繁,以前vue框架的项目用过axios,所以就想着用then()封装一个公共请求的方法,这样每次请求就不用那么麻烦的写一大堆请求参数了. 示 ...

  3. 框架基础:ajax设计方案(六)--- 全局配置、请求格式拓展和优化、请求二进制类型、浏览器错误搜集以及npm打包发布

    距离上一次博客大概好多好多时间了,感觉再不搞点东西出来,感觉就废了的感觉.这段时间回老家学习驾照,修养,然后7月底来上海求职(面了4家,拿了3家office),然后入职同程旅游,项目赶进度等等一系列的 ...

  4. 使用ajax请求接口,跨域后cookie无法设置,全局配置ajax;及使用axios跨域后cookie无法设置,全局配置axios

    问题一: 使用ajax/axios跨域请求接口,后端放行了,能够正常获取数据,但是cookie设置不进去,后端登录session判断失效 ajax解决办法: //设置ajax属性 crossDomai ...

  5. 前端通信:ajax设计方案(六)--- 全局配置、请求格式拓展和优化、请求二进制类型、浏览器错误搜集以及npm打包发布

    距离上一次博客大概好多好多时间了,感觉再不搞点东西出来,感觉就废了的感觉.这段时间回老家学习驾照,修养,然后7月底来上海求职(面了4家,拿了3家office),然后入职同程旅游,项目赶进度等等一系列的 ...

  6. 小程序api请求层封装(Loading全局配置)

    前言 小程序开发,没有vue中的axios那么好使,请求层的封装需要自己来搞. 当然请求层的配置少不了loading,这里索性也就将loading做一个配置,避免以后重复造轮子 请求封装 小程序中有封 ...

  7. ajax请求加全局loading , 个别特殊请求不显示loading

    项目中,请求开始前加载loading遮罩层,请求结束关闭遮罩,一般都会加在全局中,但有个别请求不需要加全局loading 的话,这时候就需要对这些请求进行配置 全局加loading: ; functi ...

  8. Sping MVC不使用任何注解处理(jQuery)Ajax请求(基于XML配置)

    1. Spring Spring框架是一个轻量级的解决方案,是一个潜在的一站式商店,用于构建企业就绪的应用程序.Spring框架是一个Java平台,为开发Java应用程序提供全面的基础架构支持.Spr ...

  9. C# MVC 全局错误Application_Error中处理(包括Ajax请求)

    在MVC的Global.asax Application_Error 中处理全局错误. 如果在未到创建请求对象时报错,此时 Context.Handler == null . 判断为Ajax请求时,我 ...

随机推荐

  1. python入门-分类和回归各种初级算法

    引自:http://www.cnblogs.com/taichu/p/5251332.html ########################### #说明: # 撰写本文的原因是,笔者在研究博文“ ...

  2. 使用FineReport打造考试分析系统

    本系统的优点: 1.报表内容丰富:系统中包含总分分析.小分分析.作答错因分析.试卷命题分析和各类用户报告单五类报表.涵盖学校须要的各项分析数据,并提供丰富的图表,使分析数据更直观表现. 2.操作灵活简 ...

  3. 2013Hulu校园招聘笔试题

    填空题:1.中序遍历二叉树,结果为ABCDEFGH,后序遍历结果为ABEDCHGF,先序遍历结果为?  FCBADEGH  如下图所示: 2.对字符串HELL0_HULU中的字符进行二进制编码,使得字 ...

  4. NetBeans Lookups Explained!

    https://dzone.com/articles/netbeans-lookups-explained —————————————————————————————————————————————— ...

  5. SimpleDraweeView 设置圆角不生效问题

    采用的是xml配置 roundedCornerRadius 参数方法 adverPic.setImageURI("http://xx.xx.xx.xx/123.jpg"); 设置c ...

  6. animation过渡效果

    References: http://developer.android.com/training/animation/index.html http://developer.android.com/ ...

  7. thinkphp 对百度编辑器里的内容进行保存

    模板代码 <!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="U ...

  8. (笔记)电路设计(十一)之DC/DC电源转换方案设计应用

    十大 法则之一:搞懂什么是DC/DC电源以及DC/DC转换电路分类 DC/DC电源电路又称为DC/DC转换电路,其主要功能就是进行输入输出电压转换.一般我们把输入电源电压在72V以内的电压变换过程称为 ...

  9. e807. 设置进程监听对话框的延迟弹出

    By default, the progress monitor delays for a short period before it is displayed. There are two pro ...

  10. (转)关于RTP时间戳及多媒体通信同步的问题

    下载 多媒体通信同步方法,主要有时间戳同步法.同步标记法.多路复用同步法三种.下面主要讨论时间戳同步法,特别是 RTP 时间戳同步.内容包括 RTP 媒体间同步的实现,为什么需要 RTCP 的 NTP ...