袁學(xué)民，王 蘋，田曉暉

（天津大學(xué)管理與經(jīng)濟(jì)學(xué)部，天津300072）

目前的信息管理系統(tǒng)開發(fā)類課程由于理論教學(xué)課時(shí)較多，幾乎占滿整個(gè)課程，實(shí)踐部分則由單獨(dú)的實(shí)驗(yàn)構(gòu)成，課程理論課的授課時(shí)間里，基本是在介紹或鞏固理論知識(shí)，實(shí)驗(yàn)課上，重點(diǎn)是在完成實(shí)驗(yàn)，這種理論和實(shí)踐的間接分離導(dǎo)致學(xué)生理解吸收差[1]。因此本文的研究?jī)?nèi)容是將理論和實(shí)踐相結(jié)合，研究在教學(xué)過(guò)程中如何向?qū)W生演示不同開發(fā)架構(gòu)的概念，通過(guò)設(shè)計(jì)一個(gè)簡(jiǎn)單的教學(xué)實(shí)驗(yàn)來(lái)向?qū)W生演示不同開發(fā)架構(gòu)的概念，同時(shí)對(duì)比3種開發(fā)架構(gòu)的優(yōu)缺點(diǎn)，給出其在教學(xué)中是否具有深入研究的必要性說(shuō)明，以期能起到拋磚引玉之功，最終將微軟不同的開發(fā)架構(gòu)應(yīng)用于課程的教改研究中，提升教學(xué)效果。

本文選取WebForm、MVC和Blazor這3個(gè)分別代表了逐漸被淘汰、正在流行和新興起來(lái)的系統(tǒng)架構(gòu)進(jìn)行教學(xué)研究。分別探索其設(shè)計(jì)模型、架構(gòu)特點(diǎn)，并在對(duì)比其特性的基礎(chǔ)上，通過(guò)案例進(jìn)行教學(xué)實(shí)驗(yàn)，分析其異同點(diǎn)，讓學(xué)生進(jìn)一步思考新時(shí)代下不同環(huán)境的主流系統(tǒng)架構(gòu)發(fā)展趨勢(shì)，為信息管理系統(tǒng)開發(fā)類課程教學(xué)改革提供思路。

WebForm架構(gòu)沒有固定的結(jié)構(gòu)，通常指WebForm程序，它是.NET平臺(tái)提供的的設(shè)計(jì)程序模板之一，可以在微軟公司的操作系統(tǒng)中運(yùn)行。WebForm應(yīng)用程序也就是網(wǎng)頁(yè)窗體應(yīng)用程序，也稱WebForm軟件，它的原理是通過(guò)一些簡(jiǎn)單的控件和組件來(lái)實(shí)現(xiàn)功能。董夢(mèng)雨等[2]基于WebForm應(yīng)用程序設(shè)計(jì)具有管理員信息管理模塊、教師管理模塊和學(xué)生管理模塊的學(xué)生成績(jī)管理系統(tǒng)，認(rèn)為WebForm是一種框架，可以向用戶提供有條理的、面向?qū)ο箢惣瑢?duì)用戶高效開發(fā)出WebForm應(yīng)用程序是十分方便的。FOLADOR等[3]按照MVC標(biāo)準(zhǔn)，從臨床需求、研究環(huán)境出發(fā)，提出并開發(fā)了一個(gè)用戶管理帕金森病患者的繼承生物醫(yī)學(xué)數(shù)據(jù)系統(tǒng)（SⅠDABⅠ）。他們認(rèn)為在比較復(fù)雜的組織文件中，由于MVC模式允許對(duì)數(shù)據(jù)庫(kù)進(jìn)行可靠的訪問(wèn)，從而可以為開發(fā)人員提供一個(gè)簡(jiǎn)潔、有邏輯、復(fù)用程度高、擴(kuò)展限度高和高效率的代碼。PAOLONE等[4]研究關(guān)于MVC軟件體系的結(jié)構(gòu)來(lái)固定MVC Web應(yīng)用程序的度量和閾值，通過(guò)實(shí)例實(shí)驗(yàn)進(jìn)行評(píng)估和證明，這樣代碼質(zhì)量很高。Blazor是微軟提供的一個(gè)前端開發(fā)框架，它將C與瀏覽器開發(fā)相結(jié)合，解決了C在瀏覽器開發(fā)方面的一個(gè)大問(wèn)題。它的出現(xiàn)讓C#程序可以實(shí)現(xiàn)服務(wù)器、電視、桌面和物聯(lián)網(wǎng)應(yīng)用程序等，對(duì)于開發(fā)人員而言，這是一個(gè)極大的進(jìn)步。MⅠLLER[5]研究在Blazor客戶機(jī)和Web APⅠ服務(wù)器中的應(yīng)用程序之間的共享，以此來(lái)驗(yàn)證Blazor的業(yè)務(wù)邏輯，認(rèn)為Blazor在應(yīng)用程序中的功能是具有實(shí)時(shí)能力較強(qiáng)的開發(fā)模式。

