Saturday, March 20, 2010

Build Your Own Video Community With Lighttpd And FlowPlayer (Ubuntu 9.10)

This article shows how you can build your own video community using lighttpd with its mod_flv_streaming module (for streaming .flv videos, the format used by most major video communities such as YouTube) and its mod_secdownload module (for preventing hotlinking of the videos) on Ubuntu 9.10.

I will use FlowPlayer as the video player, a free Flash video player with support for lighttpd's mod_flv_streaming module.

I will also show how you can encode videos (.mp4 .mov .mpg .3gp .mpeg .wmv .avi) to the FLV format supported by Adobe Flash.

This document comes without warranty of any kind! I want to say that this is not the only way of setting up such a system.

There are many ways of achieving this goal but this is the way I take. I do not issue any guarantee that this will work for you!


1 Preliminary Note
In this tutorial I use the hostname server1.example.com with the IP address 192.168.0.100. These settings might differ for you, so you have to replace them where appropriate.

We need a lighttpd installation with PHP support, as shown in this tutorial: Installing Lighttpd With PHP5 And MySQL Support On Ubuntu 9.10.

I won't cover this here, so please refer to this tutorial if you haven't already set up lighttpd with PHP support.

Because we must run all the steps from this tutorial with root privileges, we can either prepend all commands in this tutorial with the string sudo, or we become root right now by typing

# sudo su

2 Installing ffmpeg
We will use ffmpeg to convert our video files to the FLV format. The problem with the official Ubuntu ffmpeg package is that is doesn't come with MP3 encoding support, which means that our FLV videos will lose their sound after the conversion.

Therefore we add the Debian-Multimedia repository to our sources.list and install the ffmpeg package from that repository - it comes with MP3 support by default. (You might wonder why we use the Debian-Multimedia repository instead of the Medibuntu repository, but the Medibuntu repository has no ffmpeg package at all.)

# vi /etc/apt/sources.list

Add the Debian-Multimedia repository (you can find a mirror close to you here), e.g. like this: 

[...]
deb http://ftp-stud.hs-esslingen.de/pub/Mirrors/debian-multimedia/ stable main
deb-src http://ftp-stud.hs-esslingen.de/pub/Mirrors/debian-multimedia/ stable main

Then download the debian-multimedia-keyring package and install it:

# wget http://www.debian-multimedia.org/pool/main/d/debian-multimedia-keyring/debian-multimedia-keyring_2008.10.16_all.deb
# dpkg -i debian-multimedia-keyring_2008.10.16_all.deb

Next we create the file /etc/apt/preferences with the following contents to give the Debian-Multimedia packages a higher priority than the packages from the Ubuntu Karmic repository (to make sure that the ffmpeg package along with its dependencies get installed from the Debian-Multimedia repository, not from the Karmic repository):

# vi /etc/apt/preferences

Package: *
Pin: release a=karmic
Pin-Priority: 650

Package: *
Pin: release a=stable
Pin-Priority: 700

(You might want to check out A Short Introduction To Apt-Pinning to find out why /etc/apt/preferences looks like that.)

Finally update your package-list:

# aptitude update

We can now install ffmpeg as follows:

# aptitude install ffmpeg

3 Installing flvtool2
When we convert videos to the FLV format, we need to add some metadata such as the duration of the video to the FLV file so that FlowPlayer can properly display the length of the video.

We can add this metadata with flvtool2. We can install flvtool2 as follows:

# aptitude install flvtool2

4 Creating Video Directories
In this tutorial I'm assuming that your lighttpd document root for your video web site is /var/www (the default document root for lighttpd on Ubuntu).

Of course, we don't want to store the original videos and the FLV videos in the document root (or a subdirectory) to prevent that anyone can download them directly (if he knows the link).

Therefore we create a directory for the original videos (e.g. /var/videos/incoming) and a directory for the FLV videos (e.g. /var/videos/flv) outside the document root:

# mkdir -p /var/videos/incoming
# mkdir -p /var/videos/flv

You (or your users) can then upload their original videos to /var/videos/incoming (e.g. through FTP or some web interface that you program), and you can then encode the videos to FLV (either manually or through some script), as shown in the next chapter.


