首页 > 范文大全 > 正文

基于JSP的流媒体播放的设计与实现

开篇:润墨网以专业的文秘视角,为您筛选了一篇基于JSP的流媒体播放的设计与实现范文,如需获取更多写作素材,在线客服老师一对一协助。欢迎您的阅读与分享!

摘要:随着Internet的发展,网页视频播放的使用越来越多。但是,目前如果直接通过HTML5的或者Html的标签播放视频的话,视频的拖拽功能只有在视频完全下载完成后才能使用。本文通过研究分析Windows Media Services流媒体服务器的播放原理,以及研究Chrome浏览器中Http包的内容,成功通过JSP设计出了具有流媒体服务器播放效果的程序。通过将程序在Tomcat后,网页视频在播放的过程中,用户可以在播放视频的过程中随意拖拽,成功解决了HTML5的或者Html的标签播放视频不能拖拽的问题。

关键词: 流媒体; JSP; Html5; Chrome浏览器; 视频控制

中图分类号:TP37 文献标识码:A 文章编号:1009-3044(2016)18-0191-03

Design and Implementation of Playing Streaming Media Based On JSP

YANG Zi-xiang,LIN Peng

(Tianjin Open University, Tianjin 300191, China)

Abstract: With the development of Internet, playing web video is more and more on web. However, if playing the video through the HTML5 or the Html tag, then dragging and dropping the video only after the completion of the video completely downloaded before using. Through research and analysis principles of streaming media server of Windows Media Services, and research Http package of Chrome browser, the paper successfully devised playing streaming media with JSP program. By publishing program on Tomcat, users can drag and drop the video during playback, successfully resolving the problem of the HTML5 or the Html tag with not drag.

Key words:Streaming Media; JSP; Html5; Chrome browser; Video Control

1 概述

随着Internet的发展,网页视频播放的使用越来越多。因此,视频播放的用户体验也越来越实用;视频的播放、暂停、定点播放等操作的需求也就越来越大,而且也更符合用户实际浏览视频的要求。但是,目前如果直接通过HTML5的或者Html的标签播放视频的话,视频的拖拽功能只有在视频完全下载完成后才能使用。这就会加大服务器的压力,因此越来越多的用户开始使用流媒体。

所谓流媒体是指采用流式传输的方式在Internet播放的媒体格式。流媒体又叫流式媒体,它是指商家用一个视频传送服务器把节目当成数据包发出,传送到网络上。用户通过解压设备对这些数据进行解压后,节目就会像发送前那样显示出来。流媒体的出现极大地方便了人们的工作和生活。目前,使用流媒体的话都会通过流媒体服务器(比如Windows Media Services等)来搭建流媒体平台[1-4]。

JSP作为一种网页开发语言,在网站的开发中使用者的比例很大;因此,使用JSP开发的网站对视频播放的需求也会越来越多。但是,如果直接通过JSP后台平台结合HTML5的标签进行视频播放的话,就会出现网页中视频无法拖拽,从而不能实现定点播放等功能。所以,通过JSP语言实现视频的流媒体播放对于JSP网站来说,不仅可以省去借助流媒体服务器的烦恼,而且可以实现在线视频播放的随意控制,从而满足用户的实际需求。

2 基于流媒体服务器的网页播放探究

流媒体服务器的使用,解决了视频播放过程中,直接访问网络视频资源导致的视频拖拽问题。因此,流媒体服务器的网页视频资源的访问方式对于本文的设计来说,具有很大的价值。Windows Media Services作为一种流媒体服务器,是Windows Server服务器系统中使用频率很高而且性能很好的流媒体服务器。本文通过Chrome浏览器访问Windows Media Services中视频资源的流程研究发现,在视频拖拽的控制中,Chrome浏览器都会发送Http请求包;Windows Media Services接收到浏览器的请求后,再根据Http中包含的内容返回相应的视频片段。具体的流程如图1所示。

如图1中流媒体视频在Chrome浏览器和Windows Media Services流媒体服务器之间的交互可以看出,无论视频的播放还是中间视频播放控制,都是Chrome发送Http包进行控制;而Windows Media Services流媒体服务器则是负责对视频片段的返回。因此,本文使用Chrome浏览器访问对已经在Windows Media Services流媒体服务器中的视频,通过Chrome浏览器中的Network网络工具,对Http包进行抓取。图2中显示的是视频点击开始播放后,即视频从头开始播放,抓取的Http请求包的头文件内容。图3和图4中显示的则是视频播放过程中点击视频任意位置后,抓取的Http请求包的头文件内容。

3 基于jsp的在线流媒体播放的实现

在第二节中,本文通过Chrome的Http包的追踪功能,截取了视频在播放控制过程中不同播放位置请求的包。通过图2、图3和图4的追踪结果可以看到他们的Request Headers以及Response Headers中的部分头文件字段是不同的,具体的信息比较如表1所示。

由表1中可以看到,三个图中的Http包中只有Range、Content-Range字段是不同的,其他的字段的内容根本就没有发生变化。其中,Range是Request Headers中的字段,Content-Range是Response Headers中的字段。在表1中还可以发现,Content-Range字段的内容和Range字段的内容有一定的关系;Content-Range内容中“-”前的数值和Range是一致的。同时,在表1中也可以发现,Content-Range字段和Content-Length字段有一定的关系;Content-Range内容中“/”后的数值和Content-Length是一致的。我们知道,Http包中的Content-Length的作用主要是记录文件的长度,因此可以在服务器端通过程序求出文件的大小。

由于Http包中的Request Headers是由浏览器进行发出并封装的,因此本文的程序无法控制包中的Request Headers内容。但是,Http包中的Response Headers是由服务器封装后返回给浏览器的;因此,本文的程序设计将会根据Http包中的Request Headers字段内容,对Http包中的Response Headers字段进行封装返回给服务器。根据以上的分析,本文通过JSP进行程序设计如下:

@RequestMapping(value = { "/videos/{path}" })

public String displayVideo(HttpServletRequest request,

HttpServletResponse response, @PathVariable String path) {

try {String filePath = videoDir + path + ".mp4";

File file = new File(filePath);

if (!file.exists()) {

response.sendError(404);

LOG.error("未找到文件" + file.getCanonicalPath());}

Long fileLength = file.length();

LOG.debug("文件找到了,大小为" + fileLength);

String range = request.getHeader("range");

if (range != null && !range.equals("")) {

LOG.debug("请求的名字是range,内容是" + range); }

Long startPos = 0l;

if (range != null && !range.equals("")) {

Pattern pattern = Pattern

.compile("^bytes\\=(\\d+)(?:\\-(\\d+)?)?$");

Matcher matcher = pattern.matcher(range);

LOG.debug(matcher.matches());

startPos = Long.parseLong(matcher.group(1), 10);

LOG.debug("成功截获range,开始位置是" + startPos);

response.setStatus(206);

} else {

response.setStatus(200);

LOG.debug("从头开始传送");}

InputStream is = new FileInputStream(file);

OutputStream os = response.getOutputStream();

byte[] buffer = new byte[1024];

response.addHeader("Content-Range", "bytes " + startPos + "-"

+ (fileLength - 1) + "/" + fileLength);

response.addHeader("Content-Length", fileLength.toString());

response.setCharacterEncoding("UTF-8");

response.setContentType("video/mp4");

response.setHeader("Accept-Ranges", "bytes");

is.skip(startPos);

int length = is.read(buffer);

while (length > 0) {

os.write(buffer, 0, length);

length = is.read(buffer); }

os.flush();

os.close();

is.close();

} catch (Exception err) {

if (err.getClass()

.getName()

.equals("org.apache.catalina.connector.ClientAbortException")) {

LOG.debug("客户挂断了");

} else {

err.printStackTrace();}}

return null; }

在本文的程序设计中,浏览器的视频请求URL路径的后端是通过JSP中的Spring框架进行控制,在路径中的/videos/{paths}即是视频路径存储在磁盘的相对位置;在程序中,视频的读取并没有经过中间的流媒体服务器,而是直接读取在磁盘中的视频文件。经过程序在Tomcat7上测试之后,视频在播放的过程中,用户可以根据需求随意拖拽,解决了Html5中标签不能播放的问题。具体的如图5所示,图中显示的是程序后视频随意播放截取的Http包。经比较,与文中的图3、图4中间播放的Http包的内容是相似的,实现了流媒体播放的效果。

4 结论

本文通过分析Windows Media Services流媒体服务器中视频拖拽播放控制过程中,Chrome浏览器发送的Http包的信息,得出了浏览器播放视频时播放控制和Http包中Request Headers、Response Headers头文件的关系。并且,本文通过JSP程序语言的设计,成功实现了流媒体服务器控制视频播放的原理。本文设计的程序到Tomcat后,经过该程序访问的视频都可以在浏览器端随意拖拽播放视频,解决了Html5的标签不能直接播放服务器磁盘中视频的弊端,也省去了流媒体服务器视频的任务。

参考文献:

[1] 蒋太杰. Windows Media Services及其在远程教育中的应用[J]. 指挥技术学院学报, 2001, 12(6): 81-85.

[2] 王雪婷, 于勇. Windows Media Services流媒体技术与实现[J]. 信息技术与信息化, 2006(1): 51-53+64.

[3] 李学俊. Windows Media Services及其在远程教育中的应用[J]. 现代远程教育研究, 2002(3): 27-29.

[4] 高剑. 利用Windows Media流媒体技术构建网络直播系统[J]. 中国高新技术企业, 2010(30): 62-64.