Live streaming with html5 – plus how does Youtube do it

html5videovideo streamingwii-uyoutube

So I have a Wii U now and tested Youtube Live streaming… and it worked flawlessly. Wow, I thought, I have to find out what kind of codec, container format, protocol, etc is used, but I kinda failed at that task.

I tried using Chrome to access the Youtube Live version but before a <video> tag that would give me this kind of information in it's source parameter could even appear in the DOM, it told me that the browser doesn't support any of the available video formats. I tried the same using different browsers (Opera, FF, IE9). Deactivating Flash, thus forcing the html5 player to kick in. I always got the same message.

Wow, so the HTML5 streaming, so far, only works on my Wii U… And probably the IOS devices, but I don't have one of those.

Okay, so basically what I would like to know: How do they realize the <video> live streaming? What container format, codecs, etc is used? I can't really access that info with my knowledge.

And any tips on how to replicate said format. I am not trying to broadcast something to the whole world – I'm rather trying to just broadcast something to my Wii U, anything otherwise wouldn't make much sense at this stage. I basically only need anything that accepts a DirectShow input on Windows.

Best Answer

Youtube actually uses the HLS "Http Live Streaming" method that Apple invented and is trying to standardize.

I replicated that method using a elaborate command line for VLC and a HTTP web server and it worked on the Wii U.

Here's the command line:

"c:\program files (x86)\videolan\vlc\vlc" -I rc dshow:// vdev="XSplitBroadcaster" adev="XSplitBroadcaster" size="1280x720" --sout=#transcode{width=1280,height=720,fps=25,vcodec=h264,vb=256,venc=x264{aud,profile=baseline,level=30,keyint=30,ref=1},acodec=mp3,ab=96,channels=2}:std{access=livehttp{seglen=10,delsegs=true,numsegs=5,index=C:\inetpub\wwwroot\stream\stream.m3u8,index-url=http://dennis/stream/stream-########.ts},mux=ts{use-key-frames},dst=C:\inetpub\wwwroot\stream\stream-########.ts}

Here, for a quick set up, is html code that accesses this stream:

<!doctype html>
<html>
<head></head>
<body>
<video width="320" height="240" controls="controls">
    <source src="/stream/stream.m3u8" type="application/x-mpegURL" />
</video>
</body>

</html>

Whoever uses this, you will have to change all the variables in there. It uses "chunk files" which it puts onto the web server's wwwroot which can then be streamed by an iDevice or a Wii U.

I personally think that this would have it's best place on a ramdisk because the data rapidly changes and there isn't a lot of data around at one time.

Related Question