• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号
登陆 注册

Asp.netAjax的使用

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

原文:http://www.cnblogs.com/AndyGe/archive/2009/08/13/1545319.html

1.   Asp.net ajax底层异步通信机制：XMLHTTP

对于Asp.net ajax是如何实现底层的异步通信呢？其实关于这一块的技术XMLHttp早就出现了，只不过最近两年才被给予了高度的重视。在Asp.net Ajax的客户端框架中，提供了诸如Sys.Net.WebRequest这样的类型，我们可以通过创建一个该类型的对象，并指定其要调用的服务器端的页面地址，以及对应的参数、超时时间等。但这只不过是对XmlHttp这一技术的包装而已。

1.1. Ajax的技术构成

技术构成如下：

Ø XMLHTTP对象，内置于浏览器中，实现了客户端和服务器端的异步通信。

Ø JSON或者XML，他们定义了客户端和服务器端数据交换的格式。

Ø HTML、CSS，数据表现技术。

Ø JAVASCRIPT，通过JavaScript来操纵浏览器的ＤＯＭ对象模型，从而实现人机交互。

1.2. 定义一个XmlHttp对象

下面的代码就创建了一个跨浏览器的XmlHttp对象的创建方法。

    function CreateXMLHTTP()

    {          

            var xmlhttp;       

            if(window.XMLHTTPRequest)

            {                  

                    xmlhttp=new XMLHTTPRequest();      

            }

            else if(window.ActiveXObject)

            {                  

                    try

                    {                          

                            xmlhttp=new ActiveXObject("Msxml2.XMLHTTP");                       

                    }

                    catch(el)

                    {

                            xmlhttp=new ActiveXObject("Msxml.XMLHTTP");                

                    }

            }

            if(xmlhttp == null)

                throw "创建xmlHttp对象失败";

            else

                return xmlhttp;       

                }

1.3. XmlHttp对象的Open方法

例如通过上面的方法创建了一个xmlHttp对象，可以按照如下的方式调用它的Open方法。

xmlHttp.Open(http-method, url, async, userID, password)

Open方法中包含了5个参数，前三个是必要的，后两个是可选的(在服务器需要进行身份验证时提供)。参数的含义如下所示：

Ø http-method： HTTP的通信方式，比如GET或是 POST

Ø url： 接收XML数据的服务器的URL地址。通常在URL中要指明 ASP或CGI程序

Ø async： 一个布尔标识，说明请求是否为异步的。如果是异步通信方式(true)，客户机就不等待服务器的响应；如果是同步方式(false)，客户机就要等到服务器返回消息后才去执行其他操作

Ø userID 用户ID，用于服务器身份验证

Ø password 用户密码，用于服务器身份验证

1.4. XmlHttp异步处理方式

通过设定xmlHttp对象的onreadystatechange属性，我们可以指定当xmlhttp对象的状态发生更改时候的处理函数，如：

xmlhttp.onreadystatechange =  HandleStateChange;

1.5. XmlHttp对象的Send方法

用Open方法对xmlHttp对象进行初始化后，调用Send方法发送数据：

xmlhttp.Send(data)

Send方法的参数类型是Variant，可以是字符串、DOM树或任意数据流。发送数据的方式分为同步和异步两种。在异步方式下，数据包一旦发送完毕，就结束Send进程，客户机执行其他的操作；而在同步方式下，客户机要等到服务器返回确认消息后才结束Send进程。

1.6. xmlHttp对象的异步处理函数

1.6.1.   readyState

XMLHTTP对象中的readyState属性能够反映出服务器在处理请求时的进展状况。客户机的程序可以根据这个状态信息设置相应的事件处理方法。属性值及其含义如下表所示：

0 (未初始化)

对象已建立，但是尚未初始化（尚未调用open方法）

1 (初始化)

对象已建立，尚未调用send方法

2 (发送数据)

send方法已调用，但是当前的状态及http头未知

3 (数据传送中)

已接收部分数据，因为响应及http头不全，这时通过responseBody和responseText获取部分数据会出现错误，

4 (完成)

数据接收完毕,此时可以通过通过responseBody和responseText获取完整的回应数据

1.6.2.   客户机处理响应信息

客户机接收到返回消息后，进行简单的处理，基本上就完成了C/S之间的一个交互周期。客户机接收响应是通过XMLHTTP对象的属性实现的：

Ø responseTxt：将返回消息作为文本字符串；

Ø responseXML：将返回消息视为XML文档，在服务器响应消息中含有XML数据时使用；

Ø responseStream：将返回消息视为Stream对象

1.6.3.   status

通过判断XMLHTTP对象的status，我们可以具体的判断本次请求的实际情况，成功，失败，根据这些状态码我们就可以调用执行成功或者失败的回调函数。长整形标准xmlhttp状态码，定义如下：

