html - HTML5 视频 - 仅从视频中获取配乐

Question

我想加载一个视频，我只向用户展示视频的声音。事实上，如果我只能从视频中下载音轨，那将是最好的。

是否可以加载带有标签的视频然后只获得声音？

视频以 .m4v 或 .mp4 文件扩展名编码为 H.264 编解码器。

Answer 1

我认为只下载音轨是不可能的，所以无论如何你必须播放视频，但你可以隐藏它。

您可以使用 js 库（例如 jplayer 或 videojs，因此您可以控制）并通过 css 删除视频。

看看这个 js-fiddle：http: //jsfiddle.net/8Hm6y/

将插件插入文档的头部：

<link href="http://vjs.zencdn.net/4.1/video-js.css" rel="stylesheet">
<script src="http://vjs.zencdn.net/4.1/video.js"></script> 

您指定源文件的 HTML：

<video id="" class="video-js vjs-default-skin"
  controls preload="auto" data-setup='{"controls": true}'>
 <source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4' />
 <source src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm' />
 <source src="http://video-js.zencoder.com/oceans-clip.ogv" type='video/ogg' />
</video>

CSS：

#vjs_video_4_html5_api {  
    display:none; /* remove video */
}
.vjs-big-play-button {
    display:none !important;  /* remove play button inside video*/
}

#vjs_video_4{
    height:38px !important;  /* make container smaller */
}

.vjs-control-bar {  /* make controlbar visible */
    visibility: visible !important;
    opacity: 1 !important;
    transition-duration: 0s!important;
    display:block !important;
}

在这种情况下，我使用了 videojs，所以我有视频的控件，然后我用 css 隐藏了视频。随意调整 css 以适应您的需求。

希望有帮助。