1 基于3種系統(tǒng)架構(gòu)實(shí)現(xiàn)信息管理系統(tǒng)的教學(xué)實(shí)驗(yàn)設(shè)計(jì)

本文通過(guò)設(shè)計(jì)一個(gè)簡(jiǎn)單的教學(xué)實(shí)驗(yàn)來(lái)對(duì)WebForm、MVC和Blazor這3種開發(fā)架構(gòu)進(jìn)行說(shuō)明，本實(shí)驗(yàn)的系統(tǒng)結(jié)構(gòu)并不復(fù)雜，管理對(duì)象較為單一，因此由數(shù)據(jù)庫(kù)管理是比較合適的選擇。本次實(shí)驗(yàn)用的數(shù)據(jù)表“T001學(xué)生基本信息表”中，包含“姓名”“性別”“學(xué)號(hào)”“年級(jí)”“班級(jí)”“民族”6個(gè)字段。

1.1 實(shí)現(xiàn)目標(biāo)

教學(xué)實(shí)驗(yàn)的核心是在實(shí)驗(yàn)中應(yīng)用3種技術(shù)架構(gòu)，因此在實(shí)驗(yàn)設(shè)計(jì)方面，滿足數(shù)據(jù)管理有代表性的檢索功能即可，對(duì)數(shù)據(jù)管理方面不進(jìn)行過(guò)于深入的研究?；?種架構(gòu)對(duì)系統(tǒng)實(shí)現(xiàn)是本文的主要實(shí)驗(yàn)部分，主要研究目的是通過(guò)實(shí)驗(yàn)對(duì)3種架構(gòu)進(jìn)行教學(xué)講解和分析總結(jié)，便于學(xué)生們理解和應(yīng)用。

1.2 設(shè)計(jì)要求

在系統(tǒng)的設(shè)計(jì)和實(shí)現(xiàn)中，首先保證滿足系統(tǒng)的需求。3個(gè)架構(gòu)要實(shí)現(xiàn)的功能是一樣的，因此設(shè)計(jì)時(shí)的首要考慮因素是基于不同的架構(gòu)模式，如何實(shí)現(xiàn)對(duì)數(shù)據(jù)的檢索功能。將系統(tǒng)的實(shí)現(xiàn)過(guò)程總結(jié)在流程圖中，具體如圖1所示。

圖1 系統(tǒng)實(shí)現(xiàn)流程圖

1.3 實(shí)驗(yàn)環(huán)境說(shuō)明

教學(xué)實(shí)驗(yàn)通過(guò)C#語(yǔ)言編寫實(shí)驗(yàn)代碼，在Windows系統(tǒng)中運(yùn)行程序，通過(guò)Visual Studio 2008、Visual Studio 2019和SQL Server 2005工具進(jìn)行系統(tǒng)實(shí)現(xiàn)。

