从文件服务器读取音视频文件,以流的方式传给前台,并能够播放视频。

做了一个demo,用html5的video,audio标签实现。

后台实现代码:

@GetMapping(value = "/getVideos")
public String getVideos(HttpServletRequest request, HttpServletResponse response)
{
try {
FileInputStream fis = null;
OutputStream os = null ;
fis = new FileInputStream("C:\\Users\\zhangxin\\Desktop\\douyin.mp4");
int size = fis.available(); // 得到文件大小
byte data[] = new byte[size];
fis.read(data); // 读数据
fis.close();
fis = null;
response.setContentType("video/mp4"); // 设置返回的文件类型
os = response.getOutputStream();
os.write(data);
os.flush();
os.close();
os = null; } catch (FileNotFoundException e) {
e.printStackTrace();
} catch (IOException e) {
e.printStackTrace();
}
return null;
}

前端实现代码:

<video width="" height="" controls="controls" id="video" preload="auto"     >
<source src="getVideos" type="video/mp4">
</video>

html5 video标签播放视频流的更多相关文章

  1. HTML5 video标签播放视频下载原理

    HTML5 video https://github.com/remy/html5demos/blob/master/demos/video.html <video preload=" ...

  2. 在使用html5的video标签播放视频时为何只有声音却没有图像

    在使用html5的video标签播放视频时为何只有声音却没有图像? 答:使用格式化工厂转个编码就行了,MP4有3种编码,mpg4(xdiv),,mpg4(xvid),avc(h264)转换成H264编 ...

  3. mp4 格式无法使用html5的video标签播放

     只有视频编码为h264的视频才能在html5中使用video标签播放 我的解决方法为:下载魔影工厂,按照如下图所示步骤操作: width:600px;

  4. Web视频播放 之 【HTML5 Video标签】

    一.说明 HTML5中引入了video标签用于方便的在浏览器中播放视频,不在需要对flashPlayer进行依赖,更加轻量级.但在浏览器兼容.视频协议支持方面还有一些需要注意的问题. 二.浏览器兼容 ...

  5. html5 video标签如何禁止视频下载

    html5 video标签如何禁止视频下载 一.总结 一句话总结:bing方法给video对象绑定return false的匿名方法. 1.html5 video标签如何禁止视频下载? bing方法给 ...

  6. IPhone微信H5用Video标签播放不了视频

    H5用Video标签播放视频 视频在安卓上可以正常播放,在苹果上却不能播放. 因为用了文件服务站点,而且不支持断点下载 把文件服务改成支持断点下载即可 断点下载参考(C#)

  7. html5 video标签屏蔽右键视频另存为的js代码-HTML5教程

    点评:html5 video标签本身有下载功能但是在video区域内,点击右键可以将“视频另存为”下面是屏蔽右键视频另存为的js代码,有此需求的朋友不要错过   做HTML5的video标签,本身我们 ...

  8. 用HTML5 video标签插入视频,在谷歌浏览器上播放视频时,右下角显示的下载按钮怎么去掉

    使用H5的video标签可以直接插入视频,一般在浏览器效果如下图显示: 但有时在谷歌浏览器上显示,会遇到右下角有下载按钮.如果项目要求去掉这个下载按钮,怎么办呢?如下图显示: 分析: 经本人测试,是谷 ...

  9. ie8及ie8以下支持html5 video标签

    html5media是一个很给力的JavaScript类库,它不依赖于任何JavaScript框架.使用了html5media之后,当浏览器不支持HTML5时,它将会自动切换成Flash模式的Flow ...

随机推荐

  1. git 学习笔记 —— 获取远端分支并修改后提交至远端仓库

    笔者最近进行开发过程中,所有参与者的代码需要通过 git 上传到远端仓库中,不同的模块对应不同的 git 分支,不同模块的数据需要从远端仓库中获取.这里记录下笔者从远端仓库中获取分支数据,进行修改,最 ...

  2. VScode 配置 C++ 环境进行编译和调试

    这里记录为 VScode 配置 C++ 环境的简单步骤,实践环境为 Ubuntu 18.04 ,VScode 1.27 .在 Ubuntu 环境下,系统默认安装 gcc 和 g++ 编译器,故而下列步 ...

  3. Increasing Performance by Reducing Dynamic Dispatch

    https://developer.apple.com/swift/blog/?id=39 Increasing Performance by Reducing Dynamic Dispatch Li ...

  4. Python爬虫 | Selenium详解

    一.简介 网页三元素: html负责内容: css负责样式: JavaScript负责动作; 从数据的角度考虑,网页上呈现出来的数据的来源: html文件 ajax接口 javascript加载 如果 ...

  5. 常见WinDbg问题及解决方案

    当你调试一个程序时,你最不想处理的是调试器不能正常工作.当你试图集中精力跟踪一个bug时,总是会因为次要的问题而被忽略,尤其是当调试器的问题导致你失去一个重新编程或者浪费了大量的时间等待调试器完成它, ...

  6. 16-网页,网站,微信公众号基础入门(网页版MQTT,页面控件位置调整入门)

    https://www.cnblogs.com/yangfengwu/p/11200767.html 说一下,只要你java学的很好,那么几乎所有的语言都不在话下了 来看一下样式设置 运行 在左上角感 ...

  7. UE4的多线程

    1. 源代码 AsyncWork.h 2. 多线程的使用 参考文档:https://wiki.unrealengine.com/Using_AsyncTasks 当我们需要执行一个需要很长时间的任务时 ...

  8. Goldbach’s Conjecture(信息学奥赛一本通 1622)

    [题目描述] 原题来自:Ulm Local,题面详见:POJ 2262 哥德巴赫猜想:任何大于 44 的偶数都可以拆成两个奇素数之和. 比如: 8=3+5 20=3+17=7+13 42=5+37=1 ...

  9. git 初始用法

    Git global setup git config --global user.name "xiaoming" git config --global user.email & ...

  10. Golang 接口

    1 接口是什么 Golang中没有像Python.Java拥有类和对象的概念,其封装对象或说明对象是通过接口来实现的.比如谁能够实现什么样的功能,便能够将其抽象化封装. 接口定义了一组方法(抽象方法集 ...