一起来学ASP.NET Ajax(四)之异步通信层

来源：互联网发布：java正则匹配时间格式编辑：程序博客网时间：2024/05/17 02:45

这篇博客我们来看ASP.NET AJAX中数据的交换过程。

Employee类：

/// <summary>/// Employee类/// </summary>public class Employee{private string _FirstName;private string _LastName;private string _Title;public Employee() { }    /// <summary>    /// 带参数构造函数    /// </summary>    /// <param name="firstName">姓</param>    /// <param name="lastName">名</param>    /// <param name="title">职位</param>public Employee(string firstName, string lastName, string title){this._FirstName = firstName;this._LastName = lastName;this._Title = title;}    /// <summary>    /// 姓    /// </summary>public string FirstName{get{return this._FirstName;}}    /// <summary>    /// 名    /// </summary>public string LastName{get{return this._LastName;}}    /// <summary>    /// 职位    /// </summary>public string Title{get{return this._Title;}}}

客户端代码

GetEmployee.ashx

<%@ WebHandler Language="C#" Class="AspNetAjaxOverview.GetEmployee" %>using System;using System.Web;using System.Web.Script.Serialization;namespace AspNetAjaxOverview{public class GetEmployee : IHttpHandler{public void ProcessRequest(HttpContext context){context.Response.ContentType = "text/plain";//获取姓、名、职位string firstName = context.Request.Params["firstName"];string lastName = context.Request.Params["lastName"];string title = context.Request.Params["title"];            //实例Employee类Employee employee = new Employee(firstName, lastName, title);            //序列化为json字符串JavaScriptSerializer serializer = new JavaScriptSerializer();string jsonEmp = serializer.Serialize(employee);//响应请求context.Response.Write(jsonEmp);}public bool IsReusable{get{return false;}}}}

服务端代码

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="2异步通信.aspx.cs" Inherits="_2异步通信" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server">    <title>异步通信</title></head><body>    <form id="form1" runat="server">        <asp:ScriptManager ID="ScriptManager1" runat="server">        </asp:ScriptManager>    <script type="text/javascript" >        function showEmployee(firstName, lastName, title) {                //将字符串转义    var requestBody = String.format("firstName={0}&lastName={1}&title={2}",encodeURIComponent(firstName),encodeURIComponent(lastName),encodeURIComponent(title));    var request = new Sys.Net.WebRequest();                //请求服务端地址    request.set_url('GetEmployee.ashx');                //请求方式：POST    request.set_httpVerb("POST");                //注册回调函数    request.add_completed(onGetEmployeeComplete);                //设置请求    request.set_body(requestBody);                //提交请求request.invoke();}            //回调函数function onGetEmployeeComplete(response) {            //响应是否可用if (response.get_responseAvailable()) {                //获取对象    var employee = response.get_object();                    //直接使用对象的属性即可alert(String.format("Hello I'm {0} {1}, my title is '{2}'",employee.FirstName,employee.LastName,employee.Title));}}</script><!--提示姓名、职位--><input id="Button1" type="button" value="Bill Gates"onclick="showEmployee('Bill', 'Gates', 'Chair man')" /><input id="Button2" type="button" value="Steve Ballmer"onclick="showEmployee('Steve', 'Ballmer', 'CEO')" />    </form></body></html>

运行结果

数据交换过程，为了直观展示，采用时序图方式：

可以看到中间的JavaScript就相当于一个异步通信层，负责对browser和server之间进行数据交换。