该文档介绍了ASP.NET MVC的设计模式及其在软件开发中的应用，包括MVC的结构和职责、历史背景和发展历程、设计模式的概念以及ASP.NET Razor的特性。文档强调了MVC在提升软件的可维护性和可扩展性方面的优势，并讨论了不同于传统WebForms的开发方法。最后，提及了ASP.NET MVC 4新功能和其在实际应用中的一些实例。

1. 2011/10/24
吳俊毅

2. 大綱
 緣起
 何謂設計模式、為什麼談設計模式？
 從設計模式談軟體開發
 ASP.NET MVC (Model View Controller) 概論
 ASP.NET MVC 的發展
 ASP.NET MVC vs WebForm
 ASP.NET MVC 的執行生命週期
 什麼是ASP.NET Razor，它希望做到什麼？
 第一個MVC 應用程式、微軟的範例專案裡做了什麼？
 透過EDM (Enity Data Model)實做 C/R/U/M 的應用程式。
 Model (模組)設計，一定要用EDM (Enity Data Model)嗎?

3. 緣起
什麼是MVC？
MVC 的誕生

4. 什麼是MVC？
 MVC 是(Model View Controller) 的簡稱。MVC不是一
種程式語言，有些人會說MVC是一種架構。但嚴格來
說，MVC應該是一種設計模式，一種撰寫程式的一種
框架、設計樣式(Design Pattern)。
 他希望透過一種權責分明的架構來增加軟體開發的可
維護性、可擴充性、延展性等，並可多人同時開發。
 理論上來說，M、V、C 三個部分可以完全拆開來開發，
因為Controller 也是一個獨立的類別。
 在實際開發的情形中，Model會另外開一個Visual
Studio的專案來開發，再提供給Controller參考使用。

5. 什麼是MVC？

6. MVC 的誕生
 MVC 最早是在1974年由Trygve Reenskaug 所提出，並
直接應用在當時最流行的Smalltalk中。
 透過MVC，使『商業邏輯層』、『資料表現層』在開
發的時候，完全的切割開來。
Model
模型
View
檢視
Controller
控制器
主要負責定義資料的格式、資料的存取界面、DAL
等。通常會將商業邏輯定義在此。
直接與使用者互動的使用者介面，UI。通常只負責
資料的呈現，與使用者輸入資料。或在加上畫面資
料的驗證等。
負責控制系統流程，操作面的邏輯，畫面如何跳轉
等。也負責接收View傳過來的資料。

8. 何謂設計模式、為什麼談設計模式？
 早期軟體開發為了解決當時最直接的商業問題。成是
語言簡單，系統沒有那複雜。
 到了後期，軟體的開發越來越龐大且複雜，軟體開發
的維護性、擴充性相對的浮現。因此人們開始針對軟
體設計的方法、樣式等等來尋找出一種比較可行的方
法。這是就是設計模式(Design Pattern)的雛形。
 MVC 為程式碼的分層，與N-Tier系統的分層概念上有
些不同。要解決的問題也有些不同。
 不過，當然！實務上Model會拆解另一個Visual Studio
專案來開發，若再透過Odata協定開放出來即為分散
式應用系統。

9. 從設計模式談軟體開發
 對開發人員而言，所謂好的軟體系統不外乎：
1. 易於維護
2. 易於擴充 (尤其在客戶需求不斷的變更的時候)
3. 容易開發 (適用於團隊的)
4. 可以多人開發 (尤其在現今軟體日益龐大的時代)
 但設計模式一定有一些門檻。
 初期在開發時，需花較多的時間規劃。也就是進行架
構的設計，才能充分發揮上述的特性。
 Design Pattern也需為團隊合作的共通標準。
 結論：沒有真正好的Design Pattern ，只有適用該團
隊的Design Pattern，合適的Design Pattern完成上述
的條件。

11. ASP.NET MVC
(Model View Controller) 概論
 各個分層的職責
1. Model的職責
2. Controller的職責
3. View的職責
4. 網址路由概念 Route

12. Model的職責
 Model 可翻為模型，不過如果以它的職責來看，翻成
資料模型會比較貼切。一般來說Model要負責所有與
資料有關的任務：
1. 定義資料結構
2. 與資料庫溝通 (DAL)
3. 進行資料格式的驗證
4. 定義商業邏輯規則
5. 對資料進行加工等處理
在.NET的平台，直接支援Model開發的不外乎就是
Entity Framework、LINQ to SQL。當然，您也可以自
行開發，甚至將DataTable轉換為View 參考的強型別。

13. Controller的職責
 Controller 翻譯為控制器，它幾乎
可以說是掌握前端與後端的物件，
其負責的工作如下：
1. 決定與前端View溝通的協定，一
般來說，當然就是HTTP
2. 決定系統運作的流程，如A.aspx
到B.aspx
3. 決定要顯示哪一個View到前端，
與當發生錯誤時要回應哪一個畫
面
4. 決定回應的網址結構

14. View的職責
 就是UI的呈現，直接與USER互動，處理(輸入／輸出)
有關的工作：
1. 決定使用何種IU呈現：HTML、XAML、XML、
Silverlight、Flash 等等
2. 將Controller 傳送過來的資料顯示於View上。
3. 將View的資料傳送給對應的Controller (透過Action
決定)
4. 決定傳送給Controller的方式(GET、POST、XML
HTTP Request)
5. 進行前端基本資料驗證
6. 如果Controller回傳的資料為強型別(Model)，View
也需要參考該Model的類別定義。

15. 網址路由概念 Route
 其實就是一種REST (Representational State Transfer)
的應用方式。
 例子：
 http://localhost:1445/Customer/Details/ALFKI

