ASPNET MVC4 我們GO
--我承認我很懶,但我今天可能能“喵”到一點東西
本人能力有限,盡量將書中的知識濃縮去講,仔細學過后,然后你再學習其他語言的MVC框架也就大同小異了
ASP.NET MVC相對於WebForm,學完第一章,你會發現瀏覽器地址欄如此簡潔,文件歸類的如此好維護,
沒有母版頁,也可以這樣寫出類似模版的功能
本次接觸的東西:
SQLServer Compact (我自己簡稱SSC)
Controller(控制器),它里面還多個Action(我叫它操作)
View(試圖),我簡稱它“頁面”
Razor(視圖引擎的一種),我簡稱它,一種網頁標簽另一種編程風格,另一種寫法
Route(路由),我討厭它,因為這個太抽象,暫且理解,一個瀏覽器地址欄中輸入URL后,回車,會經過它(路由)處理一下,然后再跳轉,目前暫且理解這樣的一個技術
ViewBag:一個動態類型的一個對象,過會通過一個項目你就會理解它的作用。想現在理解,百度c# dynamic,可以學習一下
(∩_∩) 了解 C# 4 中的 Dynamic 關鍵字
1.環境搭建
本例用VS2012 旗艦版 講解,VS2010可安裝 ASP.NET MVC4插件,瀏覽器選擇 Chrome 23.0.127.1.1版本,后台語言選擇C#
2.新建文件夾E:\MyASPNETMVC4\Ch1
視圖引擎 選擇Razor默認,無需勾選創建單元測試項目,點確定
等待項目的完成…
完成后,vs2012創建的默認的項目結構如下,那么暫且,我們就用這個結構稍微做個簡單的增刪改查項目
App_Data:放一些數據庫文件,XML文件,或者其他我們項目中需要用到的文件,ASP.NET運行時能夠識別這個特殊的目錄,所以能夠避免用戶直接訪問這個目錄,只有我們的應用程序能夠對這個目錄讀寫
Content:包含了一些當你部署你的項目的時候需要的一些非代碼資源,這里面通常有圖片文件和css文件,默認情況下,包含了一個Site.css樣式表和一個themes文件夾,我們打開themes可以看見,我們熟悉的jquery UI庫(做Web開發的都應該知道)
Controller:控制器 是 處理用戶請求,並決定返回哪一個頁面(View)的一個中間者類,在ASPNET MVC中,控制器全部在這個文件夾里面,默認有兩個控制器,HomeController(處理Home頁面的請求),AccountController(處理權限)
Images:放了一些圖片資源
Models:放我們實體類的地方,隨着我們的項目變得越來越大,例如,我們可能會把實體類這個文件夾中的類移動到一個專門的類庫里面去,就像三層中的實體層那樣.默認包含了AccountModels.cs這個類
Scripts:包含了一些我們可能用到的一些js文件
View 目錄:包含了呈現你在項目中使用到的項目界面的一個模版,每一個模版都是用Razor視圖呈現的(cshtml文件或者vbhtml文件),這些文件可從Controller目錄下的控制器創建,亦可以手動創建,過會,我們將會研究一下,Controller,actions,views之間的關系
Global.asax:當你的項目運行時候,它會初始化一些代碼,比如用代碼注冊路由
Web.config:有時為了確保ASP.NET MVC程序能夠順利的運行,有些配置細節必不可少,我們可以寫在里面
按F5 運行項目,出現如下界面,表示開發環境搭建成功!
初探 ASPNET MVC4的項目
--這個項目真無聊,但我會GO下去
2.1 基本概念
Controller是所有控制器的父類
ViewBag后面我可以定義任一名稱屬性,因為ViewBag是一個動態數據類型,類似於Javascript的var,運行時,判斷類型,然后創建,C#真他媽 為什么4.0才出現這種語法
HomeController繼承了Controller的衣缽,擁有了它的一切,連類名的后綴(suffix)都有了Controller作為標注
每一個訪問修飾符是public,返回值是ActionResult類型的方法里面 都 return了一個View(),此方法在Controller這個父類中定義的
現在我們把光標置於方法名稱上,右鍵
其實視圖這個名詞,真難受,叫頁面多好呢,是吧
對了,聰明的你,可能也發現了,視圖是 Razor風格的,后綴名是cshtml,以前WebForm,每個aspx頁面都有一個aspx.cs后置代碼處理文件。在ASP.NET中,分為兩部分了,一個就是控制器里面處理,一個是cshtml里面寫,用@符號區別,有點像JSP了
回到控制器文件夾,那個啥,HomeController里面去啦
在這個控制器中,定義了3個action,名字叫Index/Home/Contact
好了重點來了
第一關理解(Browser地址欄變簡潔):
由於這3個Action被定義了在了HomeController控制器(其實就是一個繼承了Controller的類)中,每個Action返回的都是一個視圖類型的,啊~我要瘋了,神啊,原諒我吧,請讓我這樣說行嗎?
每個Action返回的都是一個頁面類型的,我噓~舒服多了,返回一個頁面,return View()
所以你可以在瀏覽器的地址欄上: http://localhost:端口號/控制器名稱(去掉Controller后綴后的)/然后ActionResult返回值類型的方法名,例如:http://localhost:5438/Home/Index,就可以訪問那個 Actions名稱右鍵單擊->轉到視圖,對應的那個頁面
這里就是Views/Home/Index.cshtml這個頁面,但是地址欄上是不會這樣顯示的
你可能會問為什么?
我覺的如果你都能根據這個URL能夠找到它要顯示的頁面,那么你就懂了
例如,就拿個默認模版來說(HomeController.cs):
我們在這里面加一個Action
public ActionResult TestHa() {
ViewBag.Message = "阿拉只是想測試一下";
return View();
}
右鍵方法名稱,添加視圖,會彈出一個對話框,保持默認,點添加
在Views/Home目錄下生成個一個TestHa.cshtml文件
這個cshtml的文件名,TestHa就是這個Action的名字啊
而它所在的目錄的名稱,Home,就是對應的Action所在的控制器HomeController去掉Controller后綴名的名字
再次驗證你的疑問
右鍵Controller文件夾,添加一個新的控制器,名稱叫GuestbookController.cs
在文件里面我們創建一個叫Create的Action
public ActionResult Create()
{
return View();
}
右鍵方法名添加視圖,發現多了一個以對應的Action的方法名為文件名的Create.cshtml文件,而目錄就是Guestbook
其實Action對應的cshtml文件的名字可以不要跟方法名一樣的,以后講
現在給你一個這樣的URL,你應該可以找到對應的頁面了吧
好了,計算機能識別,主要是Global.asax這個文件里面有個RegisterRoutes方法
我們稍微看一下,打開Global.asax文件,光標置於RegisterRoutes方法,按F12轉到對應的定義
我們看到,這里定義了兩個entry(入口)
首先,IgnoreRoute告訴框架不要擔心去匹配某些的特殊的URL路徑,在這個例子的意思是
不要去處理任何以.axd結尾的文件請求,比如說Trace.axd.
第二個,MapRoute定義了URL如何被處理,這個默認的路由配置代碼已經可以幫一部分應用程序完成配置了
,但是以后你可能會因為你的應用程序中會用到一些特殊的URL地址而添加更多的路由來解決這些特殊路由的問題
我們暫時保持默認
我們可以看見,每一個路由都有一個name,url定義,一個可選擇的默認值,有時我們的程序第一次運行時候,沒有任何URl片段,比如Home/Index什么的。直接一個域名或者測試時候的localhost:端口號,程序根據這個默認值,就加載默認的頁面了
在default設置里面,看單詞就知道了 翻譯成URL就是 /Home/Index這個是默認的。id那個參數是可有可無的
正是由於這個默認值
你在地址欄中,假如你的域名是MySite.com
你可以直接輸入http://MySite.com或者輸入http://MySite.com/Home/Index或者http://MySite.com/Home
都可以達到觸發 HomeController類中的Index這個Action,然后加載Views/Home/Index.cshtml的這樣的一個效果
關於Route的一個小插曲
url參數 url: "{controller}/{action}/{id}"
很明顯我們看到,都是花括號{}括起來的,這個默認的url模版是個已經能夠服務很多web請求的一個很通用的路由了,括號里面的單詞MVC框架能夠理解的,最常用的就是controller和action了
接下來我們來看看有趣的 ViewBag,我個人覺得好玩
回到HomeController.cs,打開這個文件
寫個小測試,你就說,哦!騷迪斯來(日語:原來如此)了
在Index這個Action里面加上一行代碼, ViewBag.CurrentDate = DateTime.Now;
如果你了解過C# 動態類型的話,那就太簡單了,不明白也能瞬間明白
CurrentDate和Message這兩個屬性都不是ViewBag里面的,所以CurrentDate這個名字,你可以改成任意名字,比如 hahaDate
Message也可以改啊,你當然也可在定義其他幾個變量啊,你放心,稍后會有用的.例如,這里我們用CurrentDate,一看我們自己知道,他是個DateTime類型的。動態類型,你可以跟js相比較一下,在你寫js的時候,程序不知道是什么類型的,程序運行的時候,他自己判斷,然后再創建對象,名字就是你定義的那個
定義好了CurrentDate,我們就可以在該Action對應的View中使用這個CurrentDate變量了,然后當然就可以在頁面上顯示這個值了
我們轉到HomeController下的Index這個Action對應的頁面(視圖)-------------(請原諒我,我發誓這是我最后一次寫視圖兩個字)
打開后如上圖,我們看到,這個一個C#代碼和html標簽混合的頁面,有點類似jsp,php,asp的一貫作風
我們在</hgroup>后面添加以下代碼
<p>當前時間是:@ViewBag.CurrentDate.ToLongDateString()</p>
按F5運行程序,效果如下
我想你大概已經知道ViewBag第一個用法了
在這個cshtml里面,Asp.NET MVC用@符號 來完成一次Html標簽和C#代碼的一次過渡
在HomeController向我們展示了在MVC應用程序中,控制器和視圖的基本使用,但是僅僅在屏幕顯示一個簡單的文字一點都不有趣
在本章的最后下一個階段,我們將做一個簡單的數據錄入和展示的guestbook項目,作為一個ASP.NET MVC4的入門吧
Guestbook ASPNET MVC4 我來了
--我已經准備好了,開始吧!好興奮
3.1 數據庫,SqlServer Compact
SSC是微軟向sqlserver家庭中添加的一款關系型數據庫,是一個輕量級的可用於桌面程序開發,web開發,甚至window phone系列手機應用中用到的數據庫,它不需要安裝,也不用啟動任何服務來幫助它運行,以前我們在使用sqlserver的時候,開始都要啟動服務什么的,例如net start mssqlserver
如果你用過Access數據庫,你可以想象SSC就像Access一樣,不用啟動服務,不用裝任何東西,就能當做存儲我們程序所需要的數據的一個介質
我們可以右擊App_Data文件夾,添加-》新建項
手動建庫,然后建表,建立字段,然后供程序使用
在這個例子中,我們用代碼創建數據庫,不手動添加數據庫了
3.1 我們開始
3.1.1 我們新建一個實體,在Models文件夾里面
代碼如下
public class GuestbookEntry
{
public int Id { get; set; }
public string name { get; set; }
public string Message { get; set; }
public DateTime DateAdded { get; set; }
}
這四個屬性的名稱最好就是最終數據庫表中的列名,最好對應,過會你就知道了,這里只是個技巧
我們現在只是通過一個類來表現數據庫中的一張表了
但是怎么講對象映射到數據庫中的表呢?或者把數據庫中的數據轉換成對象呢
這里我們需要用ORM工具了,如果ORM不懂,不用太緊張的
在這個例子中,我們將會使用Entity Framework4.1來為我們做這個映射。雖然在.NET平台上有很多ORM工具來讓我們選擇(以后的幾章里,我們將會看一下NHibernate還有一些的ORM工具),而且EF這個ORM很大,有好幾本書專門來講解它,但是Entity Framework4.1提供了一些簡單的API,我們會用很簡單的方式,利用EF來完成我們的項目的額數據庫訪問。所以不用擔心
在開始使用EF之前,我們需要為我們的應用程序,添加一個DbContext類,在Entity Framework中DbContext類幫助我們持久化數據和讀取數據提供了一些抽象方法。
現在我們在Models文件夾下面添加一個GuestbookContext類,並讓它繼承DbContext,按Shift+Alt+F10快速導入命名空間
public class GuestbookContext : DbContext
{
public GuestbookContext(): base("Guestbook"){}
public DbSet<GuestbookEntry> Entries { get; set; }
}
關於Data Access choice(數據訪問的選擇)的一個小插曲
在.NET開發中,在處理數據訪問時候有很多選擇,現在當代的很多應用程序都使用比如Entity Framework或者NHibernate作為ORM工具來處理關系型數據庫,但不是每一個項目都要用到他們,我們可以選擇其他的。
如果你的應用程序比較小,你可能決定不需要用那么復雜的ORM,在你的項目中使用WebMatrix.Data或者Simple.Data就能滿足你的需要了
WebMatrix.Datashi微軟作為Asp.NET Web頁面處理技術系列產品的一部分,在ASP.NET MVC3發布的時候一起發布的,它提供了一個輕量級的,用純sql語句,DLR的動態類型語法完成數據訪問。Simple.Data提供了一個更簡單的解決方案,它依靠動態查詢語法而不是sql語句。更多的Simple.Data的信息,你可以在https://github.com/markrendle/Simple.Data找到
關於這個繼承了DbContext(依賴於System.Data.Entity命名空間)的類,我們在它的構造函數中,傳遞了一個Guestbook參數,因為我們的數據庫名稱就叫Guestbook.sdf,如果我們不傳參數,EF就會根據類名稱生成一個 GuestbookContext.sdf這樣子的數據庫
這個類還定義了一個DbSet<GuestbookEntry>類型的一個Entries屬性,它扮演者一個向GuestbookEntry表中查詢數據,返回一個擁有對象的一個把數據讀取到內存中的一個集合。
在這個基礎上,Entity Framework將會生成合適的sql語句去查詢這張表,並把查詢到的結果轉換成強類型的GuestbookEntry對象,過會我們會查詢這個集合。最后我們需要讓EF和ssc產生通訊
從模型生成數據庫
為了達到這個目的,有很多方法,我們可以在Global.asax.cs文件里面的Application_Start手動的添加一些代碼來完成一些工作。這是個特殊的方法,我們的程序運行的時候,他就會立即被調用。
但是,為了達到這個目的,我們可以使用一個稍微不同於這個的一個方法---我們可以使用NuGet包為我們完成一些初始化工作。
NuGet是一個包管理工具,它可以把一些開源的類庫簡單快速地添加到我們的.NET項目中去。盡管NuGet 沒有捆綁在ASP.NET MVC項目中去,但是它在你安裝ASP.NET MVC環境時候已經一起安裝上去了,所以你不必單獨去安裝,你就可以直接使用了。
打開管理NuGet程序包菜單,輸入EntityFramework.SqlserverCompact查找一下,安裝此開源類庫
我們也可以使用WebActivator來注冊一些開始代碼,更多資料:https://bitbucket.org/davidebbo/webactivator
現在我們開始在Controller文件夾里面添加一個GuestbookController.cs控制器
這下面有很多種模板,我們用默認的,具體使用,我們以后講
打開GuestbookController,我們添加一個Create名稱的Action,如截圖
此時,我們按F5運行,地址欄輸入http://localhost:端口號/Guestbook/Create,會報錯,因為找不到對應的View
在這個錯誤里面,我們發現,它在Create這個Action所在的GuestbookController,以Guestbook作為Views目錄里面的子目錄,開始查找Create.aspx,Create.ascx(這個是因為別的視圖引擎),還有Create.cshtml(C#語言版本)和Create.vbhtml(vb.NET版本),如果對應的控制器名稱為目錄名的目錄里面找不到,他就會從Views/Shared目錄里面找,Shared里面放的是多個控制器公用的View(頁面啦)
現在我們手動右擊Views目錄,手動添加一個View,或者在控制器的Action名稱右擊,添加視圖都一樣的,自己隨便選哪個都行
創建好Create.cshtml后,
我們添加代碼如下,為了避免代碼粘貼復制,不加思考,我就貼圖了
好了,我們按下F5開始運行一下,地址欄手動輸入http://localhost:你的端口號/Guestbook/Create
注意一下,在這個表單里面,有Name和Message兩個input,這兩個名字其實是有技巧的,它們和我們定義的GuestbookEntry對象里面的屬性的名稱是對應的,過會我們看一下,他們是怎么自動綁定的
這個新的Create Action我們可以在/Guestbook/Create">http://localhost:<port>/Guestbook/Create訪問到
我們現在有必要在GuestbookController里面添加一個Action來處理表單的post請求並向數據庫里面添加一條數據
為了完成這個,我們將會使用我們以前創建的GuestbookContext類和GuestbookEntry實體類,在Models目錄里面
現在我們向GuestbookController里面添加一個帶參數的Create,代碼如下
我們重載了Create方法,並加上了一個HttpPost特性,標志此方法,只能是HTTP Post性質的請求才能訪問
關於這個,我們以后會深度研究一下
這個方法,有個GuestbookEntry類型的參數,這個對象的屬性已經因為 表單中的元素的名字和對象中的屬性的名字一樣,所以已經自動和我們表單頁面綁定了。
SaveChages(),是將我們的數據寫入數據庫
關於EF,這里不打算怎么講,其實這里寫了一個很常用的SaveChanges()方法,不管你是修改了數據,還是添加了數據,刪除了數據什么的,當時數據庫都沒有什么影響,只有你調用了SaveChanges()方法,所有你的數據操作狀態才會提交到數據庫,完成一次“同步”
有的數據庫語法也是這樣的,sql語句寫完,要寫個submit一樣的。
此時我們按F5運行,打開Create頁面,輸入數據提交,數據已經能夠順利添加了。
光光增加一個數據,沒什么用,我們不知道是不是真正添加了,所以我們需要一個展示消息的一個頁面
默認控制器里面有個Index Action,現在我們添加如下代碼,只提取GuestbookEntry表中的最近添加的20條數據
EF,本身用的linq風格的語法,所以想學EF的,先學一下linq,這里不介紹linq
這里我們只是,按照DateAdded降序,然后就可以獲得最新的20條最近添加的記錄,然后展示在頁面里面,我們把這個對象放在了ViewBag里面,這樣我們就可以在頁面里使用我們獲得的20條記錄了,然后我們for循環一下,就可以展示了
創建一個好了消息,最好能夠返回到展示頁面,目前我們只是提示,成功添加
現在我們修改帶參數的Create方法,修改如下
我們使用了RedirectToAction方法,這個方法能夠幫助我們,添加成功后,自動調用本控制器內的Index Action
現在我們,給本控制器內的Index添加對應的視圖(好了,我認輸~頁面)
修改對應的Index.cshtml,代碼如下
好了現在我們大部分完成了
按下F5運行查看一下,瀏覽器地址欄輸入/Guestbook/Create">http://localhost:<port>/Guestbook/Create
到現在為止,我們應該大概了解了一下MVC了,對了,目前就是這么簡單
不過我們還沒結束
現在我們來修改一下外表,其實是了解一下layout
上面我們每次都是手動輸入地址欄地址,好煩啊
所以我們順便了解一下MVC4的布局方式,不是DIV+什么css,也不是模板頁,但是模板的思想
其實我們當前看的頁面其實是個組合起來的頁面,類似於模板頁,某些地方掏空,供內容頁填充什么的
如果你使用的是以前的ASP.NET MVC或者ASP.NET WebForm,這個layout就像你們使用的Master Page
現在我們打開看layout,添加一個菜單,供跳轉到Guestbook/Index.cshtml
他在Views/Shared目錄下,打開它
關於ActionLink方法,三個參數(顯示的文字,Action名稱,控制器名稱),類似於HTML標簽中的超鏈接的作用
我們把 “將你的徽標放置在此處” 文字改成 “My Guest Book ”
在這個文件里,我們還發現其他幾個有趣的部分,比如
關於partial view 我們會在下一章講解,但是它最終起的作用是在多個頁面的組成的一個頁面里,重新使用部分html的作用
關於菜單,它選擇了一個<ul>無序列表標簽,我們添加一個查看消息的鏈接,代碼如上圖
最后一個有趣的是RenderBody方法
原文講解如下,我自己講的不知道對不對
這個方法將會向當前的視圖(_Layout.cshtml)里添加一些內容,這些內容都是由我們以前寫好的action
跳轉的view,view生成的html代碼會被layout包裹,就是會在 <section class="content-wrapper main-content clear-fix"></section>里面
總結:
本章是我們開始ASP.NET MVC編程的第一步,我們創建了一個新項目,並開始研究了默認項目的模版各個部分,我們談了一下Controller的概念,進一步地我們講到了controller類和Action方法,然后我們看了Razor模版怎么表現成視圖(頁面)的,我們也看了Route怎樣對請求的URL映射(Mapping)的,當然我們也可以自己創建特殊的,自定義的URL模版,具體的會在第9章講解.
在這個基礎上,我們創建了Guestbook這個例子來驗證給我們的想法----我們使用Entity Framework 的 DbContext API和SQl SERVER Compact來添加和查詢了數據,我們還利用NuGet包管理器在我們的項目中快速地添加了額外的包
最后我們使用了layout,完成了統一風格的界面,感受了多視圖在一個視圖文件里(頁面),這個很好地過渡到下一章的學習,在下一章里,我們將會在Guestbook應用程序中繼續使用Razor視圖,並會你用這個項目繼續講解各個細節知識點。
本章源碼:下載 http://download.csdn.net/download/yangyanghaoran/5043248
關於ASP.NET MVC4 IN ACTION系列目錄地址已經生成:點擊查看目錄