【问题标题】:how to download a part of video in html5 and js如何在html5和js中下载部分视频
【发布时间】:2020-04-26 08:35:22
【问题描述】:

我想下载或保存在我的 HTML 中播放的视频的一部分,我不想访问网络摄像头和麦克风我只需要下载或播放另一个视频标签中的视频标签的一部分或下载它......我该怎么做?......我看到的任何东西都在访问麦克风和网络摄像头

    <video id="yourVideoplayer" width="640" height="480" preload="auto"> //preload="auto" buffers the video if initialize. you cannot seek a video which isn t buffering already
  <source src="test.mp4" type="video/mp4" />
  <source src="test.ogv" type="video/ogg" /> 
  This browser is not compatible with HTML 5
</video>

我想要一个按钮从播放的视频开始录制然后我想保存它

【问题讨论】:

  • 您想在另一个视频标签中播放一个视频的一部分吗?
  • @Tecnogirl 是或者我想下载并保存

标签: javascript html html5-video


【解决方案1】:
<!DOCTYPE html>
<html>
<body>    
<video id="original-video" width="320" height="240" controls>
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
  Your browser does not support the video tag.
</video>
<video width="320" height="240" data-from="original-video" data-start="5" data-end="10" data-autoreplay="true" autoplay>
</video>
<video width="320" height="240" data-from="original-video" data-start="5" data-end="10" data-autoreplay="false" autoplay>
</video>
<script>
const body = document.querySelector('body');
const videos = document.querySelectorAll('video[data-from]');

videos.forEach(video=>{
    const originalVideo = document.getElementById(video.dataset.from);
    [...originalVideo.children].forEach(child=>{
        video.appendChild(child.cloneNode())
    });

    video.duration = Number(video.dataset.end) - Number(video.dataset.start);
    video.currentTime = video.dataset.start;

    video.addEventListener('timeupdate', (e)=>{
      if(video.currentTime>=video.dataset.end){
          video.pause();
          video.currentTime=video.dataset.start;
          if(video.dataset.autoreplay==="true"){
            video.play();
          }
      }
    });
});

</script>
</body>

这是我能达到的最接近您的要求。您使用data 属性来指定:

  • 原始视频
  • 开始
  • 结束
  • 如果它应该不间断地重播

【讨论】:

  • 非常感谢...如果您知道如何下载请告诉我...谢谢
  • 视频源只是您系统中的文件,因此如果您转到(您的地址)/movie.mp4,它应该为您提供下载文件的选项。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2018-09-26
  • 1970-01-01
相关资源
最近更新 更多