RIA ajax 第一篇

 与之前简单的DHTML相比，RIA的特点是：允许在同一个页面多次发送请求，都将传统Web应用的每次请求与对应的页面拆分，页面只是单纯的视图，负责显示数据，而请求与页面之间并无一一对应的关系。

就某种程度而言：Ajax=DHTML+异步发送请求，也包括动态加载服务器数据

动态加载服务器数据：使用RIA能避免频繁刷新页面，服务器响应的是数据，而不是整个页面内容。RIA负责获取服务器数据，然后将其动态加载到浏览器中

Ajax：Ajax通过在浏览器和服务器之间添加Ajax中间层，允许浏览器异步发送请求，同时允许动态添加载服务器响应，用户的请求不再直接向服务器提交，而是使用XmlHttpRequest异步的向服务器发送，从而避免了丢弃当前页面。

Ajax的工作方式：

核心：JavaScript对象的XMLHttpRequest：浏览器通过客户端脚本与服务器交换数据，Web页面无需频繁重新加载，Web页面的内容也由客户端脚本动态更新。

1>.javaScript脚本使用XMLHttpRequest对象向服务器发送请求，发送请求时既可以发送GET请求，也可以发送POST请求。

2>.javascript脚本使用XMLHttpRequest对象解析服务器响应数据。

3>.javascript脚本通过DOM动态更新HTML页面，也可以为服务器数据增加CSS样式表，在当前页面的某个部分加以显示。

XMLHttpRequest：是Ajax技术的灵魂，ajax技术的核心是异步发送请求，而XMLHttpRquest则是异步发送请求的对象

跨浏览器创建XMLHttpRequest对象：

function()

{

 //对基于Mozilla的浏览器

If(window.XMLHTTPRequest){

//对基于Mozilla的浏览器，直接创建XMLHttpRequest对象

 Return new XMLHttpRequest();

}

//对于IE的浏览器

else if(window.ActiveXObject)

{

  //IE浏览器中XMLHTTP的实现版本并不相同

   var msxmls = [“MSXML3,”MSXML2”,”Microsoft”];

   for(var I = 0;i<msxmls.length;i++)

{

     Try

{

 //创建XMLHTTP组件

 return new ActiveXObject(msxmls[i]+”.XMLHTTP”); 

}catch(e)

{

   Alert(“浏览器不支持XMLHTTP控件”);

}

}

}

}

XMLHttpRequest是浏览器与服务器交换信息的载体

 

Ajax的编程脚本：javascript语言

1.       创建XMLHttpRequst对象

2.       通过XMLHttpRequst向服务器发送请求。

3.       创建回调函数，监视服务器响应状态，在服务器响应完成后，回调函数启动。

4.       回调函数通过DOM动态更新HTML页面

Javascript是ajax技术的粘合剂，通过将其他几种技术有机的结合在一起，从而形成了Ajax技术。

HTML页面的DOM模型:

DOM(Document Object Model)是操作HTML和XMl文件的一组API，它提供了文件的结构表述。可以采用编程方式操作文档结构，可以改变文档的内容，通过DOM，文档页面以一种结构化的方式组织在一起，HTML页面的内容以节点的方式组织。DOM提供了动态改变HTML页面内容的方法。DOM也是Ajax的核心技术，没有DOM，javascript在获取服务器数据后无法动态更新HTML页面。DOM也是jacascript获取页面数据的方式。

 

数据的交换和显示：

Css:几乎所有浏览器都支持

支持丰富的表现效果

页面字体更漂亮，更容易编排，页面效果更加美观

支持更好地页面布局。

同一个CSS可以同时控制多个页面

CSS并不是Ajax所必须的，但对于实际应用，用户界面的友好非常重要，因此CSS也是必不可少的技术

XML：是一种结构化文档：

      用于简单数据的表示和交换

      用于面向消息的计算

      与用户界面相关，表示相关的上下文

Ajax的基本特征：

1.       异步发送请求：是Ajax应用最核心的内容。

2.       服务器响应的是数据而不是页面内容

在Ajax应用中，网络负载主要集中在应用加载期，也就是页面第一次下载时，一旦页面下载成功后，则相当于在客户端部署了复杂的应用，而后面的操作室相当迅速的，客户端的javascript负责与服务器通信，从服务器获取必须更新的部分数据，而不再刷新整个页面的内容。

3.       浏览器中的是应用，而不是简单的视图

传统Web应用中浏览器只是简单的视图，负责显示系统的状态，并收集用户信息提交给服务器，浏览器没有任何逻辑功能。，传统Web应用中也不允许浏览器中包含逻辑/用户的会话状态，因为如果在页面中包含逻辑，则随着用户请求的提交，页面被丢弃，所有的逻辑都将丢弃。

 

对于Ajax应用则完全不同，浏览器不仅可以包含简单的逻辑，甚至可以保存用户会话状态，因为Ajax应用的特点：无刷新页面即可完成内容的动态更新。

Ajax应用初始化时，需要加载大量的javascript代码，这些代码中已经包含了部分业务逻辑，将在后台默默工作，负责处理部分逻辑，异步提交请求，以及读取服务器响应数据，动态更新页面

Ajax的替代技术：Ajax本质是一种RIA，而构建RIA,并非Ajax一个

                Sun 的 java Web Start 技术：是java提供的通过Web部署应用程序的解决方案，提供了基于b/s模式的c/s应用的解决方案，比较传统的b/s应用有更好地特性

 Microsoft的ClickOnce技术-是一种部署技术，开发出基于b/s架构的windows程序，这种应用程序可以通过windows窗体丰富的用户界面和响应性

    基于Flash的Flex

                Flex应用框架由MXML,ActionScript及Flex类库构成。开发人员利用MXML及ActionScript编写Flex应用程序，利用MXML定义程序用户界面元素，利用ActionScript定义客户逻辑与程序控制。Flex类库中包括Flex组件，管理器及行为。

对比三种技术：java web Start 和 ClickOnce 本质上还是一种c/s结构应用，只是这种应用转以HTML页面为容器，因此可以自动安装和更新客户端程序，都是对于传统c/s结构应用的改进，而不是对b/s结构应用的改进。

基于Flash的Flex应用提供比Ajax更好地用户界面，因为Flash起初的目标就是制作网页动画，它支持非常丰富的图形界面。

如果需要客户端完成相当多的业务逻辑，而且应用大部分在局域网内进行，可以采用java Web start 和ClickOnce技术，如果需要运行在不同平台上，使用java web start ，如果应用需要非常丰富的客户端表现效果，如游戏，则应考虑使用Flash。

Ajax 综合了三项技术的优点，但达不到三者的强项上的高度，javascript要完全达到java web start /clickOnce 那种桌面应用的界面，难度相当大（商用的javascript库bindows做的非常出色）而要达到Flash 那么丰富的动画效果，则更不可思议。而java web start /clickonce毕竟不是对b/s结构应用的改进，而是对传统c/s结构应用的改进。