video标签播放视频不能拖动进度条

frankltf frankltf     2023-04-08     830

关键词:

因为你的video的src不是直接使用视频文件的地址,而是通过后台接口返回文件流,后台返回流的时候没为response的header设置一些参数,否则会在部分浏览器有问题

String rangeString = request.getHeader("Range");//如果是video标签发起的请求就不会为null

long range = Long.valueOf(rangeString.substring(rangeString.indexOf("=") + 1, rangeString.indexOf("-")));

response.setHeader("Content-Type", "video/mp4");

response.setHeader("content-disposition", "attachment;filename=" + URLEncoder.encode("视频文件名称.mp4" , "UTF-8"));

response.setContentLength(10000);//10000是视频文件的大小,上传文件时都会有这些参数的

response.setHeader("Content-Range", String.valueOf(range + (10000-1)));//拖动进度条时的断点,其中10000是上面的视频文件大小,改成你的就好

response.setHeader("Accept-Ranges", "bytes");

response.setHeader("Etag", "W/"9767057-1323779115364"");//上传文件时都会有这些参数的

关于前端video标签视频无法拖动进度条快进问题(django)(代码片段)

因为后端返回的是视频的文件流,并不是视频文件地址。后端返回流的时候要为header设置一些参数,否则部分浏览器会出现问题(如GoogleChrome...)。django中常用返回文件流写法:classVideoAPIView(APIView):"""视频视图-... 查看详情

关于前端video标签视频无法拖动进度条快进问题(django)(代码片段)

因为后端返回的是视频的文件流,并不是视频文件地址。后端返回流的时候要为header设置一些参数,否则部分浏览器会出现问题(如GoogleChrome...)。django中常用返回文件流写法:classVideoAPIView(APIView):"""视频视图-... 查看详情

video标签不能自动播放的原因

复习一下video标签重要的属性吧~src要播放的视频的URL。autoplay如果出现该属性,则视频在就绪后马上播放。controls如果出现该属性,则向用户显示控件,比如播放按钮,进度条等。height设置视频播放器的高度。width... 查看详情

h5移动端自定义video播放控件controls(带播放暂停,进度条拖拽)

参考技术A说明:video不支持本地视频的进度拖动,会出现拖动就重头播放的情况,视频链接是网上随便找的,可能会出现请求不成功的情况。参考api:http://www.w3school.com.cn/tags/html_ref_audio_video_dom.asp 查看详情

微信小程序(原生)——video视频禁止拖动进度条可全屏观看等视频播放结束事件数据监听显示播放时长固定倍速视频去除黑边等(代码片段)

一、案例演示保留播放暂停、全屏按钮,进度条隐藏掉、手势拖动禁用代码<videoid="myVideo"src="http://wxsnsdy.tc.qq.com/105/20210/snsdyvideodownload?filekey=30280201010421301f0201690402534804102ca905ce620b1241b726bc41dcff44e00204012882540400... 查看详情

javascript实现video视频进度条拖动无效

在某些时候项目中会用到video,想让用户看完视频而不是一下拖到底结束,这种时候就要实现进度条拖动失效,用户拖动时会记录拖动上一秒的currentTime,在拖动结束后返回上一秒的位置,以此实现拖动失效效... 查看详情

关于前端video标签视频无法拖动进度条快进问题(django)(代码片段)

因为后端返回的是视频的文件流,并不是视频文件地址。后端返回流的时候要为header设置一些参数,否则部分浏览器会出现问题(如GoogleChrome...)。django中常用返回文件流写法:classVideoAPIView(APIView):"""视频视图-... 查看详情

iosh5点播播放mp4视频遇到的坑,ios的h5不能播放视频等

...持,以前网页播放视频基本依赖于flash等插件。而h5的video标签实现了网页播放视频无插件化。因此,h5的出现给网页视频播放带来极大的便捷性,目前,PC端的Chrome,安卓端浏览器,微信浏览器,QQ浏览器(自带播放器),以及IOS的s... 查看详情

通过加速或跳过网页视频解决进度条无法拖动问题

...#61;15;//加速至原速的15倍video.play();setInterval(play,100);//定时播放,防止被js恢复原速或暂停accelerate()注意,视频倍速有一定限制,超过一定限制会报错,我的是最高15或16倍速,可自行调试。2、跳过网页视频(... 查看详情

asp.netcore让video标签支持大于2g视频拖动播放,视频文件流支持拖动播放,不保露视频真实地址physicalfile,enablerangeprocessing

<videosrc="/video/GetVideoUrl"controls="controls"controlslist="nodownload"></ 查看详情

html5-video(播放暂停视频;打开关闭声音;进度条)

<!DOCTYPEhtml><html><head><title>HTML5-video(播放暂停视频;打开关闭声音;进度条)</title><metacharset="utf-8"/></head><body><videoid="video1"controls="controls"width=" 查看详情

asp.netcore让video标签支持大于2g视频拖动播放,视频文件流支持拖动播放,不保露视频真实地址physicalfile,enablerangeprocessing

<videosrc="/video/GetVideoUrl"controls="controls"controlslist="nodownload"></video>publicasyncTask<IActionResult>GetVideoUrl()awaitTask.Yield();// 查看详情

在vue项目中使用video.js实现视频播放和视频进度条打点(代码片段)

一、用video.js实现视频播放1、安装video.js插件//安装video.js插件npminstallvideo.js-S//如果需要播放rtmp直播流,需安装一下插件npminstallvideojs-flash-S2、在组件代码里使用<template><divdata-vjs-player><videoref="videoNode"class&... 查看详情

video标签学习,实现有声音自动循环播放(代码片段)

video标签核心属性:src要播放的视频的URL。autoplay如果出现该属性,则视频在就绪后马上播放。controls如果出现该属性,则向用户显示控件,比如播放按钮,进度条等。height设置视频播放器的高度。width设置视频... 查看详情

微信小程序-video禁止拖动进度条

参考技术Awxmljs 查看详情

opencv+qt实现简易视频播放器——支持进度条拖动(代码片段)

OpenCV实现视频播放器,其思路大致就是在线程中使用OpenCV中的VideoCapture循环读取本地视频的每一帧Mat,然后发送到界面转换成QImage进行显示,而进度条拖动则用到了VideoCapture中的set函数,进度条则是使用Qslider࿱... 查看详情

html——video标签

video调用方法<videosrc=""></video>用途往网页里面添加视频在里面添加controls="controls"结果是这样的<videosrc="movie.ogg"controls="controls"></video>最后的结果里面会出现进度条和播放暂停键我们还可以增加width和height属性定义... 查看详情

js代码实现视频进度条点到哪个位置就播放那个位置的视频。进度条是用css样式另做的。

...实现追问怎么写求代码 参考技术C我觉得你应该先把video标签的js内置方法和属性先看一下追问用currentTime是不是就可以实现大神求指导 查看详情