| [摘要]:本文针对目前网上答疑系统所存在的问题,比较和分析了网上答疑与传统网络交流手段的关系,提出了一种远程教学答疑系统的新模式,并结合SVG和SMIL技术,开发了一个实用的、集成的、基于B/S体系结构的“多媒体网上答疑系统”,极大地拓宽了学生在网上答疑系统上的表达方式,简化了操作步骤。
[关键词]:远程教育;答疑;BBS;SVG;SMIL;JSP
本文针对目前网上答疑系统所存在的问题,比较和分析了网上教学答疑与传统的网络交流手段,根据实际情况,提出了一种远程教学答疑系统的新模式,并结合SVG和SMIL技术,开发了一个实用的、集成的、基于B/S体系结构的"多媒体网上答疑系统"。
1 现有网上答疑系统的不足
1.1 形式单一
1.2 操作繁琐
1.3 灵活性差
2 目前网络交流的主要技术
2.1 BBS
2.2 E-mail
2.3 ChatRoom
2.4 其它网络交流技术
以上分析了目前网上答疑系统的不足,比较了网上交流的主要技术,不难看出:那些网上答疑系统的开发者们,无论他们在BBS上提供贴图功能,还是千方百计地将E-mail、ChatRoom、白板、可视电话、专用上线软件引入到网上答疑系统,都只是为了一个自觉或不自觉的目的,那就是提高网上答疑系统的多样性和易用性。但从使用情况看来,往往满足了多样性又损失了易用性,而满足了易用性又损失了多样性。以致不少"高科技"的答疑系统成了装点门面的摆设。
由此,我们抓住了网上答疑系统的主要矛盾,即多样性和易用性。只有在这两性上不断探索、不断总结,而不停留在界面上的反复雕琢,才能突破现有的网上答疑系统,使之发生质的变化。
3 网上答疑系统的新模式-多媒体网上答疑系统
为了改善多样性和易用性,本文设计了一种集成度很高的"多媒体网上答疑系统"。该系统以传统的BBS为基础,归并了E-mail服务,实现并扩展了白板的绘图功能,保留了ChatRoom的实时讯息,模仿了可视电话中如见其人的效果,将多媒体元素全面地引入到网上答疑系统。此外,采用B/S架构,不需要用户在客户端安装任何通讯软件。其主要功能如下:
1用户能在BBS上方便地编辑、刊载、浏览、回复包含静态文字、流文字、图形、图像、超链接、动画、音频、视频的多媒体贴子,并能对其中的媒体元素进行精确的定位和缩放,甚至旋转,实现"所见即所得"的编辑贴子;2用户能在旧贴上直接勾画回复;3用户能通过E-mail发送多媒体邮件;4用户能在BBS中发送讯息给在线用户。
4 多媒体网上答疑系统的设计
4.1 开发技术的选择SVG规范。
SMIL规范。
ECMAScript与DOM。
JSP/Servlet技术体系。
B/S体系结构。
4.2 贴子的分类
不同媒体元素的数据量通常存在很大差异,因此,考虑到用户的实际需要和网络带宽,本文把"多媒体网上答疑系统"使用的贴子分为3种类型:文本贴子;图形贴子;音像贴子。
4.3 贴子内容的组织
在"多媒体网上答疑系统"中,贴子的内部关系非常复杂,必须设计一个良好的结构来进行有效地组织。下面分别说明三种贴子的组织方式:
文本贴子,沿用传统BBS的方法,使用字符串来记录贴子的内容;图形贴子,使用SVG加以描述,采用<g>元素分割开每一次回复的内容(本文将发表新贴也视作一次回复,即对空贴的回复)。其中,又将父贴的内容全部集中在同一个<g>元素之下,称之为父贴<g>元素,并设置它的opacity(透明度)属性值为0.2,从而在视觉上淡化父贴的内容,使用户能够分清父贴和子贴的区别。每当下一次回复开始时,子贴<g>元素被提入到父贴<g>元素中,然后在原子贴<g>元素的位置上建立一个新的子贴<g>元素,用于包含接下来将要绘制的新内容。一个图形贴子的SVG文档结构如图1所示。一个图形贴子的SVG文档结构如图1所示。

图1 一个图形贴子的SVG文档结构示意图音像贴子,使用SMIL加以描述。本文中的每个音像贴子与一个图形帖子成对使用,两者层叠显示在网页上的同一个区域,利用按钮来回切换。其中,图形帖子承担"布局"的工作,用户在其上绘制矩形和选择URL,用于指定媒体文件的播放区域和链接地址;而音像贴子则承担"内容"的播放工作,根据图形帖子的SVG文档生成一个SMIL文件,在用户指定的区域播放用户指定的媒体文件。一个音像贴子的SMIL文档结构如图2所示。

