MVC模式在高校網站CMS系統中的應用研究

2016-12-23 05:35:53郭欣徐芳

微型電腦應用 2016年9期

郭欣，徐芳

郭欣，徐芳

對于高校而言，網站是宣傳學校文化背景以及教育水平的重要途徑之一。通過學校網站可以讓師生更好、更快地了解學校的最新動態和發展情況。傳統的網站建設具有一些局限性，例如：語言的純解釋性執行、服務器端腳本與前端腳本混在一起從而不利于后期的系統維護、安全性不強等，從而使得所開發的網站性能不高、安全性不強、網站可擴展性不足。針對這些特點，研究如何在新技術的幫助下建立學校的網站，從而幫助學校更好的對外宣傳。在研究MVC模式的基礎上，構建了一個高校網站CMS系統，該系統的設計與實現方法具有普遍意義，對其他高校的網站設計與開發具有一定的借鑒作用。

MVC模式；CMS；網站系統

0 引言

隨著網絡通訊以及WEB2.0的快速發展，網站作為一種宣傳途徑，其表現形式和技術不斷的在更新提高。但是，傳統的開發模式存在語言的純解釋性執行、服務器端腳本與前端腳本混在一起從而不利于后期的系統維護、安全性不強等缺點，從而使得應用傳統模式開發的網站性能不高、安全性不強、網站可擴展性不足。MVC的出現使得Web開發結構清晰，條理清楚，框架層次分明，并且易擴展與維護。對于學校而言，因為牽涉到的部門、學院、處室比較多，所以網站良好的擴展性和可維護性是至關重要的，所以選擇MVC模式作為學校網站建設的模式是再合適不過了。CMS作為一種常用的網站內容管理系統，在網站后期維護中起到舉足輕重的作用，它提供給各個部門以及處室一個統一的維護平臺，使得學校的對外宣傳內容具有連貫性和流通性，使消息的更新更加及時和準確。本文圍繞“如何利用MVC模式構建學校網站CMS系統”這一問題展開研究。

1 CMS簡介

CMS是Content Management System的縮寫，中文譯為“內容管理系統”。CMS從2000年開始成為一個重要的應用領域，從商業門戶網站的新聞系統到個人的博客都可以使用CMS實現[1]。在國外，CMS已經得到了良好的發展，尤其是在較大規模的公司中，已經通過應用體現了其價值和優勢，如Microsoft、Interwoven、Documentum等公司已經開發出功能強大的 CMS，并且占據了大量的市場份額。在國內，也出現了很多的CMS，如asp版的動易的CMS，php版的PHPCMS等，它們相互競爭，在技術、服務上不斷的更新和提高[2]。

CMS的設計思想是將網站的數據內容與其顯示相分離，從而解決網站功能擴展困難、內容更新不及時、維護成本高等難題。CMS的具體設計思路：頁面設計存儲在模板里，內容數據存儲在數據庫或獨立的文件中。當用戶向頁面發出訪問請求時，各部分聯合生成一個標準的HTML頁面，響應用戶的請求。CMS各部分的基本分工和實現流程如圖 1所示[3]：

圖1 CMS分工和實現流程

由上圖可見CMS是一種位于Web前端（Web服務器）和后端網站系統或流程（內容創作、編輯）之間的軟件系統，提供直接的接口給管理人員和業務人員。內容的創作人員、編輯人員、發布人員使用CMS接口非常容易提交、修改、審批、發布內容，從而加快了內容的更新，提高了準確率，降低了信息獲取的開銷。

2 MVC模式介紹

MVC是（Model-View-Controller）的簡稱，即模型-視圖-控制器。MVC是Xerox公司在20世紀80年代為編程語言Smalltalk-80發明的一種軟件設計模式，目的是實現程序中的數據模型和用戶界面程序代碼分離，最近幾年被推薦為Sun公司J2EE平臺的設計模式，并且越來越受到開發者的歡迎[4]，主要有3三部分組成：

