mvc實現用戶登錄,ASP.NET MVC 企業級實戰 —— 創建用戶權限管理范例程序(三)

 2023-12-07 阅读 24 评论 0

摘要:上一篇,主要講解了模型的創建和利用Entity Framework來操作數據庫,這篇我們會講解如何創建控制器和視圖。 由于最近很多網友反饋在VS 2012 無法安裝NBlock框架模版,故再次聲明,NBlock框架目前在支持 VS 2010 。 NBlock框架采用ASP.NET MVC3作為UI

上一篇,主要講解了模型的創建和利用Entity Framework來操作數據庫,這篇我們會講解如何創建控制器和視圖。

由于最近很多網友反饋在VS 2012 無法安裝NBlock框架模版,故再次聲明,NBlock框架目前在支持 VS 2010 。

NBlock框架采用ASP.NET MVC3作為UI展現,用JQuery 插件提高用戶交互體驗,ORM采用微軟的Entity Framework 4.3.1的一套快速開發框架。

用戶權限管理的訪問地址:http://42.121.122.31/, 速度可能會慢,因為我是通過園豆購買的阿里云主機,最差的那種配置。

mvc實現用戶登錄,?

下面進入我們的正題,一步一步來創建用戶權限管理范例程序,接上一篇的內容如下:

七、 控制器和視圖(Controllers and Views)

傳統的Web 框架,如ASP/PHP/ASP.NET Web Forms 等等,請求的URL 地址都是映射到特定的文件。如請求的URL 地址,像/Products.aspx 或/Products.php,由 Products.aspx 或Products.php 文件負責處理。

基于Web 的MVC 框架映射URL 地址到服務器端代碼有點不同,不是映射URL 地址到特定文件,而是映射到類的方法上。這些類就是MVC 中的 Controller 控制器,它們負責處理進來的請求和用戶輸入,接收和保存數據,并返回結果給客戶端(顯示HTML、下載文件、JSON格式的數據、或重定向到不同的URL 等等)。

現在,我們已經創建一個基本的Model類,下一步將添加控制器類到項目中,為OrgAuth應用系統提供用戶信息的列表展示和維護信息表單。

?? 7.1 添加UserController控制器

mvc框架怎么建立、右鍵點擊Web 項目中的Controllers 文件夾,選擇 添加 -> Controller,如下圖所示。

clip_image002[15]

在彈出的Add Controller 對話框,控制器名稱輸入UserController。點擊Add按鈕,在項目文件中添加UserController.cs 文件。

clip_image004[4]

我們先制作一個用戶列表供訪問者游覽,用戶列表會檢索出所有的用戶,包含停用的和未被停用的用戶。應用程序將發布如下的URL 地址:/User/,對應的Action方法是Index。如下圖所示。

ASP.NET MVC4開發指南?clip_image005[4]

NBlock框架是利用JQuery插件FlexiGrid來顯示列表的,而該列表獲取數據的方式是異步請求規定格式的JSON數據,所以我們還需要再定義一個獲取數據源的名為List的Action方法,返回值是JsonResult。如下圖所示。

clip_image006[4]

 public JsonResult List(nbPageInfo pager, nbSearchCondition where)
{
var pageData = userRepository.GetPageable(pager, where);
return Json(pager.ToGridData(pageData));
}

在這個List的Action方法中,我們使用之前介紹的OrgAuthRepository類來實現獲取分頁檢索數據的方法。

說明:nbPageInfo類型參數和nbSearchCondition類型參數是NBlock框架為分頁查詢檢索特意封裝的類型,一個是封裝了分頁信息,一個是封裝了查詢條件信息。

?? 7.2 給控制器使用OrgAuthRepository

mvc設計模式?現在UserController 可以直接定義一個OrgAuthRepository<UserInfo>實例作為UserController類的成員變量,不過這樣會使UserController緊耦合OrgAuthRepository類。耦合(Coupling)指一個類顯式依賴另外的一個類才能工作。因為OrgAuthRepository類需要訪問數據庫,導致構建OrgAuthRepository類比較復雜,也不利于單元測試。

我們可以通過Dependency Injection(依賴注入)設計模式來解決這一問題,類之間(如Repository 類提供數據訪問)不再創建隱式的依賴。而是通過調用方的構造函數的參數,顯式傳遞依賴關系。如果依賴關系通過接口來定義,我們就可以針對單元測試的情況,靈活傳遞虛假(Fake)的依賴實現。這樣,我們在創建測試相關的依賴實現時,不必訪問真實的數據庫。

NBlock框架已經內置了Dependency Injection(依賴注入),而OrgAuthRepository類是繼承于IOrgAuthRepository接口的,故我們在UserController類通過構造函數的方式注入IOrgAuthRepository接口。代碼如下所示:

 #region 構造函數
private readonly IOrgAuthRepository<UserInfo> userRepository;
public UserController(IOrgAuthRepository<UserInfo> userRepository)
{
this.userRepository = userRepository;
}
#endregion

?

到這里,我們的UserController類就有了userRepository成員變量,那么7.2提到的List的Action方法就可以利用userRepository來獲取分頁查詢數據了。

? 7.3 為控制器添加視圖Views

