让UpdatePanel支持文件上传（5）：支持页面重定向的HttpModule-白红宇

我们现在试用一下这个组件。

　　首先，我们将AjaxUploadHelper控件放置在页面中，紧跟在ScriptManager之后，因为AjaxUploadHelpe需要在第一时间告诉ScriptManager目前正处在一个异步刷新的过程中。

使用AjaxFileUploadHelper控件

<%@ Register Assembly="AjaxFileUploadHelper" Namespace="Jeffz.Web" TagPrefix="jeffz" %>//...
    
    //...

接着，在页面上添加一个UpdatePanel，并在其中放置一个FileUpload控件，一个按钮以及一个Label。为了更容易地看出异步刷新的效果，我们在页面上添加两个时间：

Page

<%= DateTime.Now %>
        
     
              <%= DateTime.Now %>

在Code Behind代码中，我们为Button添加Event handler：

Code Behind

protected void Button1_Click(object sender, EventArgs e){    if (this.FileUpload1.PostedFile != null)    {        this.Label1.Text = this.FileUpload1.PostedFile.ContentLength + " bytes";    }    else    {        this.Label1.Text = "";    }}

打开页面，我们可以看到页面中显示了那些控件和两个时间。

　　选择一个文件并点击Upload按钮，我们可以发现只有UpdatePanel内部的时间被改变了，文件大小也显示在了页面上：

很震撼吧？但是如果我们改变Code Behind中的代码：

改变Code Behind中的代码

protected void Button1_Click(object sender, EventArgs e){    this.Response.Redirect("AnotherPage.aspx", true);}

刷新页面，点击按钮，您就会发现……失败了？为什么？

　　原因如下：在一个“普通”的PostBack时，如果我们在执行了Redirect方法，浏览器将会接受到一个Status Code为302的Response，以及一个跳转目标。接着浏览器就会将用户带去指定的目标页面。当XHR发出的请求得到这样一个Response之后，它将会自动重新请求而不会告诉客户端究竟发生了什么。这时，客户端只能获得目标跳转之后的资源，而并非起初请求的资源。

　　因此，ASP.NET AJAX提供了一个组件来支持异步PostBack时的跳转。这个组件就是ScriptModule，我们可以在web.config文件中找到它的注册信息。

web.config文件的信息

下面的代码片断就是它解决这个问题的实现：

ScriptModule

public class ScriptModule : IHttpModule{    protected virtual void Init(HttpApplication context)    {        context.PreSendRequestHeaders += new EventHandler(PreSendRequestHeadersHandler);        // ...    }    private void PreSendRequestHeadersHandler(object sender, EventArgs args)    {        HttpApplication application = (HttpApplication)sender;        HttpResponse response = application.Response;        if (response.StatusCode == 302)        {            if (PageRequestManager.IsAsyncPostBackRequest(application.Request.Headers))            {                   string redirectLocation = response.RedirectLocation;                List
    
      cookies = new List
     
      (response.Cookies.Count);                for (int i = 0; i < response.Cookies.Count; i++) {                    cookies.Add(response.Cookies[i]);                }                response.ClearContent();                response.ClearHeaders();                for (int i = 0; i < cookies.Count; i++)                {                    response.AppendCookie(cookies[i]);                }                response.Cache.SetCacheability(HttpCacheability.NoCache);                response.ContentType = "text/plain";                            }            else if //...        }    }}

我们响应了PreSendRequestHeaders事件，它将会在服务器端发送Header信息之前被触发。此时，如果Status Code为302（表示Response将要使客户端跳转到另一个页面去），则会清除所有即将发送的内容，并重新指定传输的信息。在这里最重要的修改就是Response Body的内容。因为客户端将要解析收到的字符串，因此我们必须发送格式为“length|type|id|content”。请注意上方红色的代码，它将会发送一段格式合法的字符串，例如“16|pageRedirect||/AnotherPage.aspx|”。

　　在客户端，我们可以找到下面的实现，它的作用是在收到页面重定向的信息之后跳转页面。请注意下方红色的代码：

客户端支持页面重定向的代码

function Sys$WebForms$PageRequestManager$_onFormSubmitCompleted(sender, eventArgs){    // ...    for (var i = 0; i < delta.length; i++) {        var deltaNode = delta[i];        switch (deltaNode.type) {            case "updatePanel":                Array.add(updatePanelNodes, deltaNode);                break;	    // ...                        //...        }    }    // ...}

明白了这点之后，我们也就能够轻松地编写一个这样的模块了：

AjaxFileUploadModule

public class AjaxFileUploadModule : IHttpModule{    public void Init(HttpApplication context)    {        context.PreSendRequestHeaders += new EventHandler(PreSendRequestHeadersHandler);    }    private void PreSendRequestHeadersHandler(object sender, EventArgs e)    {        HttpApplication application = (HttpApplication)sender;        HttpResponse response = application.Response;        if (response.StatusCode == 302 &&             )        {            string redirectLocation = response.RedirectLocation;            List
    
      cookies = new List
     
      (response.Cookies.Count);            for (int i = 0; i < response.Cookies.Count; i++)            {                cookies.Add(response.Cookies[i]);            }            response.ClearContent();            response.ClearHeaders();            for (int i = 0; i < cookies.Count; i++)            {                response.AppendCookie(cookies[i]);            }            response.Cache.SetCacheability(HttpCacheability.NoCache);            response.ContentType = "text/plain";                        response.End();        }    }    public void Dispose() {}}

上方红色的代码为我们的Module与ASP.NET AJAX中的ScriptModule之间唯一的区别。我们在web.config文件中注册了AjaxFileUploadModule之后，我们在服务器端调用Redirect方法之后，在客户端就能进行跳转了。此时客户端接收到的文本如下：

客户端收到的文本

本文转自 jeffz 51CTO博客，原文链接：http://blog.51cto.com/jeffz/59904，如需转载请自行联系原作者