其中WebForm系統(tǒng)架構(gòu)的實(shí)驗(yàn)在Visual Studio 2008和SQL Server 2005環(huán)境中進(jìn)行，MVC系統(tǒng)架構(gòu)的實(shí)現(xiàn)和Blazor系統(tǒng)架構(gòu)的實(shí)現(xiàn)在Visual Studio 2019和SQL Server 2005環(huán)境中進(jìn)行。

1.4 系統(tǒng)實(shí)現(xiàn)

1.4.1 基于WebForm架構(gòu)實(shí)現(xiàn)信息管理系統(tǒng)

應(yīng)用環(huán)境搭建。在電腦上配置編譯環(huán)境Visual Studio 2008與SQL Server 2005。WebForm相較于其他2種架構(gòu)發(fā)展得較早，且在Visual Studio 2012以后的版本中不能直接在新建項(xiàng)目中找到WebForm，因此選擇存在學(xué)習(xí)資源較多的Visual Studio 2008進(jìn)行實(shí)驗(yàn)。Visual Studio 2008中提供了.NET Framwork2.0、3.0、3.5多個(gè)版本，在開發(fā)系統(tǒng)時(shí)選擇更多。

創(chuàng)建應(yīng)用程序。打開編譯環(huán)境Visual Studio 2008，依此選擇“文件”“新建”“項(xiàng)目”，并在彈出窗口中的項(xiàng)目類型選擇“Visual C#”，模板選擇“ASP.NET Web應(yīng)用程序”，并根據(jù)提示設(shè)置文件名和文件地址，點(diǎn)擊“確定”選項(xiàng)即創(chuàng)建好一個(gè)應(yīng)用程序，然后對(duì)程序內(nèi)容進(jìn)行代碼編寫。

連接數(shù)據(jù)庫(kù)。在本機(jī)的SQL Server 2005中打開數(shù)據(jù)文件，通過(guò)Visual Studio 2008的服務(wù)器資源管理器，連接到本機(jī)的數(shù)據(jù)庫(kù)，通過(guò)編寫代碼完成對(duì)應(yīng)數(shù)據(jù)信息設(shè)置綁定數(shù)據(jù)表。

數(shù)據(jù)調(diào)用及顯示。在Default.aspx文件中編寫語(yǔ)句，通過(guò)控件GridView進(jìn)行數(shù)據(jù)綁定和傳輸，對(duì)控件編寫對(duì)應(yīng)的代碼完成數(shù)據(jù)綁定，實(shí)現(xiàn)數(shù)據(jù)表的調(diào)用。完成后此時(shí)的GridView控件中已有數(shù)據(jù)表的“姓名”“性別”“學(xué)號(hào)”“年級(jí)”“班級(jí)”“民族”數(shù)據(jù)。

搜索功能。數(shù)據(jù)文件已傳遞綁定到GridView中，通過(guò)控件文本框和按鈕組合，編寫代碼對(duì)其定義，完成文本框數(shù)據(jù)字符傳遞以及檢索綁定的設(shè)置。

運(yùn)行檢測(cè)。運(yùn)行程序，先進(jìn)行精確查詢檢測(cè)。文本框中輸入要查詢的學(xué)生名字，點(diǎn)擊“Search”按鈕查詢，如圖2所示。

圖2 WebForm精確查詢示例圖

成功查詢出學(xué)生信息，再進(jìn)行模糊信息查詢檢測(cè)。關(guān)閉運(yùn)行的程序，重新運(yùn)行，在搜索框中輸入學(xué)生姓名的一個(gè)字，點(diǎn)擊“Search”按鈕進(jìn)行查詢，如圖3所示。

圖3 WebForm模糊查詢示例圖

成功查詢出所有名字包含輸入字符的學(xué)生信息，實(shí)驗(yàn)成功。

1.4.2 基于MVC架構(gòu)實(shí)現(xiàn)信息管理系統(tǒng)

