摘  要  ASP.NET AJAX 实现了Web页面丰富的部分刷新效果。本文通过介绍AJAX原理,引申到ASP.NET AJAX原理,并总结了在Web 开发应用中要注意的若干问题。合理地利用ASP.NET AJAX技术,Web开发应用就能获得更好的交互效果。
    关键词  ASP.NET AJAX  Web开发   ASP.NET AJAX控件
 

1  引言

    当前,Web技术的不断发展使得B/S得以广泛地应用。但Web传统的开发技术使得网页的交互性能大打折扣。随着AJAX技术的兴起,Web开发技术超越了传统的开发模式,发生了质的飞跃。而微软公司推出的ASP.NET AJAX框架与ASP.NET的结合,使得Web的开发方式在.NET环境下更加简单易用,页面交互性能也得到很大提高。

2  Ajax引擎的原理

    AJAX(Asynchronous JavaScript and XML)是现有多种技术的综合,包括JavaScript、XHTML、CSS、DOM、XML、XSTL和XMLHttpRequest。AJAX使用XHTML和CSS标准化呈现数据,使用DOM实现动态显示和交互数据,使用XML和XSTL进行数据交换与处理,使用XMLHttpRequest对象进行异步数据读取,使用JavaScript绑定和处理所有数据。AJAX为交互操作较多、数据读写频繁和数据分类良好的Web应用提供了一个很好的解决方案。其中XMLHttpRequest、JavaScript和DOM是AJAX技术的核心。

2.1  XMLHttpRequest

    XMLHttpRequest是AJAX引擎的核心技术,是AJAX引擎解决无需刷新整个页面即可从服务器获取所需数据问题的关键。在微软IE 平台下XMLHttpRequest 是XMLHTTP 组件的一个对象,它通过允许开发人员在Web 页面内部使用XMLHTTP ActiveX 组件扩展自身功能,开发人员不必从当前的Web 页面导航而直接与服务器上的数据库进行双向数据传输。该项功能相当重要,它弥补了无状态连接的缺点,排除下载冗余Web 数据的需要,从而提高了进程速度。

2.2  DOM ( Document object Model )

    DOM 是给HTML 和XML 文件使用的一组API。它提供了文件的结构表述,允许开发人员改变其中的内容,建立网页与程序语言沟通的桥梁。所有Web 开发人员操作及建立文件的属性、方法及事件都以对象方式来展现,这些对象均可由当今大多数浏览器以脚本取用。一个用HTML 或XHTML 构建的网页可看作是一组结构化数据,这些数据被封在DOM (Document Object Model)中,且DOM 提供对网页中各个对象的读写支持。

2.3  JavaScript

    JavaScript是一种在浏览器中大量使用的跨平台编程语言,常被用来制作网页特效或表单验证。在AJAX 中JavaScript 则是XMLHttpRequest与DOM 交互的桥梁以及AJAX 引擎工作的主要推动力。JavaScript 通过调用XMLHttpRequest 的属性和方法获取服务器端数据,调用DOM 的API更新Web 页面内容,从而实现整个页面的无刷新更新页面的效果。

3  ASP.NET AJAX架构

    ASP.NET AJAX由客户端脚本库和服务端组件组成,这两者被集成在一起提供了一个功能强大的开发框架。客户端脚本库中包含两种最熟悉的动态网页技术,分别是跨浏览器使用的ECMAScript(JavaScript)技术和动态的HTML (DHTML)网页开发技术,并且将这两种技术集成到了ASP.NET 2.0 基于服务器端的开发平台中。图1解释说明了包含客户端脚本库和服务端组件的ASP.NET AJAX的功能。

3.1  ASP.NET服务器端架构

    ASP.NET服务器端组件由ASP.NET控件和组件构成,用于管理UI和应用程序流,管理序列,验证和控件扩展性等。此外,ASP.NET Web服务也能用于访问ASP.NET应用服务,包括窗体验证和用户验证。

3.2  ASP.NET服务器控件

    ASP.NET AJAX控件由服务器端和客户端代码构成在一起以产生类似于AJAX的行为。以下是最常用的ASP.NET AJAX控件。
    ●ScriptManager控件
    ●UpdatePanel控件
    ●UpdateProgress控件
    ●Timer控件

