基于MVC的慕课教学平台的设计与实现

韩丽媛

【摘要】随着网络技术的不断发展，国家的教学模式也呈现多样的方式。基于网络技术的在线学习方式，受到了越来越多的人的青睐，“慕课”在此基础上，以大规模，开放课程，网络课程等特点及优势，迅速发展起来。本平台设计过程中，平台主要分为两个部分：前台与后台。前台采用目前最流行的前端开发的开源工具包Bootstrap，结合前端CSS布局样式，设计完成了用户登录与注册，浏览课程，学习课程，在线考试，自测，学习笔记，在线问答，文章浏览以及经验值等；后台通过采用jQueryEasyUI框架技术，使用流媒体技术，视频的转码技术来克服在视频上出现卡顿和无法加载的现象，保障了视频的流畅。

【关键词】慕课教学平台 B/S架构 MVC Microsoft Visual Studio 2012 SQL Server 2008

【中图分类号】G642 【文献标识码】A 【文章编号】2095-3089（2015）08-0049-02

【ABSTRACT】With the development of network technology， the teaching modes have taken a variety of ways. More and more people like the online learning method which is based on network technology. On the basis of that， Mooc is developing rapidly as the characteristics and advantages of large-scale， open courses and the network curriculum.

The platform is divided into two parts during design， which are the foreground and background. The foreground uses the most popular open-source toolkit—Bootstrap. Combined with the fore-end of the CSS layout style， It completes the design of logging on and submitting， browsing courses， leaning courses， online examination， self-test， study notes， online ask and answer，browsing articles and experience.The background uses the jQueryEasyUI framework technology . It overcomes the phenomenon of videos struck and cant load the videos by streaming media technology and video transcode technology ，So that it guarantee the videos played smoothly.

【Keywords】Mooc； B / S architecture； MVC； Microsoft Visual Studio 2012； SQL Server 2008

所謂“慕课”，是将传统的教学录制成教学视频，然后将视频分割成10分钟甚至更小的“微课程”，其中由许多小的问题穿插其中连贯而成，使得学习者注意力集中，遇到的任何的疑问，可以直接提出来，与教师进行互动，达到学习的最佳效果。

慕课教学平台的设计与实现，在参考了国内外慕课系统的发展现状与趋势的基础上，通过对大学生的具体实际需求，同时考虑到不同大学的教学需求，以及系统的延展性和数据的兼容性，给出了一套较为完整的设计方案。系统的设计与实现，不仅满足了不同人群的学习需求，同时提高了受教育者的学习效率。

本平台开发过程中采用Visual Studio 2012开发平台，数据库采用SQL SERVER 2008管理平台，使用.NET中经典的MVC框架模式，实现整个慕课教学平台的搭建。

一、关键技术介绍

1.MVC技术

MVC是Model（模型）、View（视图），Controller（控制器）的简称，是一种典型的，实用的软件设计框架的典范，用于组织代码用一种业务逻辑和数据显示分离的方法。这种技术使得界面与后台分离，使得开发者和前台美工人员，可以很好的分工协作。

MVC分层有助于管理复杂的应用程序，因为您可以在一个时间内专门关注一个方面。MVC 分层同时也简化了分组开发。不同的开发人员可同时开发视图、控制器逻辑和业务逻辑。

2.Bootstrap

Bootstrap是一款简洁，直观，强悍的前端框架，让web开发更迅速简单。其中，内置的全局CSS样式库，组件库，JavaScript插件库等样式丰富，使得前台开发更加灵活。还有响应式的布局设计，可以适应各种移动终端的需求，完善和改进原有的样式库，使得前台界面的设计大方，美观。

3.流媒体技术

流媒体技术主要是处理视频在播放中的卡死现象，它主要有三部分：数据服务中心，Web端子系统，移动端子系统。

数据服务中心：担当数据请求（浏览器或移动设备）和服务器响应（数据库服务器）的中间层。“数据服务中心”能够对数据库服务器进行增删改查等操作；能够通过负载均衡服务器向流媒体服务器集群上传流媒体文件；还能够通过负载均衡服务器得到响应的媒体流播放地址以便回传到客户端。

