Web前端开发课程群虚拟化实训平台构建研究＊

滕吉鹏，王少青

(嘉兴南洋职业技术学院，浙江 嘉兴 314000)

1 Web开发课程群面临的实训困境

Web 开发课程群包括前端开发和后端开发两类课程。目前涌现了丰富多彩的Web开发技术流派，它们各具特色，共同铸就了互联网产业，深刻改变了人们的生活方式。Web 开发课程群覆盖了Web 开发的主流技术，在实训环节需充分考虑学生选择开发工具的自主性和实践Web 开发项目的灵活性。虚拟化实训平台的出现为走出实训的困境带来了曙光。

2 虚拟化实训平台领域的研究综述

李翔等人从各自的视角论证了Web 开发课程的教学模式和改革路径；余雨团队将云原生技术引入“Web 开发技术”课程；邱丹萍研究了Web 开发的主流框架技术；唐华芳团队研究了虚拟仿真实训平台的评价机制及指标体系；张如凯、余卫华、徐丹、孙育英、马骞、彭浩等在在各自的专业领域探讨了虚拟化仿真实训平台的建设与应用。近年来，市场上涌现了华为FusionAccess 桌面云、深信服aDesk 桌面云等云计算平台，以及3DCAT 实时渲染云平台、逸景虚拟仿真实验平台软件等成熟的商用虚拟化实训平台也如雨后春笋般出现。

3 Web开发课程群介绍

3.1 前端开发

前端开发是创建Web 页面或App 等前端界面呈现给用户的过程，通过HTML、CSS、JavaScript 以及衍生出来的各种技术、框架、解决方案等来实现互联网产品的用户界面交互。前端开发从网页制作演变而来，名称上有很显著的时代特征。在互联网的演化进程中，网页制作是Web 1.0时代的产物，早期网站都是静态内容，以图片和文字为主；用户行为也以浏览网站为主。随着互联网技术的发展和HTML5、CSS3的应用，现代网页更加美观，功能更加强大，交互效果显著。

Web 前端开发核心技术HTML（超文本标记语言）、CSS（层叠样式表）、JavaScript（脚本语言），其中HTML 是网页的结构，CSS 是网页的外观表现，JavaScript实现了页面的行为。此外，Web前端开发技术还包括HTML5、CSS3、Ajax（异步JavaScript 和XML）、SEO（搜索引擎优化）等。

3.2 后端开发

而Web 后端开发负责平台设计、接口设计和功能实现，主流技术包括PHP（一种通用开源脚本语言）、JSP（Sun 公司主导创建的一种动态网页技术标准）、ASP.NET（微软公司推出的新一代脚本语言）等。

3.3 Web开发技术的学习路线

这是一条相对成熟的从前端开发到后端开发的学习路线，现阶段比较流行且适合初学者入门学习的前端开发工具有Dreamweaver、Sublime Text、Visual Studio等。

3.4 Web开发框架

Web 框架可以加快Web 开发速度，节约时间。PHP 程序员可选的框架包括CakePHP、CodeIgniter、Zend等，Python 程序员喜欢使用Django 和webpy，Ruby程序员常用RoR。

随着Web 越来越规范和标准的统一，Web 组件化技术不断革新，移动端开发不断升华，一些常见的开源前端框架如表1所示。

表1 常见开源前端框架

4 虚拟实训平台支撑技术

4.1 VMware Workstation

VMware Workstation 是一款功能强大的桌面级虚拟机软件，用户可在单台物理计算机上同时运行多个不相同的桌面操作系统，提供了开发、测试和部署新的应用程序的最佳解决方案。VMware Workstation可在一台实体机上模拟完整的网络环境，以及可移植性极好的虚拟机（数量和性能视实体机硬件资源而定），在实时快照、拖曳共享文件夹、支持PXE 和虚拟网络等方面的出色表现使它成为IT 开发人员和系统管理员必不可少的工具。

4.2 VMware vSphere

VMware vSphere 是VMware 服务器集群虚拟化平台套件的商业名称，包括有虚拟化、管理和界面层，实现了大规模服务器集群的资源整合和虚拟化管理。它的两个核心组件是ESXi 服务器和vCenter Server。ESXi是直接部署于物理机之上、用于创建和运行虚拟机和虚拟设备的虚拟化平台。vCenter Server 是用于集中管理连接于一个网络中的ESXi 主机群集和池化主机资源的一项服务。

4.3 VNC

VNC（虚拟网络控制台）是一款由AT&T 欧洲研究实验室开发的远程控制工具软件，由客户端应用程序(VNC Viewer)和服务器端应用程序(VNC Server)两部分组成。VNC Viewer 能通过网络将完整的窗口界面传输到另一台计算机的屏幕上。Terminal Server、Teamviewer、PCAnywhere、向日葵等软件均基于VNC 的原理设计实现，并在易用性、连通率和可穿透内网等方面做了优化。VNC 可用于多种平台的操作系统，这对于网络管理员是极为重要的，它使网络管理员可以使用一种工具管理几乎所有系统；再结合VNC 的简单、可靠和向后兼容性，使之进化成为最为广泛使用的远程控制软件。

4.4 向日葵Sunlogin

向日葵是一款阳光的远程控制软件，可在任何可连入互联网的地方轻松访问和控制安装了向日葵客户端的设备，且支持电脑、手机或平板等多种控制方式进行远控，还实现了远程文件传输、远程摄像头监控、远程管理等功能。向日葵积极融入国产信创体系，助力信创生态体系建设，实现了远程控制技术自主可控，为不同行业的国产系统用户提供安全稳定的远程连接；赋能本土企业内部管理，促进高效办公。