應(yīng)用環(huán)境搭建。配置編譯環(huán)境Visual Studio 2019與SQL Server 2005。Visual Studio 2019具有Web Pages（頁(yè)面）、MVC（模型-視圖-控制器）和Web Forms（窗體）3種ASP.NET的編程模板，其中MVC用于創(chuàng)建Web應(yīng)用程序，分別從Model、View和Controller進(jìn)行編程。因此本次實(shí)驗(yàn)進(jìn)行的MVC應(yīng)用程序選擇在Visual Studio 2019中設(shè)計(jì)和完成。

創(chuàng)建應(yīng)用程序。打開Visual Studio 2019，選擇“創(chuàng)建新項(xiàng)目”，在創(chuàng)建新項(xiàng)目頁(yè)面的搜索框中輸入asp.net web，此時(shí)選取“ASP.NET Web”模板，這里需要注意編程語(yǔ)言的選擇，因?yàn)閂isual Studio 2019提供多種編程語(yǔ)言的“ASP.NET Web”模板，本次實(shí)驗(yàn)選擇C#語(yǔ)言進(jìn)行實(shí)驗(yàn)，點(diǎn)擊“下一步”按鈕，在配置新項(xiàng)目界面設(shè)置文件名和選擇文件存儲(chǔ)地址，即創(chuàng)建好應(yīng)用程序。

Controller（控制器）的實(shí)現(xiàn)。右鍵單擊“解決方案資源管理器”中的“Controllers”文件夾，點(diǎn)擊“添加”，根據(jù)提示設(shè)置控制器名稱完成添加。

Model（模型）的實(shí)現(xiàn)。具體過(guò)程如下：①右鍵單擊“解決方案資源管理器”里的“Model”文件夾，依次選擇“添加”和“新建項(xiàng)”；②彈出的界面中依次選擇“已安裝”“Visual C#”以及“數(shù)據(jù)”，在數(shù)據(jù)模型中選擇“ADO.NET實(shí)體數(shù)據(jù)模型”；③設(shè)置Model名稱，在彈出的“實(shí)體數(shù)據(jù)模型向?qū)А敝羞x擇“來(lái)自數(shù)據(jù)庫(kù)的EF設(shè)計(jì)器”，點(diǎn)擊“下一步”按鈕；④點(diǎn)擊“新建連接”，在彈出的界面中，“數(shù)據(jù)源”目錄處選擇“Microsoft SQL Server”，單擊“確定”；⑤根據(jù)界面提示在“服務(wù)器名稱”項(xiàng)寫上Microsoft SQL Server中的服務(wù)器的名稱，選取“使用SQL Server身份驗(yàn)證”，依據(jù)提示完成用戶名及密碼的填寫，再測(cè)試連接是否成功，完成數(shù)據(jù)連接的話會(huì)出現(xiàn)“連接成功”的提示，這里的數(shù)據(jù)也就是模型-視圖-控制器中的模型。

View（視圖）的實(shí)現(xiàn)。視圖的創(chuàng)建，第一步雙擊之前的“Controllers”文件夾，點(diǎn)擊“Controllers.cs”文件，在return View()的方法內(nèi)單擊右鍵，選擇“添加視圖”，根據(jù)提示完成視圖添加。

運(yùn)行檢測(cè)。在相關(guān)的配置完成后，運(yùn)行程序，在搜索欄中輸入要查詢的學(xué)生名字，點(diǎn)擊“搜索”，如圖4所示。

圖4 MVC精確查詢示例圖

成功查詢到學(xué)生信息，說(shuō)明程序成功。

再進(jìn)行模糊查詢的檢測(cè)，在搜索欄里輸入要查詢的關(guān)鍵詞，點(diǎn)擊“搜索”，如圖5所示。

圖5 MVC模糊查詢示例圖

成功查詢到名字里包含關(guān)鍵詞的所有學(xué)生，模糊查詢檢測(cè)完成。

1.4.3 基于Blazor架構(gòu)實(shí)現(xiàn)信息管理系統(tǒng)

