浅谈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地图动态实例代码(圆圈向外扩散)
Jun 15 HTML / CSS
CSS3属性box-shadow使用详细教程
Jan 21 HTML / CSS
使用CSS变量实现炫酷惊人的悬浮效果
Apr 26 HTML / CSS
HTML5之多线程(Web Worker)
Jan 02 HTML / CSS
免费获得微软MCSD证书赶快行动吧!
Nov 13 HTML / CSS
html5 Canvas画图教程(11)—使用lineTo/arc/bezierCurveTo画椭圆形
Jan 09 HTML / CSS
HTML5 CSS3打造相册效果附源码下载
Jun 16 HTML / CSS
5 个强大的HTML5 API 函数推荐
Nov 19 HTML / CSS
利用HTML5绘制点线面组成的3D图形的示例
May 12 HTML / CSS
Html5实现移动端、PC端 刮刮卡效果
Jun 30 HTML / CSS
html5 http的轮询和Websocket原理
Oct 19 HTML / CSS
微信小程序canvas实现水平、垂直居中效果
Feb 05 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远程连接MYSQL数据库非常慢的解决方法
2008/07/05 PHP
永不消失的title提示代码
2007/02/15 Javascript
Prototype ObjectRange对象学习
2009/07/19 Javascript
JQuery防止退格键网页后退的实现代码
2012/03/23 Javascript
JavaScript 在网页上单击鼠标的地方显示层及关闭层
2012/12/30 Javascript
[原创]推荐10款最热门jQuery UI框架
2014/08/19 Javascript
jQuery中DOM树操作之复制元素的方法
2015/01/23 Javascript
javascript实现十秒钟后注册按钮可点击的方法
2015/05/13 Javascript
js仿微博实现统计字符和本地存储功能
2015/12/22 Javascript
Bootstrap中文本框的宽度变窄并且加入一副验证码图片的实现方法
2016/06/23 Javascript
jQuery内存泄露解决办法
2016/12/13 Javascript
微信小程序 swiper 组件遇到的问题及解决方法
2019/05/26 Javascript
微信小程序位置授权处理方法
2019/06/13 Javascript
Python中设置变量作为默认值时容易遇到的错误
2015/04/03 Python
python 统计列表中不同元素的数量方法
2018/06/29 Python
使用Python编写Prometheus监控的方法
2018/10/15 Python
python使用udp实现聊天器功能
2018/12/10 Python
python时间与Unix时间戳相互转换方法详解
2020/02/13 Python
Python3监控疫情的完整代码
2020/02/20 Python
Python自动重新加载模块详解(autoreload module)
2020/04/01 Python
CSS3贝塞尔曲线示例:创建链接悬停动画效果
2020/11/19 HTML / CSS
利用HTML5中的Canvas绘制一张笑脸的教程
2015/05/07 HTML / CSS
HTML5页面中尝试调起APP功能
2017/09/12 HTML / CSS
原生canvas制作画图小工具的踩坑和爬坑
2020/06/09 HTML / CSS
微软香港官网及网上商店:Microsoft HK
2016/09/01 全球购物
大学生毕业求职找工作的自我评价
2013/09/29 职场文书
办公室文员岗位职责范本
2014/06/12 职场文书
环境保护与污染治理求职信
2014/07/16 职场文书
教师节感恩老师演讲稿
2014/08/28 职场文书
党章培训心得体会
2014/09/04 职场文书
2015年大学元旦晚会活动策划书
2014/12/09 职场文书
工程技术员岗位职责
2015/04/11 职场文书
2015年城管个人工作总结范文
2015/04/20 职场文书
领导离职感言
2015/08/03 职场文书
唱歌比赛拉拉队口号
2015/12/25 职场文书
Python Pandas知识点之缺失值处理详解
2021/05/11 Python