浅谈Html5中视频 音频标签 进度条的问题


Posted in HTML / CSS onJuly 26, 2016

最近项目中使用Html5的video和audio标签来在线播放视频和音频文件,但是遇到个奇葩的问题,页面上播放之后进度条无效,

查看w3c之后发现html代码并没有什么不同,之后猜想如果用静态的html使用video标签播放本地文件进度条会不会能用呢?

试了一下发现真的可以使用,随后F12查看播放本地视频和播放项目中的网络响应有什么区别,发现响应头多了些东西,随把这些东西一个一个加到后台代码中,最后成功了!

JavaScript Code复制内容到剪贴板
  1. response.setHeader("Cache-Control","max-age=31536000, must-revalidate");  
  2. response.setHeader("Content-Length", file.length() + "");  
  3. if (fileName.contains(".mp4")) {  
  4.    response.setContentType("video/mpeg4");  
  5. }  
  6. if (fileName.contains(".mp3")) {  
  7.    response.setContentType("audio/mpeg");  
  8.    response.setHeader("Accept-Ranges:""bytes");  
  9. }  

以上就是小编为大家带来的浅谈Html5中视频 音频标签 进度条的问题全部内容了,希望大家多多支持三水点靠木~

原文地址:http://www.cnblogs.com/youcanyouup/archive/2016/07/25/5704429.html

HTML / CSS 相关文章推荐
检测用户浏览器是否支持CSS3的方法
Aug 29 HTML / CSS
如何利用CSS3制作3D效果文字具体实现样式
May 02 HTML / CSS
使用CSS3制作响应式导航菜单的方法
Jul 12 HTML / CSS
html5理解head_动力节点Java学院整理
Jul 13 HTML / CSS
html5 input元素新特性_动力节点Java学院整理
Jul 06 HTML / CSS
HTML5 新事件 小结
Jul 16 HTML / CSS
用html5的canvas画布绘制贝塞尔曲线完整代码
Aug 14 HTML / CSS
实例教程 利用html5和css3打造一款创意404页面
Oct 20 HTML / CSS
HTML5 文件上传下载的实例代码
Jul 03 HTML / CSS
Html5 webRTC简单实现视频调用的示例代码
Sep 23 HTML / CSS
html5移动端禁止长按图片保存的实现
Apr 20 HTML / CSS
详解使用 CSS prefers-* 规范提升网站的可访问性与健壮性
May 25 HTML / CSS
html5 初试 indexedDB(推荐)
Jul 21 #HTML / CSS
浅谈HTML5 & CSS3的新交互特性
Jul 19 #HTML / CSS
HTML5和CSS3实例教程总结(推荐)
Jul 18 #HTML / CSS
HTML5 拖放功能实现代码
Jul 14 #HTML / CSS
HTML块级标签汇总(小篇)
Jul 13 #HTML / CSS
HTML5进阶段内联标签汇总(小篇)
Jul 13 #HTML / CSS
关于HTML5语义标签的实践(blog页面)
Jul 12 #HTML / CSS
You might like
PHP JSON格式数据交互实例代码详解
2011/01/13 PHP
浅析PHP原理之变量(Variables inside PHP)
2013/08/09 PHP
php使用Cookie实现和用户会话的方法
2015/01/21 PHP
php自定义hash函数实例
2015/05/05 PHP
7个鲜为人知却非常实用的PHP函数
2015/07/01 PHP
PHP工程师VIM配置分享
2015/12/15 PHP
HTML中不支持静态Expando的元素的问题
2007/03/08 Javascript
中国地区三级联动下拉菜单效果分析
2012/11/15 Javascript
JS编程小常识很有用
2012/11/26 Javascript
jQuery .attr()和.removeAttr()方法操作元素属性示例
2013/07/16 Javascript
jquery操作复选框checkbox的方法汇总
2015/02/05 Javascript
jQuery使用元素属性attr赋值详解
2015/02/27 Javascript
jQuery实现仿新浪微博浮动的消息提示框(可智能定位)
2015/10/10 Javascript
Javascript 引擎工作机制详解
2016/11/30 Javascript
Jquery给当前页或者跳转后页面的导航栏添加选中后样式的实例
2016/12/08 Javascript
JavaScript实现移动端轮播效果
2017/06/06 Javascript
vue-router路由参数刷新消失的问题解决方法
2017/06/17 Javascript
vue.js中v-on:textInput无法执行事件问题的解决过程
2017/07/12 Javascript
Vuejs中使用markdown服务器端渲染的示例
2017/11/22 Javascript
Node错误处理笔记之挖坑系列教程
2018/06/05 Javascript
swiper4实现移动端导航切换
2020/10/16 Javascript
p5.js实现动态图形临摹
2019/10/23 Javascript
[58:09]Spirit vs NB Supermajor小组赛 A组败者组决赛 BO3 第三场 6.2
2018/06/03 DOTA
python虚拟环境virualenv的安装与使用
2016/12/18 Python
Python使用cx_Oracle调用Oracle存储过程的方法示例
2017/10/07 Python
pandas DataFrame 交集并集补集的实现
2019/06/24 Python
浅析python 动态库m.so.1.0错误问题
2020/05/09 Python
利用Vscode进行Python开发环境配置的步骤
2020/06/22 Python
村委会主任先进事迹
2014/01/15 职场文书
2014年大学庆元旦迎新年活动方案
2014/03/09 职场文书
先进事迹报告会主持词
2014/04/02 职场文书
2014幼儿园小班工作总结
2014/11/10 职场文书
2014年基建工作总结
2014/12/12 职场文书
酒店工程部主管岗位职责
2015/04/16 职场文书
比较几种Redis集群方案
2021/06/21 Redis
5种方法告诉你如何使JavaScript 代码库更干净
2021/09/15 Javascript