ASP.NET MVC – 使用Post, Redirect, Get (PRG)模式)

來源:互聯網
上載者:User

ASP.NET MVC模式通過重新引進已經丟失的,或者至少已經沒有使用很多年的模式,使其本身趨向更簡單和“真實”的 HTTP體驗(原文:The ASP.NET MVC pattern tends to lead itself into a more simplified and "true" HTTP experience by re-introducing  patterns that have been lost, or at least, not followed in many years)。其中的一種模式是Post,Redirect,Get(PRG)模式,它可以"避免二次提交和允許web應用程式使用瀏覽器書籤和reload按鈕來更直觀的表現"(Wikipedia).

一個普通的ASP.NET Web Form生命週期具有下述的模式:

1. HTTP GET of "Create.aspx"
    2. HTTP POST of "Create.aspx"
    3. Validation Fails, "Create.aspx" is Re-Rendered
    4. HTTP POST of "Create.aspx"
    5. Item is created, "Create.aspx" is Re-Rendered with confirmation message

這種Postback模式的主要問題是,在第3步或者第5步點擊瀏覽器的重新整理按鈕的時候,將會重新Post你已經提交的資料。第5步還存在的一個問題是它甚至可能會重新提交已經建立了的資料(譯註:即二次提交,建立了兩條相同的資料)。當然,你可以在以上的步驟中處理這些問題,但預設情況下ASP.NET Web Form是這樣對待它的。

將這同樣的情況放到ASP.NET MVC中,可以通過呈現一個來自你的POST action的"Create"視圖來實現同樣的方式。例如:

1. HTTP GET of "/products/create", "Create" view is rendered
    2. HTTP POST to "/products/submit"
    3. Validation Fails, "Create" view is rendered
    4. HTTP POST to "/products/submit"
    5. Item is created, "Confirm" view is rendered

就和你注意到的一樣,ASP.NET Web Form存在的問題,在ASP.NET MVC中也存在同樣的問題。真正漂亮的選擇是,ASP.NET MVC給予我們更多的"自由"來處理這個流程。如果我們在ASP.NET MVC中嚴格的按照PRG模式,它看起來應該像:

1. HTTP GET of "/products/create", "Create" view is rendered
    2. HTTP POST to "/products/submit"
    3. Validation Fails, redirect to "/products/create", "Create" view is rendered
    4. HTTP POST to "/products/submit"
    5. Item is created, redirect to "/products/confirm", "Confirm" view is rendered

如你所見,我們之前會出現問題的第3步和第5步,不會再存在問題。如果一個使用者以上的任何一個步驟按下重新整理按鈕,他們不會看到如所示的可愛的“Would you like to resubmit the form data”的確認資訊,而頁面只是重新載入了。

要實現這個,你需要1個Controller,3個Action方法,和2個views。跟隨下面的步驟實現這個模式:

using System.Web.Mvc;public class ProductsController : Controller{  public ActionResult Create() { ... }  public ActionResult Submit() { ... }  public ActionResult Confirm() { ... }}

當你實現你的 Create action,你要記住的是驗證可能是失敗的而你可能要重新顯示這個表單。TempData是最適合在這種情況下使用的,它如下實現:

public ActionResult Create(){  if (TempData["ErrorMessage"] != null)  {    ViewData["ErrorMessage"] = TempData["ErrorMessage"];    ViewData["Name"] = TempData["Name"];     ViewData["Price"] = TempData["Price"];    ViewData["Quantity"] = TempData["Quantity"];   }   return RenderView();}

接下來你要實現你的 Submit action。這裡將會處理使用者輸入資料的驗證,如果驗證通過則儲存資料並重新導向到 Confirm action。如果驗證失敗將會把表單資料儲存到TempData中並重新導向到 Create action。我們類比的這個方式在驗證失敗的情況下也會維持視圖資料。

public ActionResult Submit(){   string error = null;  string name = Request.Form["Name"];  if (string.IsNullOrEmpty(name))   {     error = "Name is empty. ";   }   decimal price;  if (!decimal.TryParse(Request.Form["Price"], out price))    {     error += "Price is invalid. ";   }   int quantity;   if (!int.TryParse(Request.Form["Quantity"], out quantity))    {     error += "Quantity is invalid.";    }   if (!string.IsNullOrEmpty(error))   {     TempData["ErrorMessage"] = error;    TempData["Name"] = Request.Form["Name"];     TempData["Price"] = Request.Form["Price"];     TempData["Quantity"] = Request.Form["Quantity"];     return RedirectToAction("Create");   }   else   {     return RedirectToAction("Confirm");   } }

這裡注意上面的樣本中一些很重要的東西是,儘管我把form中所有的資料放入到本地變數中,可能Price或者Quantity其中任何一個轉換失敗,而我將TempData用上面的本地變數(譯註:指上面的紅色部分)賦值...我將丟失使用者輸入的資料。所以,從Form中取得資料並直接存入到TempData中始終是一個聰明的主意。最後,需要實現 Confrim action :

public ActionResult Confirm(){   return RenderView(); //譯註:參數為空白時將呈現和action同名的view}
 

現在,是時候來建立我們的視圖了:

~/Views/Products/Create.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Create.aspx.cs" Inherits="Views_Products_Create" %><html xmlns="http://www.w3.org/1999/xhtml">  <head runat="server">    <title>Create Product</title>  </head>  <body>    <% using (Html.Form<ProductsController>(c => c.Submit())) { %>      <% if (!string.IsNullOrEmpty((string) ViewData["ErrorMessage"])) { %>    <div style="color:Red;">      <%= ViewData["ErrorMessage"] %>    </div>    <% } %>    Name: <%= Html.TextBox("Name", ViewData["Name"]) %><br />    Price: <%= Html.TextBox("Price", ViewData["Price"]) %><br />    Quantity: <%= Html.TextBox("Quantity", ViewData["Quantity"]) %><br />    <%= Html.SubmitButton("submitButton", "Save") %>    <% } %>  </body></html>

~/Views/Products/Confirm.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Confirm.aspx.cs" Inherits="Views_Products_Confirm" %><html xmlns="http://www.w3.org/1999/xhtml">  <head id="Head1" runat="server">    <title>Confirm Create Product</title>  </head>  <body>    Thanks for creating your product.    <%= Html.ActionLink<ProductsController>(c => c.Create(), "Click here") %> to create a new one.  </body></html>
 
就是這樣。你可以從這裡擷取這個模式的樣本程式的代碼。
相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.