一、封装 ajax
封装最谨严的 ajax,可间接复制援用
ajax.js
function sendAjax(obj){
/ 先判断 url 是否传入
if(!obj.url){
/ 没有传
throw new Error('地址必填') / 抛出自定义谬误
}
/ 传入了之后须要验证 url 是否是字符串
if(Object.prototype.toString.call(obj.url) !== '[object String]'){throw new Error('地址必须是字符串')
}
/ 判断申请形式是否传入
if(!obj.method){obj.method = 'get'}
/ 传入了 - 验证是否是 get 或 post
if(obj.method.toLowerCase()!=='get' && obj.method.toLowerCase()!=='post'){throw new Error('申请形式必须是 get 或 post')
}
/ 判断 async 是否传入
if(obj.async === undefined){obj.async = true}
/ 判断类型
if(Object.prototype.toString.call(obj.async) !== '[object Boolean]'){throw new Error('async 必须是布尔值')
}
/ 判断是否传入 success
if(!obj.success){obj.success = function(){}}
/ 判断是否是函数
if(Object.prototype.toString.call(obj.success) !== '[object Function]'){throw new Error('success 必须是函数')
}
if(!obj.error){obj.error = function(){}}
if(Object.prototype.toString.call(obj.error) !== '[object Function]'){throw new Error('error 必须是函数')
}
/ 判断数据是否传入
var str = '';
if(obj.data){
/ 判断类型
if(Object.prototype.toString.call(obj.data) === '[object String]'){str = obj.data}else if(Object.prototype.toString.call(obj.data) === '[object Object]'){
/ 对象要解决成字符串
var f = '';
for(var attr in obj.data){str += f + attr + '=' + obj.data[attr]
f = '&'
}
}else{throw new Error('非法数据')
}
/ 如果是 get 申请,须要将数据拼接在地址后
if(obj.method.toLowerCase() === 'get'){obj.url += '?' + str}
}
/ 判断心愿申请回来的数据格式
if(!obj.dataType){obj.dataType = 'json'}
/ 如果传了
if(obj.dataType.toLowerCase()!=='json' && obj.dataType.toLowerCase()!=='text' && obj.dataType.toLowerCase()!=='xml'){throw new Error('dataType 非法')
}
/*
{
url:'',
method:'',
data:'',
async:'',
success:function(){},
error:'',
dataType:'text/json/xml'
}
*/
var xhr = new XMLHttpRequest;
xhr.onreadystatechange = function(){if(xhr.readyState === 4){if(parseInt(xhr.status/100) === 2){
/ 确定要不要转对象
switch(obj.dataType.toLowerCase()){
case 'json':
var res = xhr.responseText;
res = JSON.parse(res)
break;
case 'xml':
var res = xhr.responseXML;
break;
case 'text':
var res = xhr.responseText;
break;
}
obj.success(res)
}else{obj.error()
}
}
}
xhr.open(obj.method,obj.url,obj.async)
if(obj.method.toLowerCase() === 'post' && obj.data){
/ 设置申请头
xhr.setRequestHeader('content-type','application/x-www-form-urlencoded')
xhr.send(str)
return
}
xhr.send()
}
function promiseAjax(obj){
return new Promise(function(resolve,reject){
/ 先判断 url 是否传入
if(!obj.url){
// 没有传
throw new Error('地址必填') / 抛出自定义谬误
}
/ 传入了之后须要验证 url 是否是字符串
if(Object.prototype.toString.call(obj.url) !== '[object String]'){throw new Error('地址必须是字符串')
}
/ 判断申请形式是否传入
if(!obj.method){obj.method = 'get'}
/ 传入了 - 验证是否是 get 或 post
if(obj.method.toLowerCase()!=='get' && obj.method.toLowerCase()!=='post'){throw new Error('申请形式必须是 get 或 post')
}
/ 判断 async 是否传入
if(obj.async === undefined){obj.async = true}
/ 判断类型
if(Object.prototype.toString.call(obj.async) !== '[object Boolean]'){throw new Error('async 必须是布尔值')
}
/ 判断数据是否传入
var str = '';
if(obj.data){
/ 判断类型
if(Object.prototype.toString.call(obj.data) === '[object String]'){str = obj.data}else if(Object.prototype.toString.call(obj.data) === '[object Object]'){
/ 对象要解决成字符串
var f = '';
for(var attr in obj.data){str += f + attr + '=' + obj.data[attr]
f = '&'
}
}else{throw new Error('非法数据')
}
/ 如果是 get 申请,须要将数据拼接在地址后
if(obj.method.toLowerCase() === 'get'){obj.url += '?' + str}
}
/ 判断心愿申请回来的数据格式
if(!obj.dataType){obj.dataType = 'json'}
/ 如果传了
if(obj.dataType.toLowerCase()!=='json' && obj.dataType.toLowerCase()!=='text' && obj.dataType.toLowerCase()!=='xml'){throw new Error('dataType 非法')
}
/*
{
url:'',
method:'',
data:'',
async:'',
success:function(){},
error:'',
dataType:'text/json/xml'
}
*/
var xhr = new XMLHttpRequest;
xhr.onreadystatechange = function(){if(xhr.readyState === 4){if(parseInt(xhr.status/100) === 2){
/ 确定要不要转对象
switch(obj.dataType.toLowerCase()){
case 'json':
var res = xhr.responseText;
res = JSON.parse(res)
break;
case 'xml':
var res = xhr.responseXML;
break;
case 'text':
var res = xhr.responseText;
break;
}
resolve(res)
}else{reject()
}
}
}
xhr.open(obj.method,obj.url,obj.async)
if(obj.method.toLowerCase() === 'post' && obj.data){
/ 设置申请头
xhr.setRequestHeader('content-type','application/x-www-form-urlencoded')
xhr.send(str)
return
}
xhr.send()})
}
技术支持:微信刷步数