模型（Model）是一組類，用于說明正在處理的數據以及如何操作這些數據的業務規則，基本上是用來和數據庫進行交互的。類似Entity Framework、LINQ to SQL這些工具的作用。

視圖（View）是應用程序的界面，用來處理數據的頁面顯示樣式。

控制器（Controller）是一組類，用于處理來自用戶、整個應用程序流以及特定應用程序邏輯的通信。是用戶界面和數據庫進行交互的媒介。

MVC中的每個視圖都是通過控制器去渲染的，控制器會向視圖提供所需要的渲染數據，并通過視圖展示出來，視圖和控制器通過Views文件夾下面對應的controller名字的文件夾來進行關聯。視圖展示模型中的數據有兩種方法，一種方式是通過 ViewBag屬性把模型實例添加到視圖的數據字典中，然后在視圖中顯示他們。另一種方式是通過控制器中的return View()方法，向該方法傳遞模型實例，這樣模型實例會賦給 ViewData.Model屬性，接著在視圖頁面引用該模型實例的類型，這樣就可以在視圖頁面使用智能感應提示來調用該模型實例的各個字段，也就是強類型視圖。關于這三者之間的關系和各自的主要功能，如圖2所示[5]；

圖2 MVC組件類型的關系和功能

3 基于MVC模式的網站CMS系統基礎架構設計

高校網站CMS系統在設計時面臨以下問題：

（1）如何設計高度靈活的數據存儲和數據處理機制，以支持未知的、相互差別很大的用戶需求。

從根本上說，CMS的首要任務是分離數據的管理和數據的展示。對數據的管理而言，雖然總體上學校的各個院系、部門網站對數據存儲和數據處理的需求都很類似，但各院系、部門仍有一定的特殊需求。

（2）設計合理的模板解析引擎、提供方便的數據獲取接口。

在數據的展示方面，各院系、部門對網站外觀的要求千差萬別，不可能構建一個能內置任何前端界面要求的 CMS系統。普遍的思路是基于模板技術，由用戶使用模板設計語言根據自己的需求設計制作頁面展示模板，由CMS提取填充頁面內容所需的數據，將模板解析為網站前端頁面，將數據填充到前端頁面中，以形成最終的展示效果。

（3）還需要解決系統的易用性、權限配置和安全設置方面的要求。

由于各院系、部門普遍缺乏專業的信息管理人員，網站的管理工作通常由行政人員兼職負責，因此對網站管理的易用性提出了較高的要求；由于網站管理人員相關知識技能水平參差不齊，因此對網站各種功能的權限控制要求也較為嚴格；由于各院系、部門不可能投資建立自己的服務器和機房，因此通常只能是學校分配虛擬主機部署網站；對網站的安全性要求也較高。

MVC模式的設計思想與內容管理系統 CMS（Content Management System）中內容與形式分離的需求不謀而合，可以有效解決以上高校網站 CMS系統的設計難題。根據MVC模式可以把網站CMS系統的總體結構在邏輯上分為3個部分：視圖View、模型Model和控制器Controller，其中視圖View代表呈現給用戶的界面，包括Web頁面、WAP界面、SOAP等等，用于界面顯示；模型Model代表業務數據，及訪問和修改數據的相關規則，負責與數據源交互；控制器Controller位于視圖與模型之間并處理二者的消息映射和業務邏輯，負責接收用戶的HTTP請求，將用戶的輸入翻譯成數據請求并判斷該請求交給哪個模型來處理，然后選擇合適的用戶視圖來展示經模型處理后的請求輸出[6]。具體架構如圖3所示：

圖3 基于MVC模式的網站CMS系統基礎架

4 基于MVC模式的網站CMS系統實現

4.1 系統目錄規劃

建立一個名字為杉達（Sandau）CMS的web應用程序，使用ASP.NET MVC3作為結構框架。

