摘要:

  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. 适配器模式,装饰模式,代理模式异同<转>

    节前把3个设计模式的学习心得分享了一下,分别是适配器模式,装饰模式,代理模式. 但是似乎越写越有些迷糊,这三种模式都有着一些大同小异的地方,总是有些搞不清. 今天再重新学习下,把学习心得分享给大家一下 ...

  2. Go Revel - main函数分析

    运行revel命令时,首先会编译整个项目,在编译时,会根据`app.conf`配置文件生成两个源码文件`tmp/main.go`.`routes/routes.go`,其中`main.go`是整个项目 ...

  3. Entity Framework应用:EntityFramework DataBase First模式

    在这篇文章中讲解如何使用EF的DbFirst模式实现数据的增删改查 一.新建控制台应用程序,然后右键->添加新建项,选择数据里面的实体数据模型: 然后点击添加 二.选择来自数据库的EF设计器,并 ...

  4. .net操作oracle,一定要用管理员身份运行 visual studio 啊,切记切记,免得报奇怪的错误。

    .net操作oracle,一定要用管理员身份运行 visual studio 啊,切记切记,免得报奇怪的错误.

  5. Linux修复系统命令

    fsck.ext2(file system check-second filesystem ) 功能说明:检查文件系统并尝试修复错误. 语法:fsck.ext2 [-acdfFnprsStvVy][- ...

  6. 使用VMware将Linux装在物理硬盘上,开机即可进入Linux (转)

    目录(?)[-] 本文目的 具体操作 1 软件准备 2  安装 21 对硬盘操作 22 创建虚拟机并安装 23 使用Grub引导Linux 1. 本文目的 适合于没有光驱的计算机来安装Linux,还有 ...

  7. Pandas 读取文本格式数据

    title 其实书中说的我认为不够全,因为公司里面现在主要用stata和spss,暂时还没有用到sas,excel也很少用 那么读取文件的方式,因为有人已经总结了,我就偷过来算了 对应不同的文件类型有 ...

  8. MyBatis where标签语句

    当 where 中的条件使用的 if 标签较多时,这样的组合可能会导致错误.当 java 代码按如下方法调用时: @Test public void select_test_where() { Use ...

  9. e786. 创建JSpinner组件

    This example demonstrates how to build three kinds of spinners. A number spinner: // Create a number ...

  10. 如何在 Ubuntu 16.04,15.10,14.04 中安装 GIMP 2.8.16(类似于PS软件)

    GIMP 图像编辑器 2.8.16 版本在其20岁生日时发布了.下面是如何安装或升级 GIMP 在 Ubuntu 16.04, Ubuntu 15.10, Ubuntu 14.04, Ubuntu 1 ...