PHP应用开发与实践马骏第20章课程设计——微博课件教学.pptVIP

* * * * * * 传统的Web模式强制用户进入“提交→等待→重新显示”网页，用户的动作总是与服务器进行同步思考，客户在网页上的操作转化为HTTP请求传回服务器，而服务器接受请求以及相关数据、解析数据并将其发送给相应的处理单元后，将返回的数据转成HTML页返还给客户。而当服务器处理数据的时候，用户只能等待，每一步操作都需要等待服务器返回新的网页。由于每次应用的交互都需要向服务器发送请求，应用的响应时间就依赖于服务器的响应时间，这就导致了用户页面的响应比本地应用慢得多。 运用了Ajax技术的Web应用模型，它的工作原理相当于在客户端和服务器端之间添加了一个中间层，称为Ajax引擎（采用JavaScript编写，通常在一个隐藏的框架中），实现了与服务器进行异步思考的通信能力，从而使用户从请求/响应的循环中解脱出来，向服务器发出异步请求，也就是不用等待服务器的通信。所以用户不用再打开一个空白窗口，等待服务器完成后再进行响应。Ajax应用可以仅向服务器发送并取回必需的数据，它使用SOAP或其他一些基于XML的Web Service接口，并在客户端采用JavaScript处理来自服务器的响应。因为在服务器和浏览器之间交换的数据大量减少，所以Web站点看起来是即时响应的。同时很多的处理工作可以在发出请求的客户端机器上完成，所以Web服务器的处理时间也减少了。 20.6.3 Ajax的工作原理 引入Ajax的Web模型与传统的Web模型比较如图20-15所示。 图20-15 传统Web应用模型与Ajax Web应用模型的比较 使用Ajax，用户可以创建接近本地桌面应用的直接、更可用、更丰富、更动态的Web用户界面。Ajax内部工作流程如图20-16所示。 图20-16 Ajax内部工作流程图 20.6.4 Ajax的工作流程 Ajax技术中最核心的技术就是XMLHttpRequest，它是一个具有应用程序接口的JavaScript对象，能够使用超文本传输协议（Http）连接一个服务器，是微软公司为了满足开发者的需要，于1999年在IE 5.0浏览器中率先推出的。现在许多浏览器都对其提供了支持，不过实现方式与IE有所不同。 通过XMLHttpRequest对象，Ajax可以像桌面应用程序一样只同服务器进行数据层面的交换，而不用每次都刷新页面，也不用每次都将数据处理的工作交给服务器来做，这样既减轻了服务器负担又加快了响应速度、缩短了用户等待的时间。 在使用XMLHttpRequest对象发送请求和处理响应之前，首先需要初始化该对象，由于XMLHttpRequest不是一个W3C标准，所以对于不同的浏览器，初始化的方法也是不同的。 1．IE浏览器 IE浏览器把XMLHttpRequest实例化为一个ActiveX对象。具体方法如下： var http_request = new ActiveXObject(Msxml2.XMLHTTP); 或者 var http_request = new ActiveXObject(Microsoft.XMLHTTP); 说明： 上面语法中的Msxml2.XMLHTTP和Microsoft.XMLHTTP是针对IE浏览器的不同版本而进行设置的，目前比较常用的是这两种。 20.6.5 Ajax中的核心技术XMLHttpRequest 2．Mozilla、Safari等其他浏览器 Mozilla、Safari等其他浏览器把它实例化为一个本地JavaScript对象。具体方法如下： var http_request = new XMLHttpRequest(); 为了提高程序的兼容性，可以创建一个跨浏览器的XMLHttpRequest对象。创建一个跨浏览器的XMLHttpRequest对象其实很简单，只需要判断一下不同浏览器的实现方式，如果浏览器提供了XMLHttpRequest类，则直接创建一个实例，否则使用IE的ActiveX控件。具体代码如下： if (window.XMLHttpRequest) { // Mozilla、Safari…… http_request = new XMLHttpRequest(); } else if (window.ActiveXObject) { // IE浏览器 try { http_request = new ActiveXObject(Msxml2.XMLHTTP); } catch (e) { try { http_request = new ActiveXObject(Microsoft.XMLHTTP); } c