浅谈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 相关文章推荐
分享8款纯CSS3实现的搜索框功能
Sep 14 HTML / CSS
css3之UI元素状态伪类选择器实例演示
Aug 11 HTML / CSS
CSS3实现各种图形的示例代码
Oct 19 HTML / CSS
css3 边框、背景、文本效果的实现代码
Mar 21 HTML / CSS
HTML5 Canvas图像模糊完美解决办法
Feb 06 HTML / CSS
处理HTML5新标签的浏览器兼容版问题
Mar 13 HTML / CSS
localStorage的过期时间设置的方法详解
Nov 26 HTML / CSS
iPhoneX安全区域(Safe Area)底部小黑条在微信小程序和H5的屏幕适配
Apr 08 HTML / CSS
Html5移动端网页端适配(js+rem)
Feb 03 HTML / CSS
CSS 使用 resize 实现图片拖拽切换预览功能(强大功能)
Aug 23 HTML / CSS
开发微信小程序之WXSS样式教程
Apr 18 HTML / CSS
html5+实现plus.io进行拍照和图片等获取
Jun 01 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
微信支付开发教程(一)微信支付URL配置
2014/05/28 PHP
关于ThinkPhp 框架表单验证及ajax验证问题
2017/07/19 PHP
Div Select挡住的解决办法
2008/08/07 Javascript
HTML颜色选择器实现代码
2010/11/23 Javascript
jquery插件制作 手风琴Panel效果实现
2012/08/17 Javascript
JS异常处理的一个想法(sofish)
2013/03/14 Javascript
JavaScript如何实现对数字保留两位小数一位自动补零
2015/12/18 Javascript
通过Ajax使用FormData对象无刷新上传文件方法
2016/12/08 Javascript
jquery实现输入框实时输入触发事件代码
2016/12/21 Javascript
jQuery使用siblings获取某元素所有同辈(兄弟姐妹)元素用法示例
2017/01/30 Javascript
js中apply和Math.max()函数的问题及区别介绍
2018/03/27 Javascript
使用electron将vue-cli项目打包成exe的方法
2018/09/29 Javascript
vue工程全局设置ajax的等待动效的方法
2019/02/22 Javascript
通过JS深度判断两个对象字段相同
2019/06/14 Javascript
JsonProperty 的使用方法详解
2019/10/11 Javascript
vue+elementui 对话框取消 表单验证重置示例
2019/10/29 Javascript
es6函数之尾调用优化实例分析
2020/04/25 Javascript
[42:00]完美世界DOTA2联赛PWL S3 Phoenix vs INK ICE 第一场 12.13
2020/12/17 DOTA
分享Python字符串关键点
2015/12/13 Python
Tensorflow使用支持向量机拟合线性回归
2018/09/07 Python
python+pyqt5实现KFC点餐收银系统
2019/01/24 Python
python动态进度条的实现代码
2019/07/03 Python
python 抓包保存为pcap文件并解析的实例
2019/07/23 Python
Python编译成.so文件进行加密后调用的实现
2019/12/23 Python
QML实现钟表效果
2020/06/02 Python
千禧酒店及度假村官方网站:Millennium Hotels and Resorts
2019/05/10 全球购物
班级学雷锋活动总结
2014/06/26 职场文书
2014年秋季开学典礼致辞
2014/08/02 职场文书
农村党员对照检查材料
2014/09/24 职场文书
工伤事故赔偿协议书范文
2014/09/24 职场文书
领导干部个人对照检查材料(群众路线)
2014/09/26 职场文书
小学一年级数学教学计划
2015/01/20 职场文书
交通事故和解协议书
2015/01/27 职场文书
水电工岗位职责
2015/02/14 职场文书
导游词之青城山景区
2019/09/27 职场文书
导游词之无锡古运河
2019/11/14 职场文书