需要引的插件:video.min.js video-js.min.css
这个插件支持三种视频格式:mp4、webm、ogg
===============================================================================================================================
最简单的小例子,代码如下:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>网页版视频播放器</title>
<link href="css/video-js.min.css" rel="stylesheet">
<script src="js/video.min.js"></script>
</head>
<body>
<video id="example_video_1" class="video-js vjs-default-skin" controls preload="none" width="640" height="264"
data-setup="{}">
<source src="http://vjs.zencdn.net/v/oceans.mp4" type='video/mp4' />
</body>
</html>
===============================================================================================================================
如果取到的路径是全路径(类似D:\apache-tomcat-7.0.56\webapps\portal_iot\upload/upload_20160924161508.mp4这样)的话,可以使用下面方法截取路径:
<video id="example_video_1" class="video-js vjs-default-skin" controls preload="none" width="870" height="350" data-setup="{}">
<source src="${ctx}/${fn:replace(notice.attachmentAddr,pageContext.request.getRealPath("/"),"")}" type='video/mp4' />
<source src="${ctx}/${fn:replace(notice.attachmentAddr,pageContext.request.getRealPath("/"),"")}" type='video/webm' />
<source src="${ctx}/${fn:replace(notice.attachmentAddr,pageContext.request.getRealPath("/"),"")}" type='video/ogg' />
</video>
===============================================================================================================================
顺便提一句,好像HTML自带的播放器支持很多格式的视频。。。不知道有人用过没