Number

Description

100

Continue

101

Switching protocols

200

OK

201

Created

202

Accepted

203

Non-Authoritative   Information

204

No Content

205

Reset Content

206

Partial Content

300

Multiple Choices

301

Moved Permanently

302

Found

303

See Other

304

Not Modified

305

Use Proxy

307

Temporary Redirect

400

Bad Request

401

Unauthorized

402

Payment Required

403

Forbidden

404

Not Found

405

Method Not Allowed

406

Not Acceptable

407

Proxy Authentication   Required

408

Request Timeout

409

Conflict

410

Gone

411

Length Required

412

Precondition Failed

413

Request Entity Too   Large

414

Request-URI Too Long

415

Unsupported Media Type

416

Requested Range Not   Suitable

417

Expectation Failed

500

Internal Server Error

501

Not Implemented

502

Bad Gateway

503

Service Unavailable

504

Gateway Timeout

505

HTTP Version Not   Supported


如：

 

function HandleStateChange()

{

if (xmlhttp.readyState == 4) //客户端已经完全加载完毕

{

                   if(xmlhttp.status == 200)

{

                             alert("Result = " + xmlhttp.responseXML.xml);

        //成功执行，调用成功执行的回调函数

}

else

{

       

}

          //…

}

else

                   ….

}


2.   Asp.net Ajax系统框架

Asp.net Ajax提供了完整的客户端和服务器端的模型框架。客户端与服务器端的通信模型。


2.1. 客户端框架

只要当前的页面中，包含引用ScriptManager控件，系统就会将“MicrosoftAjax.js”加载到客户端，完成整个客户端架构的构建。关于客户端的架构结构请参考下图：


具体的类库截图如下：


2.2. 服务器端框架

服务器端的模型分层如下：


Asp.net Ajax框架提供的服务器端的类库如下：


3.   针对JavaScript基本类型的扩展

JavaScript是一门非常强大的基于对象（Object Based）的语言，但是对面向对象（Object Oriented）的支持还存在一些不足，同时JavaScript内建的类库也比较简单，甚至缺乏一些很常用的功能。ASP.NET ajax在运行时扩展了JavaScript，大大增强了它的面向对象支持能力，并扩展了一些开发时常用的操作。

3.1. String对象的扩展

Name

Description

endsWith Function

Determines whether the end of the String object matches the specified   string.

format Function

Replaces each format item in a String object with the text equivalent of   a corresponding object's value.

localeFormat Function

Replaces the format items in a String object with the text equivalent of   a corresponding object's value. The current culture is used to format dates   and numbers.

startsWith Function

Determines whether the start of the String object matches the specified   string.

trim Function

Removes leading and trailing white space from a String object instance.

trimEnd Function

Removes trailing white space from a String object instance.

trimStart Function

Removes leading white space from a String object instance.

3.2. Array对象的扩展

Name

Description

add Function

Adds an element to the end of an Array object.

addRange Function

Copies all the elements of the specified array to the end of an Array   object.

clear Function

Removes all elements from an Array object.

clone Function

Creates a shallow copy of an Array object.

contains Function

Determines whether an element is in an Array object.

dequeue Function

Removes the first element from an Array object.

enqueue Function

Adds an element to the end of an Array object.

note

Use the add function   instead of the Array.enqueue   function.

forEach Function

Performs a specified action on each element of an Array object.

indexOf Function

Searches for the specified element of an Array object and returns its   index.

insert Function

Inserts a value at the specified location in an Array object.

parse Function

Creates an Array object from a string representation.

remove Function

Removes the first occurrence of an element in an Array object.

removeAt Function

Removes an element at the specified location in an Array object.

3.3. Date对象的扩展

Name

Description

format Function

Formats a date by using the invariant (culture-independent) culture.

localeFormat Function

Creates a date from a locale-specific string using the current culture.

parseLocale Function

Creates a date from a locale-specific string using the current culture.

parseInvariant Function

Creates a date from a string using the invariant culture.

3.4. Number对象的扩展

Name

Description

format Function

Formats a number by using the invariant culture.

该文章已有0人参与评论

请发表评论

全部评论

专题导读
More+
上一篇：
C#ASP.NETMVC5路由系统机制详细讲解(转)发布时间：2022-07-10
下一篇：
OwinSelfHostAsp.netWebApi遇到Notypewasfoundthatmatchesthecontrollernamed'Control ...发布时间：2022-07-10
热门推荐
More+
热门话题
More+
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服（服务时间 9:00～18:00）

在线QQ客服
地址：深圳市南山区西丽大学城创智工业园
电邮：jeky_zhao#qq.com
移动电话：139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap