解析ASP.NET WebForm和Mvc開發的區別

因爲以前主要是做WebFrom開發,對MVC開發並沒有太深入的瞭解。自從來到創新工場的新團隊後,用的技術都是自己以前沒有接觸過的,比如:MVC 和EF還有就是WCF,壓力一直很大。在很多問題都是不清楚的情況下,問周圍的人,別人也只是給自己講一個大概。而且前兩天因爲問了一個比較細的問題,還被別人的一句話打擊。“我只能告訴你方法,你還指望我手把手的交給你呀,不會你得自己學呀。。。”。沒辦法只能自己找時間在下面找一些資料學習。

在初步瞭解MVC後,發現很多人對於MVC和三層架構開發概念上會有很大的混淆,所以把這兩天的學習筆記整理一下,分享給自己的同學們。同時也做一個小Demo,讓沒有接觸過MVC開發的同學,能對MVC有一個簡單的瞭解。

一,MVC和三層架構的區別

①什麼是三層架構?

在學校的時候,和同學或者老師一起討論MVC的時候,別人可能會說,“不就是三層架構嘛!實體層(Model),用來創建對象的實體;業務邏輯層(BLL),用來處理複雜的數據間的關係或者是業務間的關係;數據庫訪問層(DAL),用來用來訪問數據庫的;當然還會有,View(視圖層),用來展示數據;”其實自己雖然知道不是這樣,但是自己也僅僅是瞭解一點點,也解釋不清楚,所以也就算了。(具體的三層架構之間的操作的關係可以看我以前的博客【ASP.NET開發】.NET三層架構簡單解析)。

它們之間互相操作的關係,基本的示意圖如下:

28154532-06f0467013af44f7bd6afa207eaf996

還記的暑假在鄭州找實習工作的時候,被別人問過一個n層架構的概念,當時就懵了,尼瑪的壓根就沒聽說過啊!不過後來查詢資料知道,所謂的n曾架構就是根據系統的需要把業務邏輯層(BLL)或者數據庫訪問層(DAL)再抽象成幾個層次(具體的就是再抽象成類),便於邏輯的處理和代碼模塊的維護。其基本原理還是基於三層架構。

②什麼是MVC呢?

MVC其實是軟件架構的一種模式,也就是我們經常說的設計模式。其中主要包括三個模塊,就是如MVC名字所顯示的那樣:模型(Model),視圖(View),控制器(Controller);

其中這裏的模型(Model)和視圖(View )是完全區別於三層架構中的模型(Model)和視圖(View)的。

1)MVC中的模型(Model)指的是數據模型,用於封裝與應用程序的業務邏輯相關的數據,除此之外還可以封裝數據的處理方法(相當於業務邏輯)。這是完全區別於三層架構的模型層(Model)的。

MVC中模型(Model)的特點:

①有對數據直接訪問的權利,如:對數據庫的訪問;

②模型(Model)“不依賴”視圖(View)和控制器(Controller),即模型(Model)不關心它會被如何顯示或者如何被操作;

③模型(Model)中數據的變化一般會通過一種刷新機制被“公佈”;

④爲了實現③中的“機制”用於監視此模型的視圖必須事先在此模型上註冊。從而,視圖可以瞭解在數據模型上發生的改變。

2)視圖(View),這裏的視圖基本跟三層中的視圖一樣,都是爲了顯示數據,沒有程序上的邏輯。爲了實現視圖上數據的刷新,視圖(View)需要訪問它監視的模型(Model),所以應該事先在被它監視的數據那裏進行註冊。

3)控制器(Controller),這個概念是在三層中不存在的概念。它主要起到不同層面的組織作用,用於控制應用程序的流程。主要處理事件並作出相應。“事件”主要包括:用戶的行爲和數據的改變。

以上就是關於三層架構和MVC在概念上的區別。

二,WebForm網站和MVC網站運行機制的區別

①WebForm網站的運行機制

比如說我們現在要訪問一個WebForm站點:www.google.com.hk/Default.aspx(僅僅是示例)。我們的瀏覽器和服務器都是做了哪些動作呢?

1)首先瀏覽器會向目的服務器發送請求報文。

配置過IIS的都知道,網站掛載在服務器上,我們是通過訪問虛擬目錄的方式訪問網站的。這時候目的主機的IIS接收的是訪問該虛擬目錄下Default.aspx文件的請求;(當然這也是一個非常複雜的過程,包括請求DNS服務器,找到目的主機IP,根據IP地址訪問目的主機。複雜的網絡過程就不敘述,有興趣的自己找資料學習);

2)服務器端的IIS軟件接收到請求後,把請求交給.NET FramWork進行處理;

3).NET FramWork會創建Default_aspx類的對象,也就是我們所說的頁面對象。(在WebFrom網站創建完,並且編譯後Default.aspx會被編譯成Default_aspx類)

到現在的整個過程都還是Http請求,IIS的內部機制會去實現一個IHttphandler的接口,其中該接口實現一個Proce***equestfang方法

MSDN是這樣解釋的

28164236-c40457a9a6f74c5c8cbbe0b5cf7d834

該Proce***equest()方法會去調用對應頁面的Page_Load() 方法

protected void Page_Load(object sender, EventArgs e)
        {
             //處理的業務邏輯或者是訪問數據庫的代碼
            //要輸出的Html或者其它內容
       }


4)返回給瀏覽器(包括Html,CSS,Js等等)

流程示意圖如下:

28171603-3e50320974b54e989b9fb7eb44875f4

②MVC網站的運行機制

還比如說我們現在要訪問一個MVC站點:www.google.com.hk/FirstPage/Default(僅僅是示例)。我們的瀏覽器和服務器又做了哪些動作呢?

1)瀏覽器向服務器發送Request請求報文(FirstPage/Default)

2)服務器端的IIS相應Request請求

3).NET FramWork根據路由配置,解析URL,並創建FirstPage類的對象,並調用相應的Default方法

public ActionResult Default()
       {
                                              
                 return View();//返回給視圖
       }


4)然後會訪問視圖文件夾下的Default.cshtml,返回給瀏覽器(其中包括html,css,js等等)

流程的示意圖如下:

28230241-4d392722e2aa42c9b7de2c6dd9dde34

這只是一個比較簡單的運行過程。其實在這過程中發生了很多事情,比如說:執行Global.asax中的Application_Start()方法來完成一些初始化的工作等等,會在以後的文章中繼續解析。

以上就是WebForm網站和MVC網站運行機制的區別。


那麼到底使用MVC的優點比WebForm到底有哪些優點呢?

①最重要的就是.NET程序員在開發的時候再也不會使用那些被很多人詬病的微軟封裝的控件了。

②MVC設計模式降低了模型(Model,業務和數據)和視圖的耦合關係。包括我們在開發WebForm網站使用三層架構的思想也是爲了降低數據和視圖的耦合等;

③可以複用視圖,也就是說同樣的數據可以使用不同的視圖以不同的圖標展示出來。

-------------------------------------------------------理論到此結束---------------------------------------------------------------

常用的WebForm開發方式就不舉例了,我下邊主要演示一個基本的MVC程序的創建和運行過程。

要創建MVC程序VS肯定是必不可少的,我的開發環境是VS2013,大家請酌情考慮自己的VS版本。

①首先的打開“文件”→“新建項目”,在左側的項目欄選擇“Visual C#”→“Web”,在右邊就可以看到有“ASP.NET Web窗體應用程序”和“ASP.NET MVC 4 Web應用程序”如下圖:

28233447-de089ae275ee417e9a6ba6578a08a8d

②因爲要創建MVC程序就選擇點擊第二個選項然後會看到項目模板,默認的是選擇“Internet應用程序”,如果選擇默認的話,就會默認的創建一個具有基本功能的站點。我們這裏選擇“基本”,VS只會創建包含基本框架簡的模板

28234400-1f0ba90fdb514ed88fd2dd1da09eb24

③創建完以後我們會在解決方案下看到代碼的樹狀結構,其中包含Models,Views和Controllers三個文件夾

29004448-3560b6dd86184a7689b6864989d8fae

④我們首先創建實體對象Model,在Models文件夾下創建一個Child類,並聲明屬性和初始化

public class Child
    {
        //編號
        private int id;
                                              
        public int Id
        {
            get { return id; }
            set { id = value; }
        }
        //姓名
        private string strName;
        public string StrName
        {
            get { return strName; }
            set { strName = value; }
        }
    }


⑤在Controllers文件夾上右鍵,“添加”,會看到有“控制器”的選項,如下圖:

29005103-e859cfa5a8d2472e9cd74b77a5b4fd8

點擊"控制器"後會出現一個“添加控制器”窗體,在控制器名稱中”Default1Controller“中”Default1“是默認選中的,我們修改其名稱爲”HomeController“,

29010113-dde65162b975441cb60edc946e06a1e

注意:這裏的”Default1Controller“中的”*Controller“是必須保留的,主要是因爲MVC框架有一個”約定大於配置“的規則

單擊”添加“添加控制器,默認生成的控制器代碼,如下:

//默認生成的控制器代碼
    public class HomeController : Controller
    {
        //
        // GET: /Home/
        //包含一個Action方法
        public ActionResult Index()
        {
            //返回給視圖
            return View();
        }
    }


⑥然後我們創建一個集合來初始化在Models中創建的Child類的屬性值

#region 初始化數據集合 +List InitData()
        /// <summary>
        /// 初始化數據集合
        /// </summary>
        /// <returns></returns>
        public List<Models.Child> InitData()
        {
            List<Models.Child> list = new List<Models.Child>()
            {
                new Child(){Id=1,StrName="你好啊!"},
                new Child(){Id=2,StrName="不好啊!"}
            };
            return list;
        }
        #endregion


然後開始編寫Action方法,即”ActionResult Index()“方法,

/// <summary>
        /// Action方法(相當於MVC設計模式的Model)
        /// </summary>
        /// <returns></returns>
        public ActionResult Index()
        {
            //可以處理當前業務(你比如讀取數據庫,判斷等)
            StringBuilder strBuilder = new StringBuilder();
            //創建數據集合,獲取數據
            List<Models.Child> list = InitData();
            //遍歷集合獲取生成的Html代碼
            list.ForEach(d =>
            {
                strBuilder.AppendLine("<div>" + d.Id.ToString() + "</div>");
            });
            //使用ViewBag傳輸數據給同名的Indexcshtml視圖
            //ViewBag是一個dynamic類型的集合,可以動態添加任意類型的任意名稱和屬性
            ViewBag.HtmlStrBuilder = strBuilder.ToString();
            //加載同名視圖Index.cshtml
            return View();
        }



在其中我們使用ViewBag把數據傳輸給同名的Views文件夾下的同名視圖。

⑦創建視圖接收數據,上面代碼的Index方法上右鍵,會出現”添加視圖“,如下圖

29011655-2fc1d2e298d641588ff9a949c044065

之後會在Views文件夾下,生成一個Home文件夾,Home文件夾下面會有一個Index.cshtml文件(這個就是視圖文件)

⑧視圖接收數據

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
</head>
<body>
    <div>
       <!---------相當於把Action方法中保存的內容輸出--------->
       @Html.Raw( @ViewBag.HtmlStrBuilder)
    </div>
</body>
</html>


到這裏基本上就完成了一個MVC程序的創建,我們運行程序,結果如下:

29013232-fd960f9fb9a74d639c9e5cbd76b5a33
注意:因爲MVC的運行機制跟WebForm不一樣,所以瀏覽的方式也不一樣。我們可以直接在Views文件夾上右鍵,選擇在瀏覽器中查看就可以預覽到結果。

-----------------------------------------分割線-------------------------------------------

到這裏,關於ASP.NET WebForm和Mvc開發的區別和基本MVC程序的創建過程已經完成。

下次我會做的是使用EF(Entity FramWork),來操作數據庫(拋開WebForm中的ADO.NET),實現一個MVC小網站程序的創建。請大家繼續關注!

如果在文章中出現錯誤,歡迎大家留言指正。我會虛心接受大家的意見。


如果您覺得不錯,點擊右下角,贊一下吧!您的支持,是我寫作的動力!

畢業實習交流羣:221376964。你也可以關注我的新浪微博進行交流。

1.png


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章