網站大致分為這么幾個部分，首先應用程序默認建立了三個部分也就是 MVC的核心：Views文件夾，Controllers文件夾和Models文件夾。Views文件夾用來存放所有視圖文件，Controllers文件夾用來存放所有的控制器文件，Models文件夾用來存放所有的數據模型。除了以上三個文件夾外，視圖中所使用的所有CSS樣式文件全部放在Content文件夾中，所有的圖片則放在 Image文件夾中，所有的 javascript文件以及jquery庫都放在Scripts文件夾中。

4.2 模型對象的設計

1）News模型對象

采用EF作為模型對象到數據庫表的具體映射，在Model文件夾中創建News.cs的類文件并且設計所有News表相關屬性，包括：newsID、newsTitle、newsDate、newsPart、newsWords、newsCreateTime和 newsUpdateTime。通過該Model生成具體的 controller以及 EF的上下文對象NewsContext，通過該對象可以直接對數據庫進行增、刪、改、查等操作。

2）Account模型對象

創建 AccountModels.cs的類文件用來映射用戶權限角色相關屬性。用戶操作可以分為3種方式，第一種就是登錄創建LogonModel登錄類文件：

其中，[Required]代表當用戶沒有在該屬性上進行任何輸入的時候將提示驗證非空信息。[Display(Name="User name")]代表該屬性字段在視圖中渲染顯示的值為User name而非UserName屬性名。[DataType(DataType.Password)]代表該屬性字段在用戶輸入的時候將采用密碼輸入的常規方式不可見。該類文件具有3個屬性字段：UserName表示用戶姓名，Password表示用戶密碼，RememberMe表示是否記住密碼。

第二種就是修改密碼創建 ChangePasswordModel登錄類文件：

同樣的三個屬性字段都需要用戶進行非空輸入，同時對于newpassword的輸入有最小長度的要求，而密碼匹配驗證也是在屬性級別驗證掉了，使用的System.Web.Mvc命名空間的Compare方法。

第三種就是注冊用戶RegisterModel類文件：

注冊類有 4個屬性字段 UserName、Password、ConfirmPassword以及Email。4個屬性字段都是必填項，其中Email采用DateType.Email來驗證。

4.3 控制器的設計

1）NewsController

NewsController中需要有所有 news的集中展示頁面，該方法需要返回一個db.News.toList()對象（db為NewsContext的實例化對象）。該方法使用int id作為參數，并且使用 db.News.Find(id)方法來取得具體的某條新聞內容，最后返回該News對象創建新聞的動作，使用news對象作為輸入參數，該參數會把頁面中的所有表單中的相關字段都作為 news的屬性通過 httppost方法提交到數據庫。通過db.News.Add（news）以及db.SaveChanges()方法來實現創建新聞的業務邏輯、編輯具體某篇新聞的內容。編輯某篇新聞時，首先需要通過get方法從服務器端獲取該新聞的所有相關字段，然后通過httppost把修改過的新的news對象遞交到服務器進行數據的修改。執行刪除操作的時候和編輯類似，首先也是需要使用get方法從服務器獲取數據，用來給用戶確認該新聞的具體信息，然后通過 db.News.Remove(news)以及db.SaveChanges()從數據庫中刪除該數據[7]。

2）AccountController

AccountController作為用戶帳戶控制器，調用membership中的許多方法進行數據驗證，如果要使用membership中的方法，則需要在web.config中進行一定的修改和配置。

首先，需要在web.config中添加節點，該節點的defaultprovider屬性表示所要使用提供程序的名稱，這里使用DefaultMembershipProvider作為該提供程序的名稱。在節點中添加一個節點，該節點中的節點具有許多屬性，鑒于篇幅這里不再一一列出。

然后，使用到以下方法：

