Playing a locally stored FLV file in HTML

Question

I'm trying to make a simple html page where you can click a button and it plays a FLV file that is locally stored on my computer, but I'm not sure what I'm doing wrong. I've already managed to do a similar thing with a Youtube video as well as an MP4, but I'm having trouble getting the FLV file to play. The best I've managed to do is that when it's click it is downloaded. Here's my code:

<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>

When you separate attributename = attribute value with spaces, most browsers will consider it as three different properties of node. ` — serdar.sanri, Aug 02 '17 at 15:18
And for your question, flv needs a player. you can't play flv file straight adding as embed object. take a look at http://videojs.com/ — serdar.sanri, Aug 02 '17 at 15:21
Possible duplicate of [play flv in html](https://stackoverflow.com/questions/2248800/play-flv-in-html) — serdar.sanri, Aug 02 '17 at 15:21

score 0 · Accepted Answer · answered Aug 02 '17 at 16:11

0

Looks like this question was answered here: How to Play FLV Video in HTML Video tags?

You can use http://videojs.com/ to achieve your goal.

Once you get this you can use the video tag like this:

<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>

answered Aug 02 '17 at 16:11

BlueIceDJ

606
6
6

Can this also apply to SWF files? I am attempting to implement an SWF file as well, but it doesn't seem to work. – Glaz Aug 02 '17 at 19:55
You should be able to add SWF file like this: `` – BlueIceDJ Aug 04 '17 at 17:05
Is it possible to set attributes for the param tag? Because I tried using getElementsByName("movie").setAttribute("value", "somefilename.swf"); so similarly to the rest of my code, when I clicked the play flash button it would have the swf file play. – Glaz Aug 05 '17 at 14:22

Playing a locally stored FLV file in HTML

1 Answers1