HBuilder开发APP（二）——网络请求

        mui框架中给我们封装好了常用的Ajax函数，是基于XMLHttpRequest，支持GET、POST请求方式，支持返回json、xml、html、text、script数据类型。

        mui常用的请求方法：

        1、mui.ajax() ——最初的请求方法，可设置请求方式（GET、POST）、同步/异步、超时时间、请求头、返回数据类型、跨域等；

        2、mui.get() ——直接使用GET请求方式向服务器发送数据，不处理超时和异常；

        3、mui.post() ——直接使用POST请求方式向服务器发送数据，不处理超时和异常；

        4、mui.getJSON() —— 在mui.get()方法上进行简化，限定返回json格式的数据，其用法和mui.get()相同。

不再BB，用代码说话。

	
		
		
		
		
		

		
		
	

	
		

			
			
网络请求
		
		

			

					
				

					发送请求
				
				
响应结果：
				
			
		
		
	

        上面的代码中我们使用mui.ajax() GET方式进行请求数据，我们简单设置了请求类型、返回数据类型、成功回调等，当然我们还可以设置失败回调error以及超时timeout等，小伙伴们可以自己亲自设置运行一下，请求数据的写法就这么简单，一看就明白，在这里就不做解释了。在这里我们拓展分析一下上面代码中(function($){.......})(mui)这个函数。

        (function($){.......})(mui); 这实际上是一个匿名函数，就比如 function(arg){......};参数为arg，当我们调用函数时要在函数后面加上传递的实参，比如function(arg){......}(param);  但由于操作符的优先级，函数本身也要用括号括起来，即(function(arg){......})(param)，后面括号中的param就是我们传递的实参。所以(function($){......})(mui)是一个参数为$的匿名函数，并将mui作为参数来调用这个匿名函数（mui是全局变量，会自动执行函数），之所以使用$作为形参，是为了不与其他库冲突。

        熟悉JQuery的司机师傅们经常会开到这种车，为啥？因为这样做有一个极大的好处，就是形成闭包，在(function($){......})(mui)内部定义的变量和函数只在此范围内有效，不增加额外的全局变量，不会影响到外部，保护函数内的变量安全，加强了封装性。听着是不是很棒棒啊？不过任何东西都具有两面性，有好处就有坏处，闭包虽好，也不能滥用哦。。。闭包最大的缺点就是常驻内存，会增大内存使用量，使用不当会造成内存泄漏的。所以，司机师傅们，开车需谨慎，安全最重要。

        好了，我们接下来看看其他请求数据的方法：

mui.ajax() POST请求方法：

mui.ajax(url,{
	data:{
		param: value,
		param: value
	},
	dataType:'json',//服务器返回json格式数据
	type:'post',//HTTP请求类型
	timeout:10000,//超时时间设置为10秒；
	headers:{'Content-Type':'application/json'},//设置请求头              
	success:function(data){
		//服务器返回响应，根据响应结果，分析是否登录成功；
		...
	},
	error:function(xhr,type,errorThrown){
		//异常处理；
		console.log(type);
	}
});

mui.get()请求方法：

mui.get(url,{param:value},function(data){
		//获得服务器响应
		...
	},'json'
);

mui.post()请求方法：

mui.post(url,{
		param: value,
		param: value
	},function(data){
		//服务器返回响应，根据响应结果，分析是否登录成功；
		...
	},'json'
);

mui.getJSON()请求方法：

mui.getJSON(url,{param:value},function(data){
		//获得服务器响应
		...
	}
);

后面的三种方法都是从mui.ajax()方法中简化封装过来的，用法基本都一样。

下面是请求数据的Demo图：

好了，不能再瞎BB了，到点了，该去要饭了……