LogOn()方法實現用戶的登錄業務邏輯處理，該方法需要重載，以滿足httpGet和httpPost的請求，用戶點擊登錄，首先通過[HttpGet]LogOn()來加載表單以讓用戶進行用戶名和密碼的輸入，用戶輸入完成點擊提交則調用[HttpPost]LogOn()方法用來提交表達進行驗證，所以[HttpGet]LogOn()方法只是返回一個 View()，具體的業務邏輯的處理是放在[HttpPost]LogOn()中的。然后對輸入框進行輸入的驗證使用ModelState的isvalid屬性，如果返回true則驗證成功，之后匹配用戶輸入的用戶名和密碼，則使用Membership.ValidateUser[8]。

LogOff()方法用來實現用戶的注銷業務邏輯，該方法直接調用 FormsAuthentication.SignOut()方法，并通過 return RedirectToAction ("Index","Home")重定向到首頁。

Register()方法使用RegisterModel對象作為傳入參數接受用戶的表達輸入，并且需要兩個重載，分別對應用戶的get和post請求，get請求中并沒有實質性的內容，只是用來渲染注冊視圖給用戶進行表單的輸入，post請求中同樣首先進行模型的輸入驗證。

ChangePassword()方法需要提供兩個參數，舊密碼和新密碼，如果修改成功返回true，并且跳轉到ChangePassword Success視圖。這里牽涉到使用Membership.GetUser()方法獲取用戶的信息，使用User. Identity.Name作為第一個參數，第二個參數是用來確定該用戶是否在線，這里使用true代表該用戶在線。

這里還重寫了系統默認的Dispose方法，該方法是用來釋放相關資源的。使用以下代碼：

db.Dispose()的意思就是釋放db對象的所有資源，這里就是指EF框架生成類NewsContext和數據庫交互的所有資源。

每次調用完controller中的動作之后，都會自動執行該動作，用來釋放資源。

至此所有的 AccountController的業務邏輯已經全部完成，接下來就是視圖的設計。

4.4 視圖的設計

1）Shared文件夾視圖

該文件夾主要用來存放所有的視圖共享文件，其中就包括了登錄模塊視圖_LogOnPartial.cshtml以及帳戶權限登錄的所有視圖的母版視圖_Layout.cshtml。

2）Account文件夾視圖

根據 AccountController中的動作設計，創建相關的LogOn.cshtml、Register.cshtml、ChangePassword.cshtml和ChangePasswordSuccess.cshtml四個視圖文件。

LogOn.cshtml視圖文件使用_Layout.cshtml作為母版頁，并且使用@model SandauCMS.Models.LogOnModel調用LogOnModel數據模型對象，這樣在視圖中就可以使用LogOnModel強類型對象了，并且針對該對象屬性會有自動提示，該視圖引用了兩個 js文件：jquery.validate.min.js、jquery.validate.unobtrusive.min.js，這兩個文件主要是用來實現ajax相關驗證的。之后使用@using(Html.BeginForm())來形成form表單，再使用@Html.LabelFor()強類型html輔助方法顯示UserName的Label表單，@Html.TextBoxFor()強類型html輔助方法顯示UserName的輸入TextBox表單，使用@Html. ValidationMessageFor()強類型html輔助方法顯示UserName表達輸入錯誤驗證信息。同樣的 Password和RememberMe的相關表單也通過強類型的html輔助方法實現，不同的是 RememberMe字段需要使用一個@Html. CheckBoxFor來生成checkbox表單，用來生成用戶的Cookie，避免重復輸入登錄驗證。使用來提交表單數據到服務器進行登錄驗證。

3）News文件夾視圖

該文件夾視圖主要是用來新聞后臺維護的，總共有5個視圖文件：分別為Index.cshtml、Create.cshtml、Delete.cshtml、Edit.cshtml和Detail.cshtml。Index.cshtml對應所有新聞的新聞列表，包括創建新聞以及某條新聞的修改和查看詳細內容、刪除功能。Create.cshtml對應創建新聞頁面。Delete.cshtml對應刪除新聞頁面。Edit.cshtml對應修改新聞頁面。Detail.cshtml對應詳細顯示某條新聞的內容。

