HTML 5 includes the <video> tag to enable embedding of video.
Unfortunately, and unlike Flash, there is no way to directly use a webcam with it. However, if you want to experiment with it some VLC+Apache magic can help.
Firstly, you need to setup VLC to do HTTP streaming. These instructions are for windows, but it works on Linux, too (Linux seems a lot less stable. I suspect that is a Firefox problem rather than VLC, though). VLC can be somewhat obtuse to use, so here’s how I got it working
Step 1: Open VLC and select streaming
Step 2: Select Capture Device
Click the “Stream” button.
Step 3: Stream Dialog
Click the “Next” button.
Step 4: Add stream destination
Select “HTTP”, check “Display Locally”, select the “Video – Thora + Vorbis (OGG)” profile and click “Add”
Step 5: Configure the stream
Note that I changed the port from the default of 8080 to 8081. This is optional, but note what port you use. Verify the profile is correct, and click the “Next” button.
Step 6: Modify the stream path
Carefully alter the “Generated stream output string” to include “/stream.ogg” after the port. You need to do this because Firefox uses the file extension to work out how to handle the file (in the absence of correct headers).
Click Stream, and VLC should display a window showing your webcam.
Step 7: Verify streaming is working
Go to http://localhost:8081/stream.ogg in Firefox. Chrome kind of works, too, sometime (I usually get the first frame, and then it stops playing).
Optional Step
This stream can be embedded in a webpage using the URL above. However, if you want to manipulate it in Javascript at all you will quickly run into the same-origin restriction. It’s possible to get around this by using Apache to proxy the stream onto the same site you serve yout pages and javascript from.
Step 8: Configure Apache to Proxy Stream
I use mod_proxy, and add the following:
ProxyPass /stream/stream.ogg http://localhost:8081/stream.ogg
That will allow you to view the stream from http://yourwebserver:port/stream/stream.ogg.
In my next post I aim to show something you can do with this stream.
The only difference in Linux is that the capture mode is Video for Linux 2, and /dev/video0 for the device. Still worked like a charm :)
Okay scratch that, the video seems to conk out after 15 seconds or so, it does seem to be a Firefox issue since VLC is still chugging along happily.
Yeah, that’s pretty much the same behavior I got with Linux myself.
Decreasing the framerate and resolution from the capture device, and the bitrate for the encoder, has helped alot. Now the stream plays indefinitely, though there can still be several seconds of delay.
hey Nick and Mike
What versions of firefox are you guys running on linux?
Also, would you mind checking out my post at The VideoLAN Forums
http://forum.videolan.org/viewtopic.php?f=13&t=68691&start=0
thanks!
Hi John,
I’ve tried both Firefox 3 & 3.5 streams on Linux (unsure of the exact versions). Based on your forum posting, though, I think we’re doing something different to you. What I’m doing here is transcoding to Ogg/Vorbis, and then using native HTML5 video support to view the video. It appears you are trying to use a plugin to view video – HTML5 video avoids that approach.
thanks Nick –
I do understand that the HTML5 approach is different, and does start to work for me on both firefox 3.55 and 3.0.15 linux.
Your settings described here are also the only way I have been able to get it to work with a plugin. They also work with mplayer on linux and smplayer on xp.
correction! ff 3.0.15 does load the totem plugin for
http://localhost:8080/stream.ogg
but 3.5.5 does not
Works like a charm, i want to proxy the stream to a webserver located in a datacenter.. when using proxypass. will apache still build a new connection for every new client to the pc hosting the webcam? or will apache just relay.
If not, how can i make the apache server in the datacenter relay the stream? perhaps get a vlc daemon running on it?