前端获取视频流并播放

it2025-05-04  8

2017-09-05

前端获取视频流并播放

JavaScript

html5出来后,前端播放视频瞬间变得方便容易多了,一个<video>标签就可以搞定,只要给src属性正确的文件路径即可。

<video src="images/xxx.mov" width="300px" heigth="300px" controls="controls" autoplay></video>

但是当视频在服务器中时,就需要从后台向前台传输视频流才可以播放。

JAVA

@RequestMapping(value ="/getFileSrc" ,method = RequestMethod.GET) @ResponseBody public void getFileSrc(HttpServletRequest request ,HttpServletResponse response,@RequestParam(value="path") String path) throws IOException{ File file = new File(path); FileInputStream input = new FileInputStream(file); int i = input.available(); byte[] bytes = new byte[i]; input.read(bytes); response.setContentType("application/video"); OutputStream output = response.getOutputStream(); output.write(bytes); output.flush(); output.close(); input.close(); }

JS

var path1= "http://localhost:8080/HBDK/rest/resource/getFileSrc?path="+path; <!--弹出框中播放--> back.view.popup.open({ title: "视屏播放", content:'<video src='+path1+' width="300px" heigth="300px" controls="controls" autoplay></video>', location: point // Set the location of the popup to the clicked location });

本文标题:前端获取视频流并播放

文章作者:chen

发布时间:2017-09-05, 14:32:49

最后更新:2017-09-05, 14:45:29

原始链接:http://chen1218chen.github.io/2017/09/05/前端获取视频流并播放/

许可协议: “署名-非商用-相同方式共享 4.0” 转载请保留原文链接及作者。

js中引用jsp的变量 input框按Enter键刷新问题
最新回复(0)