HTML video tag suggestions - html

I have strange problem, that i can't resolve. I have stream that i have to put in a site. I don't have access to the stream link which is http://94.26.60.47:8880/865tv.mpg
The codec used is mp4. I know that this is strange, but i can't change this link, and i need to put it in a site using HTML5 video tag. I used this code:
<!DOCTYPE HTML>
<html>
<head>
<title>Test Stream</title>
<meta name="author" content="" />
<meta name="keywords" content="" />
<meta name="description" content="" />
</head>
<body>
<video width="320" height="240" controls>
<source src="http://94.26.60.47:8880/865tv.mpg" type="video/mp4">
Your browser does not support the video tag.
</video>
</body>
</html>
As a result in Chrome i just see empty player. In Mozilla i get more debug info:
HTTP "Content-Type" of "video/mpeg" is not supported. Load of media resource http://94.26.60.47:8880/865tv.mpg failed.
Invalid URI. Load of media resource failed.
What i did, is changing mime.types in my apache conf (restarted after the change) (remove mpg from video/mpeg and add it to video/mp4), and no success.
Any help will be appreciated.

It's clear that you cannot play mpeg1 or mpeg2 using html5. I also was looking into something like that. You could embed a VLC web player that can handle these video formats pretty easily. Maybe consider... https://wiki.videolan.org/Documentation:WebPlugin/
<html>
<title>VLC Mozilla plugin test page</title>
<body>
<center><embed type="application/x-vlc-plugin" pluginspage="http://www.videolan.org"
width="640" height="480" id="vlc">
</embed></center>
<script language="Javascript">
<!--
var vlc = document.getElementById("vlc");
var id = vlc.playlist.add("http://94.26.60.47:8880/865tv.mpg");
vlc.playlist.playItem(id);
//!-->
</script>
</body>
</html>

Related

laying online stream in HTML webpage

I want to play this audio live stream in html browser
http://uk3.internet-radio.com:8405/live
I tried several players with no hope
any player than can do that? or plugin
You can try something like this:
<html>
<head>
<meta name="viewport" content="width=device-width">
</head>
<body>
<video controls="" autoplay="" name="media">
<source src="http://uk3.internet-radio.com:8405/live" type="audio/aac">
</video>
</body>
</html>
To try, save it as .html file and run.

Why don't my vtt subtittles show up on my html5 video?

I'm trying to use subtitles with my HTML5 video tag, but I can't get this to work.
I think the issue is that the video source isn't a local file.
Does anyone know how I can get around this?
<html>
<head>
<style id="stndz-style"></style>
<meta name="viewport" content="width=device-width">
</head>
<body>
<video id="video" controls autoplay="" name="media">
<source src="http://localhost:8888/" type="video/mp4">
<track label="Dutch" kind="subtitles" srclang="nl" src="/home/ubuntu/Desktop/scripts/example.vtt" default>
</video>
</body>
</html>
and this is my example.vtt:
WEBVTT
00:01.000 --> 00:04.000
Never drink liquid nitrogen.
00:05.000 --> 00:09.000
- It will perforate your stomach.
- You could die.
Turns out that cromium not letting me use local files was the issue. So my workaround is to run chromium like this:
chromium --allow-file-access-from-files

Track element is not working with audio element

I am trying to use the track element with audio element but it is not working for me, can someone give me some guidance
Looking in my console I dont see an error but i see this
Resource interpreted as TextTrack but transferred with MIME type text/plain: "http://127.0.0.1/output_trim.vtt".
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Title of the document</title>
</head>
<body>
<audio width="900" height="900" controls >
<source src="output_trim.ogg" type="audio/ogg">
<track label="English" kind="subtitles" srclang="en" src="http://127.0.0.1/output_trim.vtt" default>
</video>
</body>
</html>
You can try loading a webm audio file as the src attribute for a video element. Then you can set the length and width attributes of the video element so it looks like a music player. I've done this using the URL.createObjectURL() to play local audio with .vtt files on my drive but I'm not sure about other use cases.

A plugin is needed to display this content,I have embeded the code in normal html?

A plugin is needed to display this content, I have embeded the code in normal html?
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<body>
<embed src="video/MOV01546.MPG">
</body>
</html>
My question are:
1.I am going to use normal html embed tag,what plugin i need to install? or what engine i need to call for playing all video format file
2.This is dynamic site administrator will upload any type of video format, so provide me a solution for this
3.I am going to use normal html embed tag only.
4.I want to know what player will run on all major browser, Firefox,chrome,safari
1 - You can work with html5 player :
<video id="example_video_1" controls preload="none" width="640" height="264" poster="./prez.jpg" data-setup="{}">
<source src="./oceans-clip.mp4" type='video/mp4' />
<source src="./oceans-clip.webm" type='video/webm' />
<source src="./oceans-clip.ogv" type='video/ogg' />
</video>
2- basic knowledge, you can protect your admin folder with .htaccess htpasswd (without your code i can't help you more)
3- find system for upload file and you find your basic solution to upload video. Verify chmod of your media folder... Verify the max memory that your server can take for one execution.

Audio not playing using HTML 5 in Windows 8 Phone

I am trying to make an audio player using HTML 5 project template. I am using the following HTML code :
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" type="text/css" href="/html/css/phone.css" />
<title>Windows Phone</title>
</head>
<body>
<div>
<p>Audio Player</p>
</div>
<div id="page-title">
<p>Play Audio</p>
<audio controls="">
<source src="horse.ogg" type="audio/ogg">
Your browser does not support the audio element.
</audio>
</div>
</body>
</html>
I picked up this code from here, I have added the "horse.ogg" to the solution explorer as shown in the screenshot below...
But when I run this appication I get the following output, it reads
Invalid Source
But when I open the same html using a browser I am able to play the file properly.
What could be the problem ?
Is there a better and easier way in which I could play audio files which I will add to the solution explorer and play using HTML 5 ? I am planning to add 10-15 small and funny audio clips and the app will allow user to select it and play it using HTML 5.
Please share your thoughts on this.
As the error message says, it's an invalid source.
Internet Explorer 10 doesn't support Ogg audio files, but MP3 files. Convert your Ogg to an MP3 and it should work fine.
<audio controls>
<source src="horse.mp3" type="audio/mp3">
</audio>
Also, if you're only providing one source you can use the src attribute of the audio element:
<audio src="horse.mp3" controls></audio>
But this is only really recommended if you are targetting one particular type of browser only.