4）Sandau文件夾視圖

該文件夾視圖主要是用來顯示前臺頁面的，包括以下幾個視圖：SandauNews_LayoutPage.cshtml（該視圖文件是作為新聞列表頁面，以及詳細內容頁面的母版視圖）、Default.cshtml學校首頁視圖文件、NewsList.cshtml新聞列表頁面和NewsDetail.cshtml詳細新聞內容頁面。

5 系統使用情況

該系統主要由部門及學院信息管理人員使用，正在使用的行政部門有17個，學院有12個，還有若干專題網站由信息辦進行統一編輯管理。同時為了系統的安全，考慮到教職工身份驗證的安全性，采用從信息門戶單點登錄的方式進行訪問，通過設置不同賬號角色實現不同權限。

為了更進一步方便大家的使用，我們進行了相關系統操作培訓。投入使用一年后，用戶反饋情況如下：用戶體驗方面，信息發布及管理便捷、用戶界面友好，比如從信息的起草、審核、發布到整個網站的創建，只要利用系統配置工具便可輕松配得，而無需編寫任何代碼；在系統運行方面，由于采用了JAVA技術，一次編譯后，其后訪問效率極高；平臺還支持圖文一體的仿Word的在線編輯功能，使得用戶的編輯選擇有了很大的靈活性，用戶可以通過像使用Word一樣使用此功能，從而也縮短了用戶的學習時間。該系統整體得到了使用人員較好的反饋。

6 總結

本文在研究MVC模式的基礎上，構建了一個高校網站CMS系統，學校各個部門通過該CMS可以方便地進行新聞內容的發布和更新，結合MVC模式將數據庫、web應用服務器的制作與發布進行分離，提高了訪問速度，增加了系統安全性，系統后期的擴展性更加良好，便于進行二次開發，可以滿足使用人員的不同需求。該系統的設計與實現方法具有普遍意義，對其他高校的網站設計與開發具有一定的借鑒作用。但是該CMS只是實現了主要功能，有些功能還有待改進，其應用范圍也有待于進一步擴大，我們還需要做大量的后期實踐、完善、維護工作。

[1] 朱欣.基于模板技術的 CMS在高校信息化建設中的應用[J]. 軟件導刊,2015,5:21-23.

[2] 廖旺勝,范冰冰.基于 CMS的屬性自定義方案的設計與應用[J].計算機與現代化,2013(8):140-143.

[3] 張衛云.基于 Web的內容管理系統的研究與開發[D].華北電力大學碩士研究生論文，2004,1-3.

[4] 飛思科技產品研發中心編著.JSP 應用開發詳解(第二版)[M].北京:電子工業出版社，2004:120-122.

[5] 黃偉.基于MVC架構的Web應用系統設計[J].微型計算機與應用,2004,13-15.

[6] 韋加強,潘蔭榮.基于J2EE平臺和MVC模型的電子政務系統的設計[J].微型電腦應用,2006,6:34-35.

[7] 徐雯,高建華.基于Spring MVC及MyBatis的Web應用框架研究[J].微型電腦應用,2012,7:1-4.

[8] Chu HC Chen MY Chen YM.A semantic－based approachto content abstraction and annotation for content management[J].Expert Systems with Applications,2009,36:2.

圖1 基于NoSQL的空管異構數據集成模式

在圖1中共分為4層，從下到上依次為數據源層、數據庫層、服務層和應用展示層。

數據源層為現有機場各個信息系統數據庫，這里存放著大量的通信數據、雷達數據、氣象數據、導航數據、旅客出行數據等海量異構的數據。這是進行異構數據集成的基礎。

通過對各個異構數據源數據的抽取，把各個數據源的數據進行標準化，對數據進行清洗，丟棄哪些臟數據，并對異構數據進行提取，加工，轉換成某種特定的格式，并存儲到NoSQL數據庫中（如：Hbase、MonogoDB、Redis）。由于NoSQL具有較強很強的橫向擴展的能力，并能夠在分布式架構條件下達到很好的性能，所以隨著接入數據的增多，只需要在集群中加入新的節點即可完成集群的擴容。

服務層是在數據庫層的基礎上，為了滿足用戶的需求對數據庫中的數據進行查詢、組合、統計甚至是分析等操作，組裝成特定的數據結構返回給應用展示界面，對用戶的特征分析、屬性提取、用戶分類等數據挖掘操作基本都是在這一層進行完成，在實現各類算法和業務邏輯的基礎上對外提供REST接口，方便各個系統的調用。

應用展示層也就是與用戶進行交互的界面，界面接收用戶的請求，根據不同的系統和請求，調用不同的服務層接口，接收服務層返回的數據，進行圖形化界面展示，增強用戶的體驗。

當有新的數據源和業務需求增加時，只需要在數據源層接入新的數據源，把數據存放在NoSQL數據庫中，在服務層增加其相應的服務接口，然后應用界面只需要增加相應的界面展示即可，無需修改原有的數據庫結構甚至是服務層的業務邏輯，能夠實現系統橫向擴展。

3 總結

基于NoSQL的空管異構數據集成方案具有高可擴展性、高可用性等特點，有助于在海量空管數據環境下，對數據的處理和分析。NoSQL在空管異構數據中的應用可以是以往的機場服務走向利用海量的空管數據進行數據挖掘、知識發現、預測服務等方向發展。

參考文獻

[1] Rifkin J.The third industrial revolution: how lateral poewr Is transforming energy, The Economy, and the world[M].New York: Palgrave Macmillan, 2012.

[2] Nature.Big Data[EB/OL].[2014-08-26].http://www.nature .com/news/specials/bigdata/ index.html.

[3] Big data: the next frontier for innovation,competition,and productivity[R/OL].[2014-08-26].http://mckinsey.com/ Isight/MGI/Research/Technology_and_Innovation/Big_da ta_the_next_frontier_for_innovation.

[4] The White House. Big data across the federal govenment[R/OL].[2014-08-26].http://www.whitehouse.gov/site s/default/files/microsites/ostp/big_data_fact_innovation.

[5] Barwick H. The "Four Vs" of big data. implementing information Infrastructure Symposium [EB/OL].[2014-08-26].http://www.computerworld.com.au/article/396198/iiis _four_va_big_data/.

[6] 朱小棟，樊重俊，楊堅爭.面向機場場區管理的數據挖掘系統[J].計算機工程,2012, 38(3):224-227.

（收稿日期：2016.03.14）

Research on Application of MVC Model in CMS System of Universities

Guo Xin, Xu Fang
(College of Information Science and Technology, Sanda University, Shanghai 201209, China)

In colleges and universities, the website is one of the important ways to promote the cultural background and educational level of the school. Through the schools’ website， students can get the latest trends and development of the school better and faster. Traditional website construction has some limitations. For example, pure interpretation uses ouly languages, the server side script is mixed with the front end script which are unfavorable to the system maintenance, the security is not strong, and so on. So the development of the website performance is not high， the website can’t be extended. According to these characteristics， this paper mainly studies how to establish the website of the school with the help of the new technology, so as to help the school to promote the foreign propaganda. Based on the research of MVC model and CMS, a university website CMS system is constructed, The design and implementation method of the system are of general significance, and it can be used for reference on a other university's website design and development.

MVC Model; CMS; Website System

G 642

1007-757X(2016)09-0055-05

2016.05.07）

郭欣（1982-），女，上海杉達學院，信息科學與技術學院，講師，碩士，研究方向：計算機應用、web應用開發、云計算，上海 201209徐芳（1991-），女，上海杉達學院，信息化辦公室，助理工程師，本科，研究方向：計算機應用、web應用開發，上海 201209