應(yīng)用環(huán)境搭建。配置編譯環(huán)境Visual Studio 2019與SQL Server 2005。因?yàn)锽lazor的技術(shù)對(duì)環(huán)境要求較高，而且微軟的環(huán)境具有向下兼容的特點(diǎn)，因此選擇最高的.NET Core 5.0，防止一些不必要的意外情況發(fā)生。而Visual Studio 2019提供了Blazor架構(gòu)的模型與.NET Core 5.0的版本支持，所以本次實(shí)驗(yàn)進(jìn)行的Blazor應(yīng)用程序選擇在Visual Studio 2019中設(shè)計(jì)和完成。

創(chuàng)建應(yīng)用程序。啟動(dòng)Visual Studio 2019并點(diǎn)擊“創(chuàng)建新項(xiàng)目”，在“新建項(xiàng)目”項(xiàng)中，選擇“ASP.NET Core Web應(yīng)用程序”，隨后在界面“配置新項(xiàng)目”中，進(jìn)行“項(xiàng)目名稱”的設(shè)置。需要注意的是，要記住項(xiàng)目名稱，在后續(xù)的代碼工作中會(huì)有用。然后點(diǎn)擊“創(chuàng)建”，在彈窗的“創(chuàng)建新的ASP.NET Core Web應(yīng)用程序”界面中，選取“.NET Core”“ASP.NET Core 5.0”以及“ASP.NET Core Web應(yīng)用”，點(diǎn)擊“創(chuàng)建”，程序即創(chuàng)建完成。

設(shè)置網(wǎng)站樣式。在Pages/Shared/_Layout.cshtml文件中，設(shè)置網(wǎng)站的樣式，其中對(duì)網(wǎng)頁(yè)要顯示的數(shù)據(jù)表的列名也在此設(shè)置；在Pages/Ⅰndex.cshtml文件中，設(shè)置網(wǎng)頁(yè)適應(yīng)設(shè)備版本的格式。

數(shù)據(jù)模型。在項(xiàng)目文件中，建立相關(guān)的數(shù)據(jù)模型，連接數(shù)據(jù)庫(kù)，將數(shù)據(jù)導(dǎo)入模型。中間可以進(jìn)行運(yùn)行程序隨時(shí)檢測(cè)，保證程序可以運(yùn)行。

添加篩選。在Students/Ⅰndex.cshtml.cs文件中，進(jìn)行添加篩選的操作，編寫代碼以完成精確搜索和模糊搜索的目的。

運(yùn)行檢測(cè)。在相關(guān)的配置完成后，運(yùn)行程序，在搜索欄中輸入要查詢的學(xué)生名字，點(diǎn)擊“搜索”，如圖6所示。

圖6 Blazor精確查詢示例圖

成功查詢到學(xué)生信息，說(shuō)明程序成功。

再進(jìn)行模糊查詢的檢測(cè)，在搜索欄里輸入要查詢的關(guān)鍵詞，點(diǎn)擊“搜索”，如圖7所示。

圖7 Blazor模糊查詢示例圖

成功查詢到名字里包含關(guān)鍵詞的所有學(xué)生，模糊查詢檢測(cè)完成。

2 實(shí)驗(yàn)結(jié)果分析總結(jié)

在教學(xué)實(shí)驗(yàn)中，學(xué)生可以通過(guò)對(duì)WebForm架構(gòu)、MVC架構(gòu)和Blazor架構(gòu)的分別實(shí)踐，完成了對(duì)3種架構(gòu)的不同思維模式的思考和體驗(yàn)。3種架構(gòu)的開發(fā)模式區(qū)別很大，在數(shù)據(jù)管理、數(shù)據(jù)規(guī)模、便捷性等方面有著各自的優(yōu)缺點(diǎn)。