图2 一个音像贴子的SMIL文档结构示意图当然,如果用户在回复父贴时不希望引用父贴的内容,则可以点击相应的按钮,从而删除SVG文档中父贴<g>元素下的所有子元素。
4.4 贴子的显示
目前的主流浏览器还不能直接支持SVG和SMIL,需要在浏览器中安装插件。现在有很多性能优良的SVG插件和SMIL插件可以从网络上免费下载,例如Adobe公司的Adobe
SVG Viewer和RealNetworks公司的Real Player。当然,浏览器也会提示用户安装插件。但从SVG和SMIL的飞速发展来看,相信在不久的将来主流浏览器就会支持SVG和SMIL了。
另外,还需在HTML文件中包含SVG文档和SMIL文档。本文采用的方法是在HTML中加入<embed>标签,这样SVG和SMIL文件就可以随HTML文件一起显示在网页上了。
4.5 绘图程序模块的动态加载
考虑到用户在绘图过程中未必会用到每一个功能,无须一次下载全部绘图程序,避免不必要的资源浪费。因此,本文采用动态加载技术,确切地说是"网络程序模块首次使用加载"技术,只有当用户第一次使用某个绘图功能时,才从服务器端下载相应的绘图程序模块,下载后保存到客户端的存贮器中,以备再次使用。
相应地,网页也要使用多框架结构,巧用隐藏框架,便于在后台运行脚本程序,也便于从服务器端动态地加载程序模块。下面具体说明脚本程序模块的动态加载过程。
首先,从服务器端发送一个包含主控脚本程序的网页到浏览器中的某个隐藏框架,这个主控脚本程序使用网页脚本语言编写,起到核心控制的作用。然后,当用户在工具栏中选择一个绘图工具时,主控脚本程序判断相应的绘图程序模块是否已经保存到客户端的存贮器中:如果已经保存,就取出执行;反之,则向服务器请求发送该绘图程序模块到某个隐藏框架,该绘图程序模块加载之后被保存到存贮器并加以执行。
其中,绘图程序模块是包含在HTML文件中的脚本程序,随HTML文件发送到浏览器。不同的绘图程序模块包含于不同的HTML文件,实现不同的功能,例如,用于绘制矩形的绘图程序模块就作为一段脚本程序包含在rect.htm内。它接收用户在SVG图像上绘图的鼠标事件,通过DOM接口修改SVG文档,从而在SVG图像上反映出绘图结果。
4.6 服务器端的保存
当用户选择提交贴子时,将贴子的内容输出为一个字符串,上传到服务器。
如果是文本贴子,就直接保存到数据库;如果是图形贴子,则先进行GZIP压缩,压缩率一般为70%-80%,然后保存为一个.svgz文件,至于贴子的相关信息,例如发贴人姓名和IP,则登记到数据库;如果是音像贴子,就保存为一个.smil文件,并在数据库中登记贴子的相关信息。
4.7 E-mail服务
借用发表多媒体贴子的功能,一方面使学生能够在站内编辑和发送包含多媒体贴子的邮件,以此提出各种问题,另一方面教师可以在多媒体贴子上直接批复,并发表到BBS上公开展示。
4.8 发送实时讯息
在BBS网页的顶端开辟一个狭长的小框架,利用网页定时刷新功能,向服务器发送和查询在线用户的实时讯息,使学生能够与其它在线师生即时交流。
5 多媒体网上答疑系统的实现
从略。

图3 系统结构示意图经过在因特网上的测试,证明该系统性能优良、效果理想,访问速度与普通网站的访问速度没有差别。
该系统的突出优点是:
1)多样性。学生能够通过发表多媒体贴子,提出包含静态文字、流文字、图形、图像、超链接、动画、音频、视频的问题,也能将这样的问题通过E-mail发给教师。教师能够以同样的方式,在多媒体贴子上直接勾画回复。从而极大地拓宽了师生在网上答疑系统中的表达方式。
2)易用性。绘图时不再需要打开浏览器以外的绘图软件,也不再需要将图片自行上传到网络空间;
3)可以对贴子中的图形图像进行精确地定位、缩放和旋转,使图形图像不致漂移;
4)可以在父贴上直接勾画回复,父贴和子贴层叠显示;
5)基于流行的B/S体系结构,不需要安装任何客户端通信软件,有IE浏览器即可;
6)采用网络程序模块动态加载技术,功能可以灵活组合、无限扩展,传输效率不会受到影响;
6 结语
从略。
参考文献
从略。
|