APP下载

MVC模式在高校网站CMS系统中的应用研究

2016-12-23郭欣徐芳

微型电脑应用 2016年9期
关键词:文件夹视图页面

郭欣,徐芳

MVC模式在高校网站CMS系统中的应用研究

郭欣,徐芳

对于高校而言,网站是宣传学校文化背景以及教育水平的重要途径之一。通过学校网站可以让师生更好、更快地了解学校的最新动态和发展情况。传统的网站建设具有一些局限性,例如:语言的纯解释性执行、服务器端脚本与前端脚本混在一起从而不利于后期的系统维护、安全性不强等,从而使得所开发的网站性能不高、安全性不强、网站可扩展性不足。针对这些特点,研究如何在新技术的帮助下建立学校的网站,从而帮助学校更好的对外宣传。在研究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,避免重复输入登录验证。使用来提交表单数据到服务器进行登录验证。

Register.cshtml视图文件、ChangePassword.cshtml视图文 件 、 ChangePasswordSuccess.cshtml视 图 文 件 和LogOn.cshtml视图文件的内容类似。

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

A

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

2016.05.07)

郭 欣(1982-),女,上海杉达学院,信息科学与技术学院,讲师,硕士,研究方向:计算机应用、web应用开发、云计算,上海 201209徐 芳(1991-),女,上海杉达学院,信息化办公室,助理工程师,本科,研究方向:计算机应用、web应用开发,上海 201209

猜你喜欢

文件夹视图页面
磁力文件夹
刷新生活的页面
5.3 视图与投影
视图
调动右键 解决文件夹管理三大难题
Y—20重型运输机多视图
SA2型76毫米车载高炮多视图
TC一键直达常用文件夹
同一Word文档 纵横页面并存
浅析ASP.NET页面导航技术