在 HTML 中播放本地存储的 FLV 文件

Playing a locally stored FLV file in HTML

我正在尝试制作一个简单的 html 页面,您可以在其中单击一个按钮,它会播放本地存储在我计算机上的 FLV 文件,但我不确定自己在做什么错误的。我已经设法对 Youtube 视频和 MP4 做了类似的事情,但我无法播放 FLV 文件。我设法做的最好的事情是当它被点击时它被下载。这是我的代码:

<html>
<body>
  <video id = "video" width = "200px" height = "200px">
  </video>

  <iframe id = "YouTube" width="560" height="315" frameborder="0" allowfullscreen>
  </iframe>

  <embed id = "flash" width = "200px" height = "200px">
  </embed>

  <button id = "playVideo">Play Short Clip</button>
  <button id = "playYouTube">Play YouTube Video</button>
  <button id = "playFlash">Play Flash</button>

</body>
<script>
document.getElementById("playVideo").onclick = function playVideo() {
  document.getElementById("video").setAttribute("src", "StarContainerTunnel.mp4");
  document.getElementById("video").play();
};
document.getElementById("playYouTube").onclick = function playYouTube() {
  document.getElementById("YouTube").setAttribute("src", "https://www.youtube.com/embed/DTqa-NEwUbs");
  document.getElementById("YouTube").play();
};
document.getElementById("playFlash").onclick = function playFlash() {
  document.getElementById("flash").setAttribute("src", "barsandtone.flv");
  document.getElementById("flash").play();
};
</script>

</html>

看起来这个问题在这里得到了回答: How to Play FLV Video in HTML Video tags?

您可以使用 http://videojs.com/ 来实现您的目标。

获得此标签后,您可以像这样使用视频标签:

<video id="example_video_1" class="video-js vjs-default-skin"
 controls preload="auto" width="640" height="480"
 poster="http://video-js.zencoder.com/oceans-clip.png"
 data-setup='{"example_option":true}'>
<source src="rtmp://localhost/live/test" type="rtmp/flv">
</video>