以 HTML 格式播放本地存储的 FLV 文件答案

【问题标题】：Playing a locally stored FLV file in HTML以 HTML 格式播放本地存储的 FLV 文件
【发布时间】：2017-08-02 15:15:01
【问题描述】：

我正在尝试制作一个简单的 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>

【问题讨论】：

attributename=attribute value 用空格隔开时，大部分浏览器会认为它是node.js的三个不同属性。 <button id = "playVideo"> => 将是节点：按钮，属性'id'=null，'='=null 'playVideo'=null。
对于你的问题，flv 需要一个播放器。你不能直接播放 flv 文件作为嵌入对象。看看videojs.com
play flv in html的可能重复
解决了吗？

标签： javascript html flv

【解决方案1】：

看起来这个问题在这里得到了回答： 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>

【讨论】：

这也适用于 SWF 文件吗？我也在尝试实现一个 SWF 文件，但它似乎不起作用。
您应该可以像这样添加 SWF 文件：<object width="550" height="400"> <param name="movie" value="somefilename.swf"> <embed src="/support/somefilename.swf" width="550" height="400"> </embed> </object>
是否可以为 param 标签设置属性？因为我尝试使用 getElementsByName("movie").setAttribute("value", "somefilename.swf");所以与我的其余代码类似，当我单击播放 flash 按钮时，它将播放 swf 文件。