javascript跨域请求包装函数与用法示例

标签:公司介绍    日期:2018-08-09 09:52    录入:美娱国际平台注册    浏览:

  

[javascript,跨域请求,包装函数]javascript跨域请求包装函数与用法示例

  

本文实例讲述了javascript跨域请求包装函数与用法。分享给大家供大家参考,具体如下:  

  

一、源码  

  
  
  // 定义AJAX跨域请求的JSON  (function(){  if(typeof window.$JSON== 'undefined'){  window.$JSON= {};  };  $JSON._ajax = function(config){  config = config[0] || {};  this.url = config.url || '';  this.type = config.type || 'xhr';  this.method = (this.type == 'json') ? 'GET' : config.method.toUpperCase() || 'GET';  this.param = config.param || null;  this.callback = config.callback || {};  this.XHR = null;  if(typeof window._$JSON_callback == 'undefined'){  window._$JSON_callback = {};  }  this._createRequest();  };  $JSON._ajax.prototype = {  // 缓存XHR请求,再次再调用时不再进行判断  _createXHR : function(){  var methods = [  function(){ return new XMLHttpRequest(); },  function(){ return new ActiveXObject('Msxml2.XMLHTTP'); },  function(){ return new ActiveXObject('Microsoft.XMLHTTP'); }  ];  for(var i = 0, l = methods.length; i < l; i++){  try{  methods[i]();  }catch(e){  continue;  }  this._createXHR = methods[i];  return methods[i]();  }  },  // 建立XHR请求  _createRequest : function(){  return (this.type == 'json') ? this._setJSONRequest() : this._setXHRRequest();  },  _setXHRRequest : function(){  var _this = this;  var param = '';  for(var i in this.param){  if(param == ''){  param = i+'='+this.param[i];  }else{  param+= '&'+i+'='+this.param[i];  }  }  this.XHR = this._createXHR();  this.XHR.onreadystatechange = function(){  if(_this.XHR.readyState == 4 && _this.XHR.status == 200){  _this.callback.success(_this.XHR.responseText);  }else{  _this.callback.failure('重新操作');  }  };  this.XHR.open(this.method, this.url, true);  this.XHR.setRequestHeader("Content-Type","application/x-www-form-urlencoded; charset=utf-8");  this.XHR.send(param);  },  // 建立JSON请求  _setJSONRequest : function(){  var head = document.getElementsByTagName('head')[0];  var script = document.createElement('script');  var fun = this._setRandomFun();  var _this = this;  var param = '';  for(var i in this.param){  if(param == ''){  param = i+'='+this.param[i];  }else{  param+= '&'+i+'='+this.param[i];  }  }  script.type = 'text/javascript';  script.charset = 'utf-8';  if(head){  head.appendChild(script);  }else{  document.body.appendChild(script);  }  // data:为回调函数所需要传入的参数  // 定义页面中的回调函数,如例子中的"jsonpCallback()"方法  window._$JSON_callback[fun.id] = function(data){  _this.callback.success(data);  setTimeout(function(){  delete window._$JSON_callback[fun.id];  script.parentNode.removeChild(script);  }, 100);  };  script.src = this.url+'?callback='+fun.name+'&'+param;  },  // 生成随机JSON回调函数  _setRandomFun : function(){  var id = '';  do{  id = '$JSON'+Math.floor(Math.random()*10000);  }while(window._$JSON_callback[id])  return{  id : id,  name : 'window._$JSON_callback.'+id  }  }  };  window.$JSON.ajax = function(){  return new $JSON._ajax(arguments);  }  })();  
  
  

二、调用方式  

  
  
  //调用方式  var ajax = new $JSON.ajax({  url : '',  type : 'json',  method : 'get',  param: {  bar: true  },  callback : {  success : function(data){  console.log( '55668',data);  },  failure : 美娱国际娱乐 function(error){  alert(errow);  }  }  });  
  
  

更多关于JavaScript相关内容感兴趣的读者可查看本站专题:《JavaScript中ajax操作技巧总结》、《JavaScript切换特效与技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript动画特效与技巧汇总》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》  

  

希望本文所述对大家JavaScript程序设计有所帮助。

  

★★★小编:美娱国际 整理文章,欢迎大家转载 ★★★
相关文章阅读