首页 > 语言 > JavaScript > 正文

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

2024-05-06 15:07:27
字体:
来源:转载
供稿:网友

本文实例讲述了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);  }})();            
发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表

图片精选