mvc模式的web框架有哪些,盡管在Action 方法中可以寫代碼拼裝HTML,通過Response.Write() 方法返回給客戶端,但是這種方法并不可取。更好的辦法是,在UserController 的Action 方法中只處理業務和數據邏輯,并將相關的數據傳遞給單獨的視圖(view)模板,視圖(view)負責生成HTML 來展示信息。隨后我們會看到,視圖(view)模板就是一個簡單的文本文件,通常包含HTML 標識和嵌入的腳本。將控制器Controller 邏輯和視圖view 展示分開帶來很多好處,尤其是它可以清晰地隔離開后臺邏輯代碼和用戶展示界面。這可以方便修改用戶展示界面,而不會更改后臺邏輯代碼,當然也有助于開發人員和用戶界面設計人員在項目中的合作。

下面,我們右鍵點擊UserController 類的Index方法,選擇 Add View,如下圖所示。

clip_image002[19]

在彈出的Add View 對話框,默認情況下,對話框中的視圖名稱就與光標所在的Action 方法中的視圖名稱一致,我們就是要創建Index視圖,故不需要修改。點擊下方的 Use a layout or master page文件選擇按鈕,選擇_LayoutList.cshtml布局文件。這是NBlock框架模版默認自帶的幾套布局之一。

clip_image003

mvc執行流程?點擊Add 按鈕,Visual Studio將在\Views\User 目錄創建一個新的Index.cshtml 視圖模板,如果該目錄不存在,也會自動創建目錄。默認情況下,視圖模板有定義標題和布局的代碼塊。如下圖所示。

clip_image004

為了實現Index視圖的用戶列表檢索界面,我們需要添加列表定義的代碼,如下圖所示。nbGridFor是NBlock框架封裝的列表HTMLHelper類,nbGridFor需要指定列表顯示的數據類型,我們指定了UserInfo數據類型,同時nbGridFor還需要接受一個Action委托參數,用來設置列表的顯示,我們設置了列表需要顯示的列信息。

clip_image001

@(Html.nbGridFor<UserInfo>(s =>
{
s.Columns(c =>
{
c.Bind(m => m.Id).IsKey();
c.Bind(m => m.UserCode);
c.Bind(m => m.UserName);
c.Bind(m => m.OrgName);
c.Bind(m => m.AccountState);
c.Bind(m => m.SeqNo);
c.Bind(m => m.UpdateUser);
c.Bind(m => m.UpdateDate);
});
}))

php的mvc框架?下面運行OrgAuth 范例程序,登錄應用系統之后,在瀏覽器地址欄輸入:/User。如下圖所示。

clip_image002[21]

整個列表的布局效果是顯示出來了,有我們定義的顯示字段,有分頁導航條,但是沒有沒有數據,在數據庫中已經有5條用戶信息。這是因為我們只設置了列表顯示的代碼,而沒有設置獲取數據的代碼,我們修改一下Index.cshtml視圖的代碼,設置列表的Action屬性為List這個Action方法,如下圖所示。

clip_image003[4]

我們再次運行OrgAuth 范例程序,登錄應用系統之后,在瀏覽器地址欄輸入:/User。如下圖所示。

mvc實例。clip_image005

OrgAuth 范例程序運行出現了錯誤,報SQlite不存在表NB_UserInfo。這是因為我們更換了數據庫而沒有修改Web項目的連接字符串。修改完連接字符串之后就可以看到完整的界面了,如下圖所示。

clip_image007

clip_image009

到這里,已經講解完ASP.NET MVC 和 NBlock框架的基本概念。我們知道了如何創建Model對象,如何創建控制器及編寫Action方法,如何創建視圖。開發步驟如下:

怎么將.net mvc程序部署。第一步,新建數據庫OrgAuth,

第二步:新建用戶表NB_UserInfo

第三步:添加Model對象到OrgAuth.Models類庫項目下的Model.edmx文件中,

第四步:添加控制器(Controller)到OrgAuth.Web項目的Controllers文件下。

第五步:添加Action方法,并創建相應的視圖(view)。

第六步:運行OrgAuth 范例程序,查看運行效果!

其中第三步到第五步在后續的開發中會經常重復操作!最后我們需要增加菜單來導航到用戶列表界面,如下圖所示。

clip_image002

實現上述功能,只需要在Service項目中 /Core/nbPrivilegeService.cs文件中增加如下代碼。

new nbPrivilege{
Id = "8362fa20-49c2-48fb-a0bd-33f81408589b",
Code = "User",
Name = "用戶管理",
ParentId = "bf1ea2e3-36f5-4af0-b485-8d15b16bf53d",
ParentCode = "SysSetting",
Url = "/User",
},

今天就講到這里,下一篇我們會講解如何完善用戶列表界面,敬請期待!

轉載于:https://www.cnblogs.com/lfzx_1227/archive/2012/11/30/2795759.html

版权声明:本站所有资料均为网友推荐收集整理而来,仅供学习和研究交流使用。

原文链接:https://hbdhgg.com/4/193072.html

发表评论:

本站为非赢利网站,部分文章来源或改编自互联网及其他公众平台,主要目的在于分享信息,版权归原作者所有,内容仅供读者参考,如有侵权请联系我们删除!

Copyright © 2022 匯編語言學習筆記 Inc. 保留所有权利。

底部版权信息