5 Encoding Videos To FLV
Let's assume we have a video called video.avi in /var/videos/incoming (works for the extensions .mp4 .mov .mpg .3gp .mpeg .wmv as well).

We want to convert it to the file video.flv and store it in the directory /var/videos/flv. I want video.flv to have a size of 320x240 pixels with an audio sampling frequency of 44100 Hz, two audio channels (stereo), and a frame rate of 12 fps.

This is how we do it:

# ffmpeg -i /var/videos/incoming/video.avi -s 320x240 -ar 44100 -r 12 -ac 2 /var/videos/flv/video.flv
(For more options, take a look at man ffmpeg)

This can take some time, and the output should look something like this:

root@server1:~# ffmpeg -i /var/videos/incoming/video.avi -s 320x240 -ar 44100 -r 12 -ac 2 /var/videos/flv/video.flv
FFmpeg version SVN-r13582, Copyright (c) 2000-2008 Fabrice Bellard, et al.
  configuration: --prefix=/usr --libdir=${prefix}/lib --shlibdir=${prefix}/lib --bindir=${prefix}/bin --incdir=${prefix}/include/ffmpeg --enable-shared --enable-libmp3lame --enable-gpl --enable-libfaad --mandir=${prefix}/share/man --enable-libvorbis --enable-pthreads --enable-libfaac --enable-libxvid --enable-postproc --enable-libamr-nb --enable-libamr-wb --enable-x11grab --enable-libgsm --enable-libx264 --enable-liba52 --enable-libtheora --extra-cflags=-Wall -g -fPIC -DPIC --cc=ccache cc --enable-swscale --enable-libdc1394 --enable-nonfree --disable-mmx --disable-stripping --enable-avfilter --enable-libdirac --disable-decoder=libdirac --enable-libschroedinger --disable-encoder=libschroedinger --disable-altivec --disable-armv5te --disable-armv6 --disable-vis
  libavutil version: 49.7.0
  libavcodec version: 51.58.0
  libavformat version: 52.16.0
  libavdevice version: 52.0.0
  libavfilter version: 0.0.0
  built on May  3 2009 12:07:18, gcc: 4.3.2
Input #0, avi, from '/var/videos/incoming/video.avi':
  Duration: 00:10:53.82, start: 0.000000, bitrate: 5455 kb/s
    Stream #0.0: Video: mpeg4, yuv420p, 1024x576 [PAR 1:1 DAR 16:9], 24.00 tb(r)
    Stream #0.1: Audio: ac3, 48000 Hz, 5:1, 448 kb/s
Output #0, flv, to '/var/videos/flv/video.flv':
    Stream #0.0: Video: flv, yuv420p, 320x240 [PAR 4:3 DAR 16:9], q=2-31, 200 kb/s, 12.00 tb(c)
    Stream #0.1: Audio: libmp3lame, 44100 Hz, stereo, 64 kb/s
Stream mapping:
  Stream #0.0 -> #0.0
  Stream #0.1 -> #0.1
Press [q] to stop encoding
[libmp3lame @ 0x7f983556f6c0]lame: output buffer too small (buffer index: 8359, free bytes: 281)
frame= 7847 fps= 13 q=2.0 Lsize=   21696kB time=653.92 bitrate= 271.8kbits/s
video:16067kB audio:5114kB global headers:0kB muxing overhead 2.428783%
root@server1:~#

Please make sure that in the Output section, you see two streams, one for video, one for audio. If you see video only, this means that the sound gets lost.

After the conversion, we can now add metadata to video.flv with flvtool2:
cat /var/videos/flv/video.flv | flvtool2 -U stdin /var/videos/flv/video.flv

6 Configuring Lighttpd
Now we have to open lighttpd's main configuration file, /etc/lighttpd/lighttpd.conf, and add/enable the modules mod_secdownload and mod_flv_streaming in it.

It is very important that mod_secdownload is listed before mod_flv_streaming in the server.modules stanza.

When I did it the other way round, I found that fast-forwarding the video in FlowPlayer didn't work!

# vi /etc/lighttpd/lighttpd.conf

