基于HTML5及云计算的高职院校移动学习平台设计与实现

宋永生

摘要：在HTML5及云计算的基础上，设计并实现了高职院校移动学习平台。该学习平台利用图像识别、视频直播、离线存储等技术为高职院校学生提供了便利的移动学习平台。学生可以随时随地利用智能手机、平板等设备进行学习并进行测验。该平台简单实用，为高职院校学生的学习提供了便利。

关键词：HTML5；云计算；高职院校；移动；学习平台；

中图分类号：TP393 文献标识码：A 文章编号：1009-3044（2016）29-0059-03

HTML5是新一代的Web语言标准，将会取代1999年制定的HTML4.01、XHTML 1.0标准，以期能在互联网应用迅速发展的时候，使网络标准达到符合当代的网络需求，为桌面和移动平台带来无缝衔接的丰富内容。HTML5原生支持本地存储和音视频播放，可以做到跨平台，可以充分利用GPS、相机等Na-five功能，此外HTML5开发成本相对原生APP低很多，通过HT-ML5就可以把自己的网站移动化。

云计算技术近年来风起云涌，群雄并起。国内互联网巨头BAT（百度、阿里和腾讯）皆推出了其云计算技术，其他中小厂商更是多不胜数。云计算将计算及存储任务放在云服务器中进行，使在较低配置的终端也能实现大规模的计算和存储，摆脱了终端设备的限制。通过对比，本文选择腾讯云作为移动学习平台的后台技术支撑。

随着4G通信技术及智能机的普及，移动互联网飞速发展，移动学习越来越日渐可行，移动学习是一种师生通过移动终端设备进行沟通、学习的方式，是信息化学习的一个新阶段，其移动性、高效性、广泛性、交互性、个性化等特点有效弥补了基于互联网的学习平台的不足，利用手机等移动终端设备进行沟通交流将是未来教育模式发展的必然。

本文在HTML5及云计算的基础上，设计并实现了高职院校移动学习平台，课程以视频为主要呈现方式，学生可以选择感兴趣的课程进行学习，并可以交流讨论及在线测验，及时发现和反馈学习中存在的问题。

1系统总体架构

移动学习平台主要包括：身份验证、在线直播、课程点播、聊天室、网络考试和线下交流六个子模块。

系统的总体架构如图1所示：

2关键技术及实现

2.1身份验证

用户分为学生、教师和系统管理员三个类别，系统给他们分配不同的权限。传统的学习平台是通过用户名、密码进行身份验证，密码设置简单容易被破解，设置复杂又容易忘记，基于生物特征的身份验证不仅简便而且安全性较高。

学习平台通过在HTML5网页中调用本地摄像头获取用户头像，并发送到腾讯云端，腾讯云端将识别给定的人脸图片，从数据库中检索用户的身份信息并返回，在主流PC端和移动端均能达到实时检测的效果。随着智能机上指纹传感器的普及，将来也可以通过指纹验证登陆者的身份。

2.2视频直播及点播

随着移动互联网的发展，视频直播和视频点播因直观生动，逐渐成为了目前在线学习平台的主要呈现方式，然而视频直播和视频点播平台搭建技术门槛较高，为了解决这个问题可以借助于云计算技术。腾讯云可轻松接入专业视频录制设备、手机、PC等任意标准HLS/RTMP多个直播源，并支持排序，便于适配多种教学场景。

如果通过手机采集音视频，可以安装腾讯云推流APP；如果通过PC采集音视频，安装OBS（Open Broadcaster Software），OBS是用于音视频编码并推送直播视频源到服务器的免费开源直播软件。

利用腾讯云直播时，可录制并无缝对接点播平台，提供一站式视频服务。直播过程中，录制系统会按每30分钟一个分片的粒度将直播视频进行存储。这期间生成的视频文件，都会进入腾讯云点播系统，视频数据流程如图2所示。

HTML5网页中，播放视频不需要安装专门的浏览器插件，HTML5本身提供专门用于播放视频的video元素。为了解决不同浏览器的兼容性问题，学习平台通过在直播网页及点播网页中嵌入腾讯云网页播放器，实现PC浏览器和手机浏览器的自适应切换。例如：在视频点播中，PC平台优先使用Flash播放器以适应多种视频格式的情况，而手机浏览器上会使用HT-ML5技术实现视频播放。

2.3在线聊天室

交流讨论是学习平台的一项必备功能，在线聊天室要方便学生之间，学生与教师之间的交流与讨论，支持一对一和群聊功能。传统的网页实现聊天室的方法是通过每隔一段时间请求服务器获取相关聊天信息来实现。WebSocket是HTML5引人的一种新的协议，用于实现前台浏览器与后台服务器全双工通信，只需一个握手的动作，前台和后台之间就形成了一条快速通道。客户端使用WebSocket协议获取实时内容，使用HTTP协议获取非实时内容，服务器端采用两个模块分别处理WebSocket请求和HTtP请求。

2.4网络考试系统

网络考试系统可以检测学生对课程内容的掌握情况，帮助教师和学生发现教和学中存在的问题。网络考试系统可以根据题库自动组卷，支持学生在线考试，学生提交试卷后，可以自动评分，并对学生的成绩进行统计，帮助教师发现教学中存在的问题和不足，同时可以帮助学生形成错题集。在线考试过程中，很可能发生网络不稳定，断网的事情，要保证学生答题不丢失。通过利用HTML5的应用缓存控制机制以及数据存储技术，可以实现网络考试系统的离线Web应用。学生在考试过程中，如网络断开，学生可以继续答题，再次联网以后，学生的答卷将自动同步到服务器。

2.5线下交流

在HTML5网页中，可以通过API获取当前用户的地理位置信息，并可以将该地理位置共享出来，便于学习平台上的教师之间、学生之间、教师与学生之间开展线下交流。学习平台通过调用GPS等位置传感器获取教师及学生的位置信息，以实现学习平台的线上线下资源的融合，形成O2O闭环。纯HTML5Geolocation定位能力相对较弱，腾讯在此基础上进行了改进，可以调用腾讯地图的位置服务API进行实现线下交流模块。

3平台实验

学习平台程序采用Java語言开发，开发环境为Eclipse 3.7，JDK 1.7，移动web开发框架选选择uery Mobilel.4.0，数据库采用Mysql 5.1，服务器选用腾讯云服务器。实验选用的视频直播推流手机为荣耀畅玩5x，Android版本为5.1.1。视频直播收看手机选择红米3S，Android版本为6.0.1，浏览器为UCV11.0.8.858。

教师登录移动学习平台后，可以利用手机客户端直播课程，也可以上传剪辑好的课程录像以供视频点播，同时可以在线答疑，发布课程信息及在线组卷。

学生登录移动学习平台后，可以观看学习平台上的直播课程（如图3所示）及点播课程（如图4所示），在学习过程中，可以利用网络聊天室与老师、同学进行交流讨论，还可以进行在线测验（如图5所示），检验学习效果。通过线下交流模块共享位置信息（如图6所示），学生也可请求附近的教师进行线下辅导。

4结束语

本文将HTML5技术及云计算技术运用到高职院校移动学习平台的构建中，对平台中用到的关键技术进行了详细的剖析。通过构建简单易用的移动学习平台，为高职院校学生的学习提供了便利，打破了高职院校在教学时间和空间上的局限性。移动学习平台的使用，使学生无论在任何时间、任何地点都可以利用手中的设备随时随地地学习、交流、测试，职业教育也将由此迎来一个崭新的开始。