WebForm應(yīng)用程序開發(fā)快速，開發(fā)時(shí)具有其他2種架構(gòu)都沒有的直觀性，但其可容納的數(shù)據(jù)規(guī)模較小，在較多數(shù)據(jù)時(shí)，通過(guò)控件的方式進(jìn)行每次數(shù)據(jù)調(diào)用則會(huì)大大影響運(yùn)行速度。MVC架構(gòu)開發(fā)的結(jié)構(gòu)清晰，模型、視圖和控制器分工明確，可擴(kuò)展性強(qiáng)，變化能力強(qiáng)。且MVC架構(gòu)直接將數(shù)據(jù)存儲(chǔ)到模型當(dāng)中，在處理大規(guī)模數(shù)據(jù)時(shí)，它的運(yùn)行能力也更強(qiáng)于WebForm應(yīng)用程序，因此也是3種架構(gòu)中當(dāng)前應(yīng)用得最多的架構(gòu)。Blazor架構(gòu)通過(guò)創(chuàng)建了一個(gè)新的界面，也就是一個(gè)單獨(dú)的Web框架，而不是MVC的多層結(jié)構(gòu)，比起MVC的結(jié)構(gòu)更加簡(jiǎn)單。比起WebForm的控件思維，Blazor與其有相似之處，但是對(duì)數(shù)據(jù)的處理能力強(qiáng)于WebForm。

3 3種架構(gòu)應(yīng)用于開發(fā)類課程的教學(xué)思考

判斷一個(gè)系統(tǒng)架構(gòu)的好壞需要從程序的結(jié)構(gòu)合理、代碼的復(fù)用性等方面去分析，表1列出了3種架構(gòu)的對(duì)比總結(jié)。判斷一種架構(gòu)是否適合應(yīng)用于課程教學(xué)中，也需要從學(xué)習(xí)難易程度、市場(chǎng)接受度等方面去分析。

表1 3種架構(gòu)對(duì)比總結(jié)

通過(guò)實(shí)驗(yàn)過(guò)程，可以很明顯地感受到WebForm對(duì)比MVC和Blazor，在開發(fā)過(guò)程中最大的優(yōu)勢(shì)就是開發(fā)方式簡(jiǎn)單且容易學(xué)習(xí)，基于控件進(jìn)行的開發(fā)讓W(xué)ebForm對(duì)初學(xué)者十分友好，但是模塊和層次方面不如其他2種架構(gòu)，正在慢慢被市場(chǎng)所淘汰，可以讓學(xué)生作為入門學(xué)習(xí)內(nèi)容來(lái)練習(xí)一些小型系統(tǒng)的開發(fā)，建議減少其在開發(fā)類課程體系中的占比。

MVC對(duì)比起其他2個(gè)架構(gòu)最明顯的特征就是層次十分分明，3個(gè)模塊分工合作，這對(duì)不同類型的項(xiàng)目適用性是很強(qiáng)的。對(duì)于大多數(shù)學(xué)生來(lái)說(shuō)，MVC讓學(xué)生更加清晰地了解模型的整體，開發(fā)過(guò)程也更加規(guī)范和有跡可循。MVC的3層架構(gòu)，讓MVC的代碼復(fù)用性遠(yuǎn)遠(yuǎn)高于WebForm和Blazor，而且不僅是代碼的復(fù)用，在程序的維護(hù)方面、代碼的安全性方面也更具有保障，目前正被市場(chǎng)廣泛認(rèn)可。建議將MVC作為信息管理系統(tǒng)開發(fā)類課程的必修內(nèi)容，增加其在開發(fā)類課程體系中的占比。Blazor比起其他2種架構(gòu)來(lái)說(shuō)，是一種較新的技術(shù)，它的結(jié)構(gòu)和功能都與WebForm比較相似，層次結(jié)構(gòu)沒有很分明，但是能滿足的需求多，“小而精”比較符合Blazor在架構(gòu)中的定位。離線訪問(wèn)功能增加了Blazor的市場(chǎng)競(jìng)爭(zhēng)力。但是Blazor架構(gòu)才剛剛興起，發(fā)展還不夠深入完整，可以學(xué)習(xí)參考的資料比起其他2種架構(gòu)來(lái)說(shuō)還是比較少，不建議將其納入開發(fā)類課程體系中，但是可以組織學(xué)生以興趣小組的方式去學(xué)習(xí)，進(jìn)一步提高有拔高需求的學(xué)生們的架構(gòu)開發(fā)能力。