Web端子系统：Web端子系统为一个独立的网站。Web端子系统通过“数据服务中心”进行数据的请求和操作。

移动端子系统：移动端子系统为一个移动客户端程序，仅包括“学生端学习平台”。移动端子系统通过“数据服务中心”进行数据的请求和操作。

二、业务流程分析

本平台的用户分为三个角色：学生，教师，管理员。下面就进行业务流程的分析。

1.学生用户的业务流程

流程说明：

（1）学生进入慕课教学平台，注册用户或者直接选择学号登录，进而登录进入系统。

（2）学生根据需要，选择所需学习的课程，如果是自己要学习的内容，则选择課程，开始学习；如果不是自己要学习的内容，则继续选择课程。

（3）在学习的过程中，学生可以根据所学习的内容，进行相关内容的练习，以及进行在线的答疑，笔记，自测等

（4）如果有需要，可以再次学习，或者选择其他课程。

2.教师用户流程

流程说明：

（1）教师进入慕课教学平台，首先要登录到网站的后台。

（2）教师根据课程安排，进行相应的课程发布，进而让学生可以前台学习此课程。

（3）根据所传课程视频的内容，进行试题的生成，以供学生在学习的过程中，学生可以根据所学习的内容，进行相关内容的自测练习。

三、系统设计与实现

系统的设计与实现，是系统开发过程中最重要的一个环节，系统的设计应该按照需求分析阶段的分析来进行设计。

1.前台功能模块设计

（1）导航设计：通过导航菜单，选择不同的链接选择，进入相应的界面，同时进行用户的登陆注册。

（2）首页：显示的内容，用户可以进行定制。有三种类型：按默认情况，按课程，按文章等内容进行显示。展示课程的详细信息（包括课程更新时间，在学人数，更新节数以及课程时长）。

（3）设置：用户可以修改个人信息，头像，修改绑定邮箱，修改密码等功能。

（4）个人中心：主要包括8个模块：

我的课程：支持学习历史记录功能，可按时间的顺序展示学生所学过的所有课时及相关的学习信息

我的试题：显示自己做过的错题和收藏的题。可以进行重复练习，加深对知识的掌握。并随时清除错题，支持自动判断和试题解析功能。

我的自测：自动记录学生在学习过程中自测的试题，学生如果当时没有完成自测，则可继续测试；如果完成测试，可以查看试卷详细的分析，让学生在学习中，不仅可以学习，还可以进行考试，分析，提高学生的学习效率。

我的笔记：在线记录笔记及其参加该课程学习人数之间的交流，好的笔记可以进行收藏，了解不同学生对学习此课程的独特的见解。

课程代码：在学习过程中，老师可以进行作业的布置，如果是计算机类相关课程，需要进行编写代码，则所有和代码有关的作业、习题都展现在这里，方便学生查看，对代码进行及时的修改。

课程问答：支持对视频的承载来完成在线作答、定知识点作答，在此同时还支持涉及到所在知识点的资料，进行在线的学习，下载。

所得经验值：每学一门课程都会获得相应的经验值，作为一个衡量学生学习情况的标准，并且设有排名，来激发学生的学习斗智。

私信：可以再慕课教学平台进行在线的交流。学生可以和课程教师进行在线的答疑，解惑，一次解决传统教学当中时间问题，做到有问题，零负担。

（5）课程页面，学习页面，试卷页面是用户分别要进行学习和考试。

在学习视频观看的过程中，在视频中设置了触发点，如果视频播放到触发点，视频自动暂停，并在视频右侧弹出相关练习题，使学生在学习的过程中，加深记忆。并在此知识点处可以翻阅在线资料，做知识点笔记及其在线交流。

（6）本系统还支持线下学习，视频下载功能。

2.后台功能模块

（1）系统模块主要包含：系统设置、消息设置、系统日志子模块其中系统设置主要包含一些对网站的LOGO的设置，网站版权设置等，而消息设置模块主要是用来管理员或者教师发布一些消息，例如管理员发布的系统消息或发给某位老师告知新增加了该教师应该管理的课程，或者是对学生学习状况查看后的评价、警告等。

