• 创建xhr时异常处理Ajax之六


    前面几篇一直采用最精简的方式创建Ajax的核心XMLHttpRequest对象

    var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP');
    

    没有考虑其可能出现的异常,即创建失败。其实个人认为以上创建方式创建失败的几率非常之少,起码在IE6/7/8/Firefox/Safari/Chrome/Opera如此,其它浏览器就不知了。

    但作为一个基础库还是完善下,如果出现创建失败,failure的第二个参数msg将会被赋值为"create xhr failed"。

    如下

    var xhr = function(){
    	try{
    		return new XMLHttpRequest();
    	}catch(e){
    		try{
    			return new ActiveXObject('Msxml2.XMLHTTP');
    		}catch(e){
    			try{
    				return new ActiveXObject('Microsoft.XMLHTTP');
    			}catch(e){
    				failure(null,'create xhr failed',e);
    			}
    		}
    	}
    }();
    

    完整源码

    Ajax =
    function(){
    	function request(url,opt){
    		function fn(){}
    		opt = opt || {};
    		var async   = opt.async !== false,
    			method  = opt.method 	|| 'GET',
    			type    = opt.type 		|| 'text',
    			encode  = opt.encode 	|| 'UTF-8',
    			timeout = opt.timeout 	|| 0,
    			data    = opt.data 		|| null,
    			success = opt.success 	|| fn,
    			failure = opt.failure 	|| fn;
    			method  = method.toUpperCase();
    		if(data && typeof data == 'object'){//对象转换成字符串键值对
    			data = _serialize(data);
    		}
    		if(method == 'GET' && data){
    			url += (url.indexOf('?') == -1 ? '?' : '&') + data;
    			data = null;
    		}
    		var xhr = function(){
    			try{
    				return new XMLHttpRequest();
    			}catch(e){
    				try{
    					return new ActiveXObject('Msxml2.XMLHTTP');
    				}catch(e){
    					try{
    						return new ActiveXObject('Microsoft.XMLHTTP');
    					}catch(e){
    						failure(null,'create xhr failed',e);
    					}
    				}
    			}
    		}();
    		if(!xhr){return;}
    		var isTimeout = false, timer;
    		if(async && timeout>0){
    			timer = setTimeout(function(){
    				xhr.abort();
    				isTimeout = true;
    			},timeout);
    		}
    		xhr.onreadystatechange = function(){
    			if (xhr.readyState == 4 && !isTimeout){
    				_onStateChange(xhr, type, success, failure);
    				clearTimeout(timer);
    			}else{}
    		};
    		xhr.open(method,url,async);
    		if(method == 'POST'){
    			xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded;charset=' + encode);
    		}
    		xhr.send(data);
    		return xhr;	
    	}
    	function _serialize(obj){
    		var a = [];
    		for(var k in obj){
    			var val = obj[k];
    			if(val.constructor == Array){
    				for(var i=0,len=val.length;i<len;i++){
    					a.push(k + '=' + encodeURIComponent(val[i]));
    				}				
    			}else{
    				a.push(k + '=' + encodeURIComponent(val));
    			}				
    		}
    		return a.join('&');
    	}
    	function _onStateChange(xhr,type,success,failure){
    		var s = xhr.status, result;
    		if(s>= 200 && s < 300){
    			switch(type){
    				case 'text':
    					result = xhr.responseText;
    					break;
    				case 'json':
    					result = function(str){
    						return (new Function('return ' + str))();
    					}(xhr.responseText);
    					break;
    				case 'xml':
    					result = xhr.responseXML;
    					break;
    			}
    			success(result);
    		}else if(s===0){
    			failure(xhr,'request timeout');	
    		}else{
    			failure(xhr,xhr.status);
    		}
    		xhr = null;
    	}
    	return (function(){
    		var Ajax = {request:request}, types = ['text','json','xml'];
    		for(var i=0,len=types.length;i<len;i++){
    			Ajax[types[i]] = function(i){
    				return function(url,opt){
    					opt = opt || {};
    					opt.type = types[i];
    					return request(url,opt);
    				}
    			}(i);
    		}
    		return Ajax;
    	})();
    }();
    

    相关:

    ajax_06.zip

    https://github.com/snandy/io

  • 相关阅读:
    Range
    cache
    从头到尾彻底解析Hash 表算法
    教你如何迅速秒杀掉:99%的海量数据处理面试题
    秒杀抢购思路以及高并发下数据安全
    Nginx+Tomcat负载均衡
    强大的Spring缓存技术(上)
    强大的Spring缓存技术(中)
    强大的Spring缓存技术(下)
    (转)C#中的 break 与continue 的使用和注意
  • 原文地址:https://www.cnblogs.com/snandy/p/2026736.html
Copyright © 2020-2023  润新知