16. 路由網址比對
 MVC 交由MvcHendler來處理。
 網址路由在HttpApplication的Applicant_Start註冊完成
 使用動作過濾器 Action Filter 找出對應的Action
 單一個Controller 方法的處理回傳一個HTTP Request的結
果。
 若找不到對應的Controller，會回傳404找不到(網頁/資源)

18. ASP.NET MVC 的發展
Date Version Notes
2007-12-10 ASP.NET MVC Framework 以CTP方式釋出
2008-03-05 ASP.NET MVC Preview 2 已釋出
2008-05-01 ASP.NET MVC Preview 3 已釋出
2008-07-16 ASP.NET MVC Preview 4 已釋出
2008-08-28 ASP.NET MVC Preview 5 已釋出
2008-10-16 ASP.NET MVC Beta 已釋出
2009-01-27 ASP.NET MVC RC 已釋出
2009-03-03 ASP.NET MVC RC 2 已釋出
2009-03-17 ASP.NET MVC 1.0 已釋出
2009-07-31 ASP.NET MVC 2.0 Preview 1 已釋出
2009-11-17 ASP.NET MVC 2.0 Beta 已釋出
2010-03-11 ASP.NET MVC 2.0 RTM 已釋出
2010-10-06 ASP.NET MVC 3.0 Beta 持續更新中
2010-11-08 ASP.NET MVC 3.0 RC 已釋出
2011-01-13 ASP.NET MVC 3.0 RTM 已釋出

19. ASP.NET MVC 4 提供什麼新功能？
 在微軟這次推出的 ASP.NET MVC 4.0 為 Developer
Preview 的版本，新增的功能如下：
1. 加強的預設站台的Style，透過CSS的增強來呈現加強一
些效果。
2. 增加了 Mobile WebSite 開發的範本。
3. 新增 Display Modes ，可以針對特定用戶的Browser 類
型加以回傳特定的 View。
4. jQuery Mobile 版本, 增加 View Switcher 與 Browser
Overriding 功能。
5. Recipes 它是一個方便您在Visual Studio 裡擴充其功能，
就像在Visual Studio 中使用NuGet一樣。
6. 支援新的非同步Controller 解決方案。
7. 支援 Azure SDK 的開發。

21. ASP.NET MVC 缺點
 使用MVC導入、開發時，規劃時間較長。
 由於與WebForm架構上的不同，無法使用：
1. ASP.NET WebForm 事件驅動模型
2. ASP.NET WebForm 頁面追蹤機制
3. (WebControl/Server Control) & 與相扶相成的
ViewState機制
4. ASP.NET 新增的System.Web.SiteMapProvider
5. 設計模式下無視覺化Designer 可以使用
 無法將現有WebForm無法全數移轉至MVC，不過理論
上可以將現有DAL改以模型方式提供View參照使用

23. ASP.NET 基本事件生命週期
Page_Load
Page_Unload
Textbox1_Changed
Button1_Click
(執行 PostBack)
1. Change Events
2. Action Events
Page is disposed
Control hierarchy is rendered
OnInit

24. ASP.NET MVC 生命週期
 沒有所謂的Page_Load，只有Controller的Constructor
HTTP Request
網指路由比對
Model 繫結 & 取得資料
執行 View 的內容 & 回傳
找出對應的Controller & Action
回傳結果 HTTP Response

26. 什麼是ASP.NET Razor，
它希望做到什麼？
 ASP.NET Razor 從MVC 3.0 的時候出現，剛出現時還
沒有 VS 2010 的SDK工具，剛開始是很式驗性質的加
在 WebMatrix中，而它的出現，主要目的在於改善現
有 MVC 中 (View) 引擎的寫法：因此重點是，它也不
是要你全部使用Razor去開發撰寫網站
 更精確的說：它是想要更簡化View的撰寫方式，希望
在撰寫 View 的時候使用的(符號／表示法) 減到最
低。 他是因應MVC 撰寫View 的一些問題而出現的
 並不表示您不需要 Controller & Model

27. ASP.NET Razor 的架構
 ASP.NET Razor 可視為ASP.NET的衍伸，因為它是建
構在 ASP.NET 之上

28. ASP.NET Razor 的特性
 1.使用了@符號
 在 ASP.NET Razor 裡我們都知道 @ 為特殊符號，用已
告知 Razor 編譯器來處理。
 當有一區段的程式碼時，我們可以用 @{... 程式敘
述...} 刮起來。

29.  ASP.NET Razor 的註解撰寫方式為 @* 註解內容 *@
 Razor 可以將一段 HTML 的輸出做成一個方法，又稱
做內嵌方法。
 要使用它的話，網頁任一個需要輸出的地方撰寫如下：

30.  Razor裡面，要在畫面上 Runtime 輸出變成一段
HTML 時可使用 HtmlString 類別。

31.  也可以撰寫方法，使用 @functions {} 關鍵字

33. 第一個MVC 應用程式

34. 練習(1)實作一個登入畫面
 加入一個Controller，並命名為HomeController

35. 練習(1)－續
 從Controller點選滑鼠右鍵，加入檢視。

36. 練習(1)－續
 實作相關程式碼。
 了解Controller 如何與View互動。
 何謂簡單模型繫結？如何使用？
 頁面如何跳轉？Controller的控制流程。

38. 微軟的範例專案裡做了什麼？using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace Mvc4EDMInternetApp.Controllers {
public class HomeController : Controller
{
public ActionResult Index()
{
ViewBag.Message = "Modify this template to kick-
start your ASP.NET MVC application.";
return View();
}
public ActionResult About()
{ ViewBag.Message = "Your quintessential app description page.";
return View();
}
public ActionResult Contact()
{
ViewBag.Message = "Your quintessential contact page.";
return View();
}
}
}

39. 練習(2)

41. 練習(3)

42. Q & A
geliswu@wistronits.com