系统模块的设计，主要是用来方便用户进行定制，不同的大学，网站LOGO等都是不一样的，此部分的设计，充分满足了不同的机构对网站使用的不同需求。

（2）用户管理模块主要实现对登录的用户进行管理及其对其不同用户的权限设置。

（3）课程模块包含的课程分类主要用来处理添加前台显示的课程大类。

课程管理：在课程分类的情况下，更加细化课程到具体的课程中，并且在课程设置中添加课程的章节和设置绑定到某些章节下视频、试题资源、学习资料等。

课程的问答管理，主要用来查看前台用户在学习该课程时对该课程的交流，教师则可针对学生们交流的问题，进行回复，解答。

课程评价管理，主要用来记录用户在学习完该课程后对该课程的评价。

课程栏目设置，它主要是用来对课程分栏目，例如把课程分为精品课，公开课等该功能用来实现前台动课程列表的筛选和实现管理课程权限。

（4）题库管理模块实现了现有的考试平台资源的无缝对接，网站可自由访问考试平台的试题、试卷资源，也可以根据需求在题库中筛选出想要的试题去重新生成想要的试卷并且绑定到需要的课程上，方便使用。

（5）个人中心模块（仅教师）主要针对的是教师登录管理系统，该模块包含一些和教师相关的信息，教师管理的课程，教师收到的消息，教师管理的学生，教师布置的作业，教师与学生之间的交互同时该模块也包含了审核课程的功能，前台用户在进入课程的时候，第一步是申请该课程的，成功后方可学习该课程，用户通过申请特定教师的课程，这样教师就可以实现判断是否通过审核来完成对学生选课的管理。最后教师还可以通过学生评测模块来查看学生学习状况分布图。从而在需要的时候可以对学生发出警告。

四、总结与展望

目前，网络教学平台的应用非常的广泛，但是还没有真正的应用到传统教学当中，如果网络教学平台能够与传统的教学相结合，势必将促国家教育事业的发展。随着“慕课”的到来，基于慕课的教学平台一定会为促进受教育者的学习效率做出贡献，而且也会有很好的发展前景。在设计的整个过程中，前台主要采用目前最新的Bootstrap框架，搭建响应式的布局，为日后应运在不同平台打下基础；后台采用MVC框架，是前后台分离，方便搭建。

慕课近几年的发展形势非常的好，慕课教育平台在未来的教学当中，必将占据重要的地位，这是传统教学模式与当代信息技术融合的表现，他的发展势必将在教育界掀起巨浪，在线的教学方式，将成为人们学习的主要工具，从而促进我国教育事业的发展。

参考文献：

[1] 廖信彦.ASP.NET交互式Web数据库程序设计[M].中国铁道出版社，2006.

[2]方柯.基于ASP.NET MVC框架的Web应用开发研宄[J].电脑知识与技术，2010 （6） ：6213_6215.

[3]徐楓.基于ASP.NET的MVC模式的分析与应用[J].电子科学，2011（10）：31-33.

[4]郑齐心.ASP.NET项目开发案例全程实录[D].北京：清华大学出版 社，2011.

[5]袁宏伟.基于ASP.NET的现代远程教育网站设计[D].北京：中国地质大学（北京），2009.

[6]杨旭士.基于JQuery框架的Web查询视图设计与实现[J].计算机与现代化，2010（8）： 128-129.

[7]李彦，高博.ASP.NET 4.0MVC敏捷开发给力起飞[M].北京：电子工业出版社，2011.

[8]吕鸣.网上考试系统的设计与实现[D].上海：复旦大学，2009.

[9]朱涛，周昕.基于ASP.NET MVC模式的精品课程网站系统的设计与实现[J] 科技信息，2011（31）：106-114.

[10]高静，段会川.JS0N数据传输效率研宄[J].计算机工程与设计，2011，32（7）：2267-2270

[11]Bootstrap中文网：http：//www.bootcss.com/