浅谈AJAX

+

什么是ajax？

AJAX = 异步 JavaScript 和 XML。

AJAX 是一种用于创建快速动态网页的技术。

通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。

ajax的请求步骤

function AJax(type,url,parm,callback){
		if(type === "GET"){
			 //创建异步对象
			var xhr = new XMLHttpRequest();

			//发送get请求
			xhr.open(type,url);

			//发送请求
			xhr.send();

			 //检测服务器是否把数据返回
			xhr.onreadystatechange = function(){
				if(xhr.readyState === 4 && xhr.status === 200){
					var data = xhr.responseText;
					callback(data);
				}
			}
		}else{
			var xhr = new XMLHttpRequest();
			xhr.open(type,url);
			xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
			xhr.send(parm);
			xhr.onreadystatechange = function(){
				if(xhr.readyState === 4 && xhr.status === 200){
					var data = xhr.responseText;
					
					callback(data);
				}
			}	
		}	
	}

ajax的5种工作状态

readyState：从 0 到 4 发生变化。

0（未初始化）对象已经创建，但是尚未初始化，还没调用open方法。

1（初始化）对象已经初始化，并且调用open方法，但还未调用send方法。

2（发送数据）调用send方法，但是正在等待状态码和头的返回。

3（正在接收）已经接收部分数据，因为响应和http头不完整，所以还不能使用该对象的属性和方法。

4（完成）数据接收完成，此时可以通过responseText和responseXML获取完整的响应数据。

http状态码

http状态码由三位数构成，首位数字定义了状态码的类型。

1xx：信息类，web请求正在进一步处理；

2xx：200表示返回成功；

3xx：304表示已经缓存请求；

4xx：404表示访问的页面不存在；

5xx：表示服务器错误。

ajax优缺点

ajax优点

Ajax的给我们带来的好处大家基本上都深有体会，在这里我只简单的讲几点：

1、最大的一点是页面无刷新，在页面内与服务器通信，给用户的体验非常好。

2、使用异步方式与服务器通信，不需要打断用户的操作，具有更加迅速的响应能力。

3、可以把以前一些服务器负担的工作转嫁到客户端，利用客户端闲置的能力来处理，减轻服务器和带宽的负担，节约空间和宽带租用成本。并且减轻服务器的负担，ajax的原则是“按需取数据”，可以最大程度的减少冗余请求，和响应对服务器造成的负担。

4、基于标准化的并被广泛支持的技术，不需要下载插件或者小程序。

ajax的缺点

下面我着重讲一讲ajax的缺陷，因为平时我们大多注意的都是ajax给我们所带来的好处诸如用户体验的提升。而对ajax所带来的缺陷有所忽视。

下面所阐述的ajax的缺陷都是它先天所产生的。

1、ajax干掉了back按钮，即对浏览器后退机制的破坏。后退按钮是一个标准的web站点的重要功能，但是它没法和js进行很好的合作。这是ajax所带来的一个比较严重的问题，因为用户往往是希望能够通过后退来取消前一次操作的。那么对于这个问题有没有办法？答案是肯定的，用过Gmail的知道，Gmail下面采用的ajax技术解决了这个问题，在Gmail下面是可以后退的，但是，它也并不能改变ajax的机制，它只是采用的一个比较笨但是有效的办法，即用户单击后退按钮访问历史记录时，通过创建或使用一个隐藏的IFRAME来重现页面上的变更。（例如，当用户在Google Maps中单击后退时，它在一个隐藏的IFRAME中进行搜索，然后将搜索结果反映到Ajax元素上，以便将应用程序状态恢复到当时的状态。）但是，虽然说这个问题是可以解决的，但是它所带来的开发成本是非常高的，和ajax框架所要求的快速开发是相背离的。这是ajax所带来的一个非常严重的问题。

2、安全问题 技术同时也对IT企业带来了新的安全威胁，ajax技术就如同对企业数据建立了一个直接通道。这使得开发者在不经意间会暴露比以前更多的数据和服务器逻辑。ajax的逻辑可以对客户端的安全扫描技术隐藏起来，允许黑客从远端服务器上建立新的攻击。还有ajax也难以避免一些已知的安全弱点，诸如跨站点脚步攻击、SQL注入攻击和基于credentials的安全漏洞等。

3、对搜索引擎的支持比较弱。

4、破坏了程序的异常机制。至少从目前看来，像ajax.dll，ajaxpro.dll这些ajax框架是会破坏程序的异常机制的。关于这个问题，我曾经在开发过程中遇到过，但是查了一下网上几乎没有相关的介绍。后来我自己做了一次试验，分别采用ajax和传统的form提交的模式来删除一条数据……给我们的调试带来了很大的困难。

5、另外，像其他方面的一些问题，比如说违背了url和资源定位的初衷。例如，我给你一个url地址，如果采用了ajax技术，也许你在该url地址下面看到的和我在这个url地址下看到的内容是不同的。这个和资源定位的初衷是相背离的。

6、一些手持设备（如手机、PDA等）现在还不能很好的支持ajax，比如说我们在手机的浏览器上打开采用ajax技术的网站时，它目前是不支持的，当然，这个问题和我们没太多关系。

安全问题：

ajax技术如同对企业数据建立了一个直接通道，这使开发者在不经意间会暴露比之前更多的数据和服务器逻辑；
ajax的逻辑可以对客户端的安全扫描技术隐藏起来，允许黑客从远端服务器上建立新的攻击；
ajax也难以避免一些已知的安全弱点，诸如SQL注入攻击等。
对搜索引擎支持较弱，如果ajax使用不当，会增大网络数据流量，降低整个系统的性能；
破坏程序的异常处理机制。

#传输的数据是明文还是暗文？
ajax的get和post方式请求数据都是明文。