4.5 银河麒麟桌面操作系统

银河麒麟桌面操作系统V10 是一款稳定高效、简单易用、安全创新的新一代图形化桌面操作系统产品。现已适配国产主流软硬件产品，同源支持鲲鹏、飞腾、龙芯、海思麒麟、海光、申威、兆芯等国产CPU 和AMD、Intel 平台，通过内核锁、功耗管理及页拷贝、网络、NVME、VFS 等针对性的深入优化，大幅提升系统的性能和稳定性。软件商店精选了包括自研应用和第三方商业软件在内的数千款应用，同时提供Windows、Android 兼容环境；丰富的软硬件生态，使办公高效便捷。支持多CPU 平台的统一软件升级仓库、版本在线更新功能，让产品与时俱进。

银河麒麟的社区版本优麒麟，是一款免费的开源操作系统。优麒麟 20.04 默认搭载最新Linux 5.4版本内核和全新的UKUI 3.0 桌面环境预览版，并同时支持x86和ARM64体系结构。除此之外，还将提供一系列贴心的自研插件和丰富的第三方应用，让用户在优麒麟上享受愉悦生活，轻松办公的操作系统体验。

5 Web前端开发课程群虚拟化实训平台构建

5.1 技术路线

⑴Vmware Workstation 16+VNC viewer

如图1 和表2 所示，三台物理机分别部署微软的Windows10、苹果的MacOS 和国产的麒麟操作系统，每台物理机上同时部署并运行三台虚拟机，在每台虚拟机上部署课程中使用的Web 前端开发工具（事实上，每种操作系统的开发环境部署一次就可以了，将它作为虚拟机模板可以快速生成多台相同的虚拟机）。

图1 Vmware Workstation 16+VNC viewer架构图

虚拟机部署完毕后，可为他们建立快照，然后就可交付给各组学生用于完成课程实训了，实训结束后管理员可借助预先建好的快照将虚拟机快速回退到最初的状态，用于给后来的学习小组完成新的实训任务。

管理员通过VNC viewer 可以在校园网络中随时随地远程访问安装了VNC Server 的物理机，实现对物理服务器和运行其上的虚拟机的安全访问和管理。学生小组也可以在接入校园网的各个角落通过VNC viewer安全地访问已获得授权的虚拟机桌面，从而协同完成实训任务。

此外，管理员还可在物理机上部署向日葵Sunlogin，实现随时随地通过自己的台式机、笔记本、平板电脑、手机等各种用户终端远程访问物理机的桌面，对物理机、虚拟机的全面管控，彻底摆脱时间和空间的约束。

⑵Vmware vSphere 6.5+VNC viewer

如图2 和表2 所示，在三台物理机上分别部署Vmware vSphere6.5 套件的ESXi 虚拟化操作系统，实现CPU、内存等硬件资源的虚拟化，管理员在自己的笔记本或台式机上直接部署vCenter Server（后期完成物理机到虚拟机的迁移），或者借助Vmware workstation 构建的虚拟机部署vCenter Server（后期完成虚拟机到虚拟机的迁移），通过vCenter Server 实现硬件资源的池化和统一管理。在vCenter Server 中批量构建九台虚拟机，分别部署Windows10、Mac OS、Kylin 系统和相应的开发环境，然后将部署了vCenter Server的系统迁移到资源池中。管理员在自己的电脑上安装一个vCenter client，实现对vCenter Server 的远程连接，从而远程管理虚拟化实训平台。

图2 Vmware vSphere 6.5+VNC viewer架构图

表2 架构图缩略符号含义对照

5.2 基础设施资源配置及虚拟机环境部署

三台物理机可以是高性能台式计算机，有条件的情况下使用服务器性能表现会更加友好，高性能台式计算机的参考配置为：Intel Core I7-10400 (8核，16线程)中央处理器；32GB DDR4 2933MHz 内存；512GB 高速固态硬盘；GTX 1050Ti芯片专业图形卡，如丽台T600等；集成千兆以太网卡及无线网卡。

接入一台高性能交换机，参考配置：交换容量336bps/3.36Tbps；包转发率：51/126Mpps；24千兆电口，4 千兆光口；业务口防雷10 kV；具备支持流量控制功能、支持防止DOS、ARP 攻击功能、ICMP 防攻击；支持端口隔离、端口安全等安全特性。

虚拟机的硬件资源分配：2核心4线程CPU；8 GB内存；100GB 硬盘。在每台虚拟机上分别部署Windows 10 中文专业版、MacOS 11、Ubuntu ukylin或银海麒麟等操作系统。

6 结束语

虚拟化实训平台的构建为Web 前端开发课程群提供了灵活、丰富的实训环境，可有效提升项目化、沉浸式的教学效果。学生可以利用课余时间自主设计实训场景和任务，在实践中感受Web 前端开发的乐趣，轻松展示自己的开发成果。

在虚拟化实训平台的使用过程中，也发现了一些需要持续优化、改进的方面。VMware vSphere的部署与维护对于实施者的技术水平和运维水平要求较高，其使用体验也较大程度地依赖于高性能的硬件资源。技术在发展，教与学相互促进，路漫漫其修远兮，吾将上下而求索。