[...]
server.modules              = (
            "mod_access",
            "mod_alias",
            "mod_accesslog",
            "mod_compress",
#           "mod_rewrite",
#           "mod_redirect",
#           "mod_evhost",
#           "mod_usertrack",
#           "mod_rrdtool",
#           "mod_webdav",
#           "mod_expire",
            "mod_secdownload",
            "mod_flv_streaming",
#           "mod_evasive"
)
[...]

In the same file, we add also add the following configuration (you can add it right at the end of /etc/lighttpd/lighttpd.conf):

[...]
flv-streaming.extensions = ( ".flv" )
secdownload.secret          = "somesecret"
secdownload.document-root   = "/var/videos/flv/"
secdownload.uri-prefix      = "/dl/"
secdownload.timeout         = 120

Please replace somesecret with your own secret string (you can choose one).

What mod_secdownload does is this: a web application (e.g. a PHP script) can have a link in it of the following form:

///
e.g.
/dl/d8a8cb150f7e5962f6a8443b0b6c6cc2/46c1d9f6/video.flv
where is an MD5 of
  1. a secret string (user supplied)
  2. (starts with /)

mod_secdownload will then map this link to the appropriate file in the secdownload.document-root (which is outside the document root of the web site) and allow access to that file for secdownload.timeout seconds.

After secdownload.timeout seconds, the link isn't valid anymore, and access is denied.

After we have installed FlowPlayer, we will use a PHP script to generate the appropriate video links for mod_secdownload.

You can find more information about mod_secdownload here: http://trac.lighttpd.net/trac/wiki/Docs%3AModSecDownload

Don't forget to restart lighttpd after your changes to /etc/lighttpd/lighttpd.conf:
/etc/init.d/lighttpd restart

7 Installing FlowPlayer
Go to http://flowplayer.org/download and download the latest FlowPlayer version to your /tmp directory, e.g. like this:

# cd /tmp
# wget http://releases.flowplayer.org/flowplayer/flowplayer-3.1.5.zip

FlowPlayer comes in .zip format, so we must install unzip to uncompress it:

# aptitude install unzip

Afterwards we can uncompress it:

# unzip flowplayer-3.1.5.zip

This creates a directory called flowplayer in the /tmp directory. I'd like to have that directory in the document root of my video web site (/var/www), so I move it there:

# mv flowplayer /var/www/

8 Configuring FlowPlayer
FlowPlayer is now installed, so all that is left to do is create an HTML file that lets us watch our video.

I will create a PHP file for this called /var/www/flowplayertest.php which contains all parameters to start FlowPlayer in the user's browser and which also creates valid video links for mod_secdownload:

# vi /var/www/flowplayertest.php















It's very important that $secret has the same value than secdownload.secret in /etc/lighttpd/lighttpd.conf. Also, $uri_prefix and secdownload.uri-prefix must match.

If this is fulfilled, the above script will generate valid links. $f must hold the filename of the FLV video, beginning with a slash (/).

(The filename is hard-coded in the above example, but of course you can program whatever you like to dynamically generate the filename.)

The important parts that call FlowPlayer are (which refers to the flowplayer-3.1.4.min.js script in the /var/www/flowplayer/example directory) in the section and the following two parts in the section:

    href=""
    style="display:block;width:320px;height:256px;"
    id="player">

(The most important setting is the href parameter (which is set by PHP in the above script) which specifies the path to the FLV video. In the style parameter, we can specify the width and height of our video player.)
and

(Here we specify the path to our FlowPlayer .swf file.)

This FlowPlayer configuration is taken from http://flowplayer.org/demos/installation/index.html.

To learn more about other ways of calling FlowPlayer and how to call it with specific settings, take a look at the examples on http://flowplayer.org/demos/index.html.

Now it's time to test our setup. Direct your browser to http://192.168.0.100/flowplayertest.php or http://server1.example.com/flowplayertest.php, and your video should start to play in your browser (including sound):


Click to enlarge


This is how the native Flash 9 full screen mode looks:

Click to enlarge

9 Links
Posted by at

No comments:

Post a Comment

Subscribe to: Post Comments (Atom)