3.3  ASP.NET AJAX客户端架构

    ASP.NET AJAX客户端脚本库由JavaScript(.js)文件构件。这些.js文件提供了面向对象开发的特性。这一特性使得连续性和模块化在客户端脚本中达到一个新的层次。以下是ASP.NET AJAX中客户端的各个层次。
    ⑴浏览器的兼容层。通过最常用的浏览器为ASP.NET AJAX脚本提供兼容性。
    ⑵ASP.NET AJAX 核心服务,这种核心服务已经扩展到了JavaScript。例如classes,namespaces,event handling,inheritance,data types,and object serialization。
    ⑶ASP.NET AJAX基础类库,包括组件如string builders and extended error handling。
    网络工作层。该层用于处理基于Web服务和应用之间的通信,管理异步式远程方法的调用。


图1  ASP.NET AJAX服务器和客户端架构

4  ASP.NET AJAX在Web开发中的应用

4.1  ASP.NET AJAX开发环境

图2  ASP.NET AJAX服务器控件
    在Web开发应用中,利用VS2005开发工具和ASP.NET AJAX1.0框架进行Web页面的开发是值得推荐的一种方法。VS2005开发工具本身并没有集成这一框架,因此,在做Web开发时就必须安装这一框架。可以从微软官方网站上下载(www.asp.net)。下载安装后,可在VS2005开发环境中看到ASP.NET AJAX服务器控件。如图2所示。
    要注意的是,安装ASP.NET AJAX框架后,并不是VS2005开发环境中的所有页面模板都能支持AJAX技术。只有ASP.NET AJAX提供的默认模板才能支持。对于其他ASP.NET模板,如果要想支持AJAX,就必须配置Web.config文件。具体配置可以参考微软官方文档。

4.2  ASP.NET AJAX控件在Web开发中的应用

4.2.1  ScriptManager控件
    用来处理页面上的所有组件以及页面局部更新,生成相关的客户端代理脚本以便能够在JavaScript中访问Web Service,所有需要支持ASP.NET AJAX的ASP.NET页面上有且只能有一个ScriptManager控件,并且,如果要使用其他ASP.NET AJAX控件,就必须要有ScriptManager控件的支持。在ScriptManager控件中我们可以指定需要的脚本库,或者指定通过JS来调用的Web Service,还可以指定页面错误处理等。使用<asp:ScriptManager/>来定义一个ScriptManager,简单的ScriptManager定义形式是:
<asp:ScriptManager ID="ScriptManager1"  runat="server">
  <AuthenticationService Path="" />
   <ProfileService LoadProperties="" Path="" />
      <Scripts>
   <asp:ScriptReference/>
     </Scripts>
      <Services>
   <asp:ServiceReference />
  </Services>
</asp:ScriptManager>
    默认情况下,ScriptManager控件为页面中的微软脚本库注册脚本。以使客户端脚本库进行各种系统扩展,并且支持局部页面刷新和Web Services回调的特性。在Web应用开发中,ScriptManager控件是必须的。要使用ASP.NET AJAX控件,每个.aspx页面上必须有且只有一个ScriptMangeger控件。当.aspx页面与母版页结合作为内容页使用时,只须在母版页上放置一个ScriptManger控件,内容页上无须再放该控件。
    值得注意的是,页面上任何用ScriptManger控件注册的脚本和所有事件处理脚本都必须在页面<form>元素内。否则脚本将不会被注册或者被执行。
4.2.2  UpdatePanel控件
    该控件可以用来创建丰富的局部更新Web应用程序,它是ASP.NET 2.0 AJAX Extensions中很重要的一个控件,其强大之处在于不用编写任何客户端脚本,只要在一个页面上添加几个UpdatePanel控件和一个ScriptManager控件就可以自动实现局部更新。一个页面上可以放一个或者多个UpdatePanel控件,并且UpdatePanel控件还可以嵌套使用。UpdatePanel的工作依赖于ScriptManager服务端控件和客户端PageRequestManager类。当ScriptManager中允许页面局部更新时,它会以异步的方式回传给服务器,与传统的整页回传方式不同的是只有包含在UpdatePanel中的页面部分会被更新,在从服务端返回HTML之后,PageRequestManager会通过操作DOM对象来替换需要更新的代码片段。UpdatePanel的工作原理如图3如示。


图3  UpdatePanel的工作原理图

posted on 2008-10-31 09:58  poop  阅读(220)  评论(0编辑  收藏  举报