通用视频网站管理系统的研究与开发
2018-07-28朱如意李连民
朱如意 李连民
摘要:随着人们的生活节奏的日益加快,互联网时代的快速发展,人们会更希望利用很短的时间就可以通过小短片学处理生活中技巧等等。通过网站来存储、播放用户的视频(一般网站通有的功能)。该文就是基于HTML5的video的视频播放网站的一些关键问题进行了阐述和说明。
this.addClass('my-example');
});
3.3 获取或设置HTML5视频播放器中视频的相关参数
当下web应用程序变得很普通加载一次完成的页面就要能够管理整个视频播放器的整个生存周期,同时可以改变播放器的音量(volume()获取)、让播放器全屏显示(isFullscreen())、退出出全屏会话(exitFullscreen())、当前的播放的位置(currentTime())、正在播放视频的总时间(duration())以及缓冲的时间百分比(bufferedPercent())。
4 基于HTML5Video的视频播放器的功能的实现
4.1 视频播放器的外观
我们可以看到不同的视频网站的播放器的外观都不一样,我们创建的视频播放器没有任何的修饰,只有有一些简单的样式,这样看起来有时会不舒服,我们为了达到更好的用户体验,当我们加入video-js.min.css这个样式的时候视频播放器会默认的样式,当我们使用框架的时候可能会影响视频播放器的效果,我们要抑制这种情况的发生我们需要使用window.VIDEOJS_NO_DYNAMIC_STYLE = true在video.js之前,可以通过设置它们抑制它们。创建视频播放器的样式可以覆盖默认提供的样式,通过设置这样的样式player.addClass('vjs-matrix');
4.2 视频播放器资源文件的编码
由于HTML5的video标签支持的视频格式很少,总共就支持这三种格式Ogg、MPEG4、WebM。 MP4 = MPEG 4文件使用 H264 视频编解码器和AAC音频编解码器WebM = WebM 文件使用 VP8 视频编解码器和 Vorbis 音频编解码器Ogg = Ogg 文件使用 Theora 视频编解码器和 Vorbis音频编解码器。我们需要将上传的视频统统转换為MPEG4格式。
4.3 通过上传视频来动态的获取图片
由于我们上传的视频往往不需要用户自己来截取一张图片来上传,所以我们就需要自己服务器自己获取到上传的视频的图片我们仍然通过FFPMPEG.exe的插件来获取。
5 结束语
现在本地的多媒体已经看起来十分炫酷了,当然也不是足够的成熟,毕竟使用浏览器作为媒体播放器也不过两年时间。与此相对应的桌面媒体播放器程序已经存在了15年,在这么多年的锤炼中不断完善。很多人注意到了,大多数浏览器在播放音频的时候有少许的延迟。许多游戏开发者经常说,FLASH技术残留下来就是为他们提供声音的,正如许多浏览器可以需要两秒钟来加载HTML5音频文件。随着网络的发展,web的内容越来越多的是用音视频的形式来体现了,考虑一下有些用户无法听到音轨,或者其母语并不是英语的情况,抑或用户希望用他们自己的语言来阅读字幕和内容的时候。这时候我们的HTML5就可以很好的解决这样的问题,所以说我们选择使用HTML5的video是一个明确的选择。
参考文献:
[1] 孙鑫, 付永杰. HTML5、CSS和JavaScript开发[M]. 北京: 电子工业出版社,2012.
[2] 陆凌牛. HTML5与CSS3权威指南[M]. 北京: 机械工业出版社,2013.
[3] 高少琛. 基于HTML5的内容发布管理系统的研究与实现[J]. 软件产业与工程,2016(2): 43-46.
[4] 黄雄. 基于HTML5的视频传输技术研究[J]. 广东技术师范学院学报, 2014, 35(11): 20-25.