學習MVC(模型檢視控制器)在7天-第3天
MVC 2是安靜的老和本文是多年後寫的。我們建議您從我們開始閱讀新鮮學習MVC 5從這裡一步一步系列:http: / / www.codeproject.com/Articles/866143/Learn-MVC-step-by-step-in-days-Day 介紹 所以,會議議程是什麼? 在第三天的學習MVC一步一步我們將在下面做以下5個實驗室。 讓我們從上述三個實驗室。 通知你:如果你是全新的MVC(模型-檢視-控制器),請參見本文的最後一部分為啟動或可以檢視其他MVC文章如下所列:- 第一天:控制器、強型別的檢視和助手類 http://www.codeproject.com/Articles/207797/Learn-MVC-Model-view-controller-Step-by-Step-in-7 第二天:單元測試、路由和出站url http://www.codeproject.com/Articles/259560/Learn-MVC-Model-view-controller-Step-by-Step-in-7 第三天:區域性檢視、資料註釋,剃鬚刀,身份驗證和授權 http://www.codeproject.com/Articles/375182/Learn-MVC-Model-View-Controller-Step-by-Step-in-4 第四天:- JSON, JQuery、狀態管理和中控制器 http://www.codeproject.com/Articles/667841/Learn-MVC-Model-view-controller-Step-by-Step-in-3 第五天:捆綁、縮小檢視模型、領域和異常處理 http://www.codeproject.com/Articles/724559/Learn-MVC-Model-view-controller-Step-by-Step-in-7 第六天:顯示模式,MVC OAuth,模型繫結、佈局和自定義檢視引擎 http://www.codeproject.com/Articles/789278/Learn-MVC-Model-view-controller-Step-by-Step-in-d 實驗室10:區域性檢視 當我們談論web應用程式中,可重用性是關鍵。所以作為MVC開發人員我們要建立可重用的觀點。例如我們想建立可重用檢視頁尾和頁首檢視和使用它們在一個大的MVC檢視。 可重用檢視可以通過創造“部分檢視”。 步驟1:建立一個簡單的檢視 第一步是建立一個簡單的檢視和一個控制器。你可以看到從下面的快照,我已經建立了一個簡單的檢視稱為“索引。aspx Homecontroller.cs“將通過呼叫。 如果你直接來這部分,請參見前面的實驗室同步。 步驟2:建立一個簡單的區域性檢視 現在,我們已經建立了主要觀點,是時候建立一個區域性檢視,可以消耗在“指數”的觀點。為了建立一個區域性檢視,右鍵單擊檢視資料夾和馬克複選框“建立一個區域性檢視”,如以下圖所示。 第三步:放點東西在區域性檢視 把一些文字或邏輯部分檢視。 隱藏,複製Code
<%@ControlLanguage="C#"Inherits="System.Web.Mvc.ViewUserControl<dynamic>"%> This is reusable view
第四步:呼叫的主要的部分檢視 最後呼叫區域性檢視的主要檢視使用Html。RenderPartial方法”功能,通過功能的檢視名稱,如下面程式碼片段所示。 隱藏,複製Code
<body> <div> <% Html.RenderPartial("MyView"); %> </div> </body>
也確保區域性檢視是你的主要觀點是在同一個資料夾中。如果它不是,那麼你也需要通過RenderPartial方法函式的路徑。你可以看到下面的圖我已經區域性檢視的主要“檢視”資料夾。 一件事是明顯的,主要的圖示檢視和部分是非常不同的。你可以看到黃色的邊界的區域性檢視圖示中不存在主要檢視圖示。 第五步:執行程式,看行動 最後做一個CTRL + F5,把適當的控制器路徑,並看到你的結果。下面是如何的快照。 實驗室11:驗證使用資料註釋 驗證資料是一個關鍵的事情在任何web應用程式。作為一名開發人員你想執行在客戶端(瀏覽器)和驗證在伺服器端。所以你可能會喜歡寫驗證一次,然後期望驗證框架生成兩端驗證邏輯。好訊息,這是可能通過使用資料註釋。在MVC模型值進行驗證。所以一旦模型內的資料模型表示你想問題,提供適當的資料嗎?值範圍嗎?等。 資料註釋是元資料,您可以應用在模型和MVC框架將使用提供的元資料進行驗證。 在這個實驗室讓我們執行驗證通過使用資料註釋。首先是使用實驗室4和建立一個簡單的模型和一個強型別資料輸入檢視。如果你來到這個實驗室直,請看第一天實驗室在繼續之前。 假設您已經建立了模型和強型別的觀點,讓我們開始應用資料註釋。 注意:應該是一個強型別的檢視建立的檢視。 步驟1:裝修模型與資料註釋 匯入資料註釋名稱空間,下面的程式碼片段所示。 隱藏,複製Code
using System.ComponentModel.DataAnnotations;
假設我們有一個客戶模型,我們希望確保客戶程式碼欄位是強制性的。所以你可以應用屬性“要求”所示的貝爾現在的程式碼片段。如果驗證失敗,你想顯示一些錯誤訊息,您可以通過“ErrorMessage”也。 隱藏,複製Code
public class Customer
{
[Required(ErrorMessage="Customer code is required")]
public string CustomerCode
{
set;
get;
}
}步驟2:改變ASPX程式碼 現在有一些程式碼更改我們會在ASPX程式碼體內比我們之前的實驗室。我們想要顯示的錯誤訊息,如果資料是不合適的。這是通過使用下面的程式碼片段。 隱藏,複製Code
<%= Html.ValidationSummary() %>
我們還需要程式碼的HTML表單來輸入資料。下面的程式碼片段是一樣的。請注意,“EditorForModel”功能將自動生成UI控制元件檢視模型屬性。所以我們不需要建立控制單獨作為我們實驗室4。 隱藏,複製Code
<% using (Html.BeginForm("PostCustomer", "Home", FormMethod.Post)) { %> <%= Html.EditorForModel() %> <inputtype="submit"value="Submit customer data"/> <%}%>
步驟3:啟用客戶端驗證 正如前面說的我們想火驗證伺服器和客戶端上。為了火驗證在客戶端,我們需要參考三個JavaScript檔案,如下面程式碼片段所示。 隱藏,複製Code
<headrunat="server"> <scriptsrc="<%= Url.Content("~/Scripts/MicrosoftAjax.debug.js") %>"type="text/javascript"></script> <scriptsrc="<%= Url.Content("~/Scripts/MicrosoftMvcAjax.debug.js") %>"type="text/javascript"></script> <scriptsrc="<%= Url.Content("~/Scripts/MicrosoftMvcValidation.debug.js") %>"type="text/javascript"></script> <% Html.EnableClientValidation(); %> </head>
還要注意呼叫EnableClientValidation方法由於它啟用客戶端驗證。 隱藏,複製Code
<% Html.EnableClientValidation(); %>
第四步:編寫控制器邏輯 從UI,當表單呼叫控制器的一個帖子,你想知道模型狀態是否正確。這可以通過檢查狀態。IsValid財產。如果這個屬性是有效的然後呼叫Save方法呼叫謝謝看來,其他回到客戶檢視。 隱藏,複製Code
[HttpPost]
public ActionResult PostCustomer(Customer obj)
{
if (ModelState.IsValid)
{
obj.Save();
return View("Thanks");
}
else
{
return View("Customer");
}
}
第五步:執行應用程式的行動 最後執行您的應用程式,看看資料註釋。 總結其他資料註釋屬性 還有其他資料註釋屬性使得複雜的驗證。以下是其中一些列表: 如果你想檢查字串長度,您可以使用StringLength。 隱藏,複製Code
[StringLength(160)]
public string FirstName { get; set; }
如果你想使用一個正則表示式,可以使用RegularExpression屬性。 隱藏,複製Code
[RegularExpression(@"[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\.[A-Za-z]{2,4}")]
public string Email { get; set; }
如果你想檢查數字是否在範圍內,您可以使用範圍屬性。 隱藏,複製Code
[Range(10,25)]
public int Age { get; set; }
有時你想要比較一個欄位的值與另一個領域,我們可以使用比較屬性。 隱藏,複製Code
public string Password { get; set; }
[Compare("Password")]
public string ConfirmPass { get; set; }
如果你想要一個特定的錯誤訊息,您可以使用錯誤。 隱藏,複製Code
var ErrMessage = ModelState["Email"].Errors[0].ErrorMessage;
如果你已經建立了模型物件可以顯式呼叫TryUpdateModel控制器檢查物件是否有效。 隱藏,複製Code
TryUpdateModel(NewCustomer);
如果你想要在控制器中新增錯誤可以使用“AddModelError”功能。 隱藏,複製Code
ModelState.AddModelError("FirstName", "This is my server-side error.");
實驗室12:MVC 3:剃鬚刀 直到現在這篇文章是使用MVC 2但是是時候我們也開始討論和做實驗室新發布版本的MVC框架。改變是人類生活的一部分,同樣是對MVC j .所以在這一節中我們討論MVC 3後是下一個釋出版本的MVC 2。 供參考:最新版本MVC4和在以後的日子我將聯絡甚至那些版本。所以要有耐心。 如果你沒有安裝這個,然後單擊並得到MVC 3模板。 如果你覺得無論我們學到了在MVC 2是一種浪費,不,不是。相反MVC 3是向後相容MVC 2。所以不管你學到了在MVC 2仍然適用於MVC 3。 現在不是討論所有的新功能讓我們關注的最大特徵MVC3我個人認為這是一個重大轉折,剃鬚刀。 剃鬚刀是什麼?簡單明瞭的回答,這是一個MVC的檢視型別。在MVC 2預設檢視是ASP。網路頁面,即。, Web表單檢視。現在,web表單的問題的觀點是沒有思維的MVC,所以語法有點重。 開發商要求清潔,輕量級的檢視和語法較低噪音:答案是剃鬚刀。 讓我們建立一個簡單的實驗室演示使用剃鬚刀檢視。 步驟1:安裝使用相同的MVC 3和建立一個專案 安裝MVC 3模板和建立一個專案選擇MVC 3下面的模板。 步驟2:選擇剃鬚刀 在下一個螢幕上彈出什麼您想要建立的應用程式。 現在讓我們讓生活簡單,讓我們選擇空選項。我們需要選擇的第二件事就是把我們想要的,所以我們選擇剃刀和前進。 一旦建立了專案,您可以看到剃鬚刀檔案與名稱“.cshtml”。現在“_ViewStart”頁面只不過是常見的頁面將使用檢視為常見的佈局和通用程式碼。 步驟3:新增一個檢視和呼叫相同的控制器 現在繼續,新增一個新的檢視和呼叫這個檢視控制器。新增和呼叫檢視與控制器仍在前面討論的一樣實驗室。記住選擇檢視作為Razor檢視。 隱藏,複製Code
public class StartController : Controller
{
//
// GET: /Start/
public ActionResult Index()
{
return View("MyView");
}
}
步驟4:公關actice剃刀語法 現在我們已經準備好了基本的專案和檢視，讓我們來執行一些常見的Razor語法，並嘗試感受一下Razor與ASPX檢視相比有多簡單。 練習1:單行程式碼 如果您只想顯示一個簡單的變數，您可以執行如下所示的操作。所有Razor語法都以@開頭。如果你只有一行程式碼，你不需要“{”。Razor很有邏輯地計算出了結局。 隱藏,複製Code
Todays date @DateTime.Now
如果將上述語法與ASPX檢視進行比較，則需要鍵入以下程式碼。那麼，它的語法不是更簡單、簡潔和輕量級嗎? 隱藏,複製Code
<%=DateTime.Now%>
實踐2:多行程式碼 如果有多行程式碼，可以使用“@”後面跟著“{”，如下面的程式碼片段所示。 隱藏,複製Code
@{
List<string> obj = new List<string>();
obj.Add("Mumbai");
obj.Add("Pune");
obj.Add("Banglore");
obj.Add("Lucknow");
}
實踐3:Foreach迴圈和IF條件 迴圈和if條件變得更簡單，如下面的程式碼行所示。 隱藏,複製Code
@foreach (string o in obj)
{
@o <br/>
}
@if (DateTime.Now.Year.Equals(2011))
{
// Some code here
}
練習4:不要擔心@ 如果你認為Razor把Razor的@和你的郵箱地址@搞混了，不用擔心，Razor能理解其中的區別。例如，在下面的一行中，Razor的第一行將作為程式碼執行，它理解的第二行程式碼只是一個電子郵件地址。 隱藏,複製Code
@DateTime.Now [email protected]
練習5:顯示@ 如果您想顯示“@”，只需鍵入兩遍，如下面的程式碼片段所示。顯示的內容如下圖所示。 隱藏,複製Code
Tweet me @@Shivkoirala
實踐6:使用Razor顯示HTML 如果您想在瀏覽器上顯示HTML。例如，下面是一個叫做link的簡單變數，它有HTML程式碼。我在瀏覽器上顯示變數資料。 隱藏,複製Code
@{
var link = "<ahref='http://www.questpond.com'>Click here</a>";
}
@link;
如果執行上面的程式碼，您會驚奇地發現它並沒有顯示為HTML，而是如下所示的簡單顯示。這不是我們所期望的。我們期待一個適當的HTML顯示。這是由Razor完成的，以避免XSS攻擊(我將在後面的章節中討論)。 不過不用擔心，剃鬚刀團隊已經處理好了。您可以使用“Html”。以顯示與下面程式碼片段相同的內容。 隱藏,複製Code
@{
var link = "<ahref='http://www.questpond.com'>Click here</a>";
}
@Html.Raw(link);
實驗13:MVC安全(Windows認證) 在任何應用程式中，安全性都是最重要的事情之一，無論您使用何種技術開發它們，MVC也是如此。 在我們開始這個實驗之前，有一件事我們需要明白，MVC最終是站在ASP上的。淨引擎。換句話說，MVC使用相同的安全方法，適用於ASP。NET也就是Windows和表單身份驗證。 注意:-在這篇文章中，我們不會研究Windows和表單身份驗證的基本原理。如果你是新的ASP。您可以閱讀本文連結http://www.codeproject.com/Articles/98950/ASP-NET-authentication-and-authorization 讓我們嘗試在MVC 3應用程式中實現windows身份驗證。 現在，實現Windows身份驗證的一種方法是使用內部網應用程式選項建立專案。如前所述，啟用內部網應用程式選項對來自Windows Active Directory的使用者進行身份驗證。 現在我們不使用那個選項，讓我們使用empty application選項並從頭開始建立，這樣我們可以更好地理解。 步驟1:啟用Windows身份驗證 你已經建立了一個專案，第一步是啟用Windows認證使用授權。標籤所示。是的，這段程式碼與我們為ASP.NET所做的程式碼相同。 隱藏,複製Code
<authenticationmode="Windows"/> <authorization> <denyusers="?"/> </authorization>
步驟2:只是一些缺陷 在MVC 3模板中，有一個小缺陷。預設情況下，它執行表單身份驗證。在appsettings標記中設定以下標記以避免出現問題。我花了兩個小時才弄明白，真是浪費! 隱藏,複製Code
<addkey="autoFormsAuthentication"value="false"/> <addkey="enableSimpleMembership"value="false"/> <appSettings> <addkey="webpages:Version"value="1.0.0.0"/> <addkey="ClientValidationEnabled"value="true"/> <addkey="UnobtrusiveJavaScriptEnabled"value="true"/> <addkey="autoFormsAuthentication"value="false"/> <addkey="enableSimpleMembership"value="false"/> </appSettings>
步驟3:在控制器/操作上應用授權標籤 一旦啟用了Windows身份驗證，請使用“[Authorize]”標籤並指定哪些使用者可以訪問控制器和操作。如果願意，還可以指定角色。 隱藏,複製Code
[Authorize(Users= @"WIN-3LI600MWLQN\Administrator")]
public class StartController : Controller
{
//
// GET: /Start/
[Authorize(Users = @"WIN-3LI600MWLQN\Administrator")]
publicActionResult Index()
{
return View("MyView");
}
}
請注意，使用者應該出現在您的Windows廣告或本地使用者組。就像在我的例子中一樣，管理員出現在我的本地Windows使用者組中。 步驟4:建立設定 現在是時候在IIS上釋出這個解決方案了，這樣我們就可以測試Windows身份驗證是否有效。為了做到這一點，我們需要將必要的MVC dll也釋出到伺服器上。因此，右鍵單擊專案並選擇“新增可部署的依賴項”。 在下一個螢幕中，它將提示您希望包括哪些依賴項。現在我有Razor檢視，所以我選擇了兩個選項。 一旦您可以看到依賴的dll被新增到專案中。 步驟5:建立IIS應用程式 下一步是建立僅啟用Windows身份驗證的IIS應用程式，如下圖所示。 第六步:釋出 一次您已經建立了IIS應用程式，現在應該將應用程式釋出到web應用程式資料夾。因此，單擊Build和Publish，如下圖所示。我用“File system”作為釋出方法，你可以自己選擇。 第7步:執行控制器和操作 最後執行控制器和操作，檢視如何彈出Windows authentication框輸入使用者ID和密碼。 如果適當地輸入了憑證，您應該能夠看到該檢視。 實驗室14:- MVC安全(表單認證) 在之前的實驗室中，我們看到了如何進行windows身份驗證。Windows認證非常適合內部網網站。但當我們談到網際網路網站，建立和驗證使用者從Windows廣告/工作組是不可行的選擇。所以在這種情況下，“表單身份驗證”是最好的選擇。 第1步:-定義登入頁面控制器 我們需要做的第一件事是定義將呼叫登入檢視的控制器。因此，我建立了一個簡單的索引操作，它呼叫一個稱為index的檢視。這個索引檢視將接受使用者名稱和密碼之類的輸入。 , 隱藏,複製Code
public ActionResult Index(){return View();}
步驟2:-建立索引檢視 下一步是建立包含使用者名稱和密碼的登入表單。為了建立表單，我使用了razor view和HTML helper類。如果你是新的HTML幫助類，請參閱第一天的實驗室。 這個HTML表單正在使用HTTP post方法對當前在“Home”控制器中的動作“Login”進行post。所以當用戶按下submit時，它會點選“Login”操作。接下來要做的是建立“Login”操作，它將驗證使用者名稱和密碼。 隱藏,複製Code
@{Html.BeginForm("Login", "Home", FormMethod.Post);} User Name :- @Html.TextBox("txtUserName") <br/> Password :- @Html.TextBox("txtPassword") <br/> <inputtype="submit"value="Login"/> <br/> @{ Html.EndForm(); }
步驟3:-驗證憑證 在登入操作中，我們需要做的第一件事是檢查使用者是否正確。現在，我已經硬編碼了使用者名稱和密碼的驗證。這總是可以通過從SQL Server或其他來源查詢來替代。 隱藏,複製Code
if ((Request.Form["txtUserName"] == "Shiv") && (Request.Form["txtPassword"] == "Shiv@123")){…..}
一旦我們檢查了憑證，下一步就是使用著名的“FormsAuthentication”類並設定cookie，表明這個使用者是正確的。 這樣在使用者到來的下一個請求中，他就不會被一次又一次地驗證。在cookie被設定重定向到“關於”檢視或其他只是站在“索引”檢視。 隱藏,複製Code
public ActionResult Login(){if ((Request.Form["txtUserName"] == "Shiv") && (Request.Form["txtPassword"] == "Shiv@123")){ FormsAuthentication.SetAuthCookie("Shiv",true); return View("About");}else{ return View("Index");}
My about view只是一個簡單的頁面，如下所示。 隱藏,複製Code
@{ Layout = null;}<!DOCTYPEhtml><html><head> <title>About</title></head><body> <div> This is About us </div></body></html>
步驟4:- Authorize屬性 我們還需要在控制器上使用put " [Authorize] "屬性，我們希望對未授權的使用者進行限制。例如，您可以在下面的程式碼片段中看到，“Default”和“About”操作使用“[Authorize]”屬性進行修飾。 因此，如果任何未經授權的使用者，直接點選這些控制器中的任何一個，他們將被送回“索引”檢視，即回到登入螢幕。 隱藏,複製Code
[Authorize]public ActionResult Default(){ return View();}[Authorize]public ActionResult About(){return View();}
第五步:改變“網路”。配置”檔案 最後，我們需要在“網路”領域做出著名的改變。配置”，即啟用“表單”安全性。下面程式碼片段中需要注意的最重要部分是“LoginUrl”屬性。 通常在ASP。這個登入URL指向一個asp.net。NET頁面，但在MVC中它指向一個動作，即“/Home/Index”。此操作呼叫登入憑據頁面。 隱藏,複製Code
<authenticationmode="Forms"> <formsloginUrl="~/Home/Index"timeout="2880"/> </authentication>
步驟6:-參見表單認證的操作 有了以上5個步驟，你現在完全可以開始了。如果您現在嘗試直接呼叫“About”操作，它將在下面的螢幕中顯示。此測試證明“表單”身份驗證工作正常。它自動檢測到使用者是無效的，並將其重定向到“Index”操作，該操作進一步呼叫“Login”表單。 第四天是什麼? 在第四天，我們將研究Jquery, Json，非同步控制器和Viewdata, Tempdata, Viewbag和會話變數之間的差異。你可以在下面連結閱讀第四天。點選這裡檢視第四個MVC的步驟。 最後注意:你可以觀看我關於各種主題的c#和MVC培訓視訊，比如WCF、SilverLight、LINQ、WPF、設計模式、實體框架等等。不要錯過我的。net和c#面試問答手冊。 用於與各種主題相關的技術培訓，包括ASP。請聯絡[email protected]或訪問www.sukesh-marla.com 從MVC 5開始 如果你想開始與MVC 5開始與下面的視訊學習MVC 5在2天。 50個MVC訪談問題和答案 如果你要去面試，你可以閱讀我的50個重要的MVC面試問題回答文章http://www.codeproject.com/articles/556995/model-view-controller-mvc-interview-question- and 你對MVC是全新的嗎? 如果你是一個新手，我建議你從下面的四個視訊開始(大約10分鐘)，這樣你就可以快速學習MVC。 實驗1:一個簡單的Hello World ASP。淨MVC品資訊 實驗室2:在這個實驗中我們將看到如何共享資料控制器和檢視使用檢視之間的資料 實驗室3:客戶在這個實驗中,我們將建立一個簡單的模型,發展一些資料,並顯示在一個檢視 實驗室4:在這個實驗中,我們將建立一個簡單的客戶和一些驗證資料輸入螢幕檢視 所以,會議議程是什麼?第一天:控制器、強型別的檢視和助手類2天:單元測試,路由和出站url第三天:-區域性檢視、資料註釋,剃鬚刀,身份驗證和授權第四天:- JSON, JQuery,狀態管理和中控制器第五天:捆綁,縮小,檢視模型、領域和異常處理6天:顯示模式,MVC OAuth,模型繫結、佈局和自定義檢視引擎實驗室10:區域性檢視 步驟1:第二步:建立一個簡單的檢視建立一個簡單的區域性檢視第三步:放一些區域性檢視中的第四步:呼叫區域性檢視在主第五步:執行程式,看行動 實驗室11:驗證使用資料註釋 步驟1:裝修模型與資料註釋步驟2:改變ASPX程式碼步驟3:啟用客戶端驗證步驟4:編寫控制器邏輯步驟5:執行應用程式的行動總結其他資料註釋屬性 實驗室12:MVC 3:剃鬚刀 步驟1:安裝MVC 3和建立一個專案使用相同的步驟2:選擇剃鬚刀步驟3:新增一個檢視和從控制器呼叫相同的步驟4:剃鬚刀語法練習 練習1:單行程式碼實踐2:多行程式碼的練習3:Foreach迴圈,如果條件練習4:不要擔心@練習5:顯示@練習6:HTML顯示剃刀實驗室13:MVC安全(Windows身份驗證) 步驟1:啟用Windows身份驗證步驟2:只是一些缺陷步驟3:申請授權標籤在你的控制器/動作步驟4:建立設定步驟5:建立IIS應用程式步驟6:釋出第七步:執行的控制器和動作 實驗室14:——MVC安全(表單身份驗證) 步驟1:定義登入頁面控制器步驟2:——建立索引檢視步驟3:——驗證憑證步驟4:-第五步:授權屬性變化”網路。配置檔案第六步:看到表單驗證 第四天是什麼?50 MVC的面試問題的答案你全新的MVC嗎? 區域性檢視。驗證使用資料註釋。剃鬚刀(MVC 3)。MVC Windows身份驗證MVC表單驗證 空選項建立一個專案用最少的檔案。網際網路應用程式選項建立一個shell應用程式包括使用者註冊和認證,導航和一致的視覺風格。內部網應用程式選項是非常一樣的網際網路應用,唯一的區別是身份驗證發生在Active Directory域/基礎設施。 本文轉載於：http://www.diyabc.com/frontweb/news1869.html