This is a message.

Stream your videos with standard HTTP servers

Pseudostreaming is a protocol that can be installed on regular HTTP servers such as Apache, Tomcat, IIS or lighthttpd. It uses a server-side script for Flash-to-server communication.

The above example uses our pseudostreaming plugin to get video data from a lighthttpd web server and its flv_streaming module. Try seeking to any part of the timeline.

The player sends a HTTP request to the server with a start time parameter in the request URL's query string and the server script responds with the video stream so that its start position corresponds to the requested parameter. This start time parameter is usually named simply start. This same technique is used by the ultra-popular YouTube service which uses lighthttpd servers.

The biggest advantage of using pseudostreaming or any other streaming solution is the ability to seek in the timeline to positions that have not been downloaded yet to the player. This is most desirable for full-length movies because the visitor can seek to the last scene of a 2-hour movie if she wants to. Here are the benefits:

  • Random seeking to any part of the timeline at any time.
  • Starting playback in the middle of the clip's timeline.
  • Provides integration possibilities to custom streaming servers and server-side scripts.
  • Both FLV and H.264 files are supported.

Here is a list of most popular server-side technologies that support pseudostreaming:

See also pseudostreaming with IIS and ASP.NET

<!-- set up player container named "lighty" -->
<a class="player" id="lighty">
<img class="button" src="/media/img/player/btn/showme.png" />
</a>

HTML

This is our JavaScript that places Flowplayer into the container. This demo is configured for MaxCDN which offers full support for pseudostreaming.

$f("lighty", "http://releases.flowplayer.org/swf/flowplayer-3.2.18.swf", {
 
// configure clip to use "lighthttpd" plugin for providing video data
clip: {
url: 'http://p.demo.flowplayer.netdna-cdn.com/vod/demo.flowplayer/Extremists.flv',
provider: 'lighttpd'
},
 
// streaming plugins are configured normally under the plugins node
plugins: {
lighttpd: {
url: "flowplayer.pseudostreaming-3.2.13.swf"
}
}
});

JavaScript

If you have a lighttpd server, this works out-of-the box without any extra configuration settings for the provider. The clip just has the provider property that refers to the provider's name used in the plugins list. You can name the plugin anything you want; I've used the name 'lighttpd' above because in this example I happened to be streaming from lighttpd.

Preparing your movie files for pseudostreaming

Having FLV or H.264 available does not nessessarily mean that your video files are ready for pseudostreaming. There are a few requirements for your video files. The most important thing is to have enough keyframes.

Keyframes

Keyframes are complete video frames (or images) which are inserted at a given interval into a video clip. The frames between the keyframes are 'partial' as they need other frames (reference frames) to be displayed. The interval might decrease to cater for scene changes and high motion scenes. In pseudostreaming, the user can only seek to a location where there is a complete keyframe. If you don't have enough keyframes your video is not well-suited for fine-grained seeking. With a good encoding software you can set the keyframe interval, minimum keyframe interval and the sensitivity to scene changes.

In ffmpeg the keyframe interval is controlled by the g- flag (default: 250; for a video with 25 frames per second that means one keyframe every 10 seconds). A smaller value leads to more keyframes and either a larger transmission bitrate (file size increases) or less quality. You have to make compromise between compression quality and the desired granularity for seeking.

FLV files and metadata

If you are streaming FLV files instead of H.264 files you must have so-called FLV metadata on your file. This metadata contains the keyframe information in XML format. If this metadata is missing your video file will act like a normal HTTP progressive download.

You can inject the metadata with a small program called flvtool2. This simple command line command will do the job:

flvtool2 -U <video_file>.flv

Bash

Without this magic touch you cannot make random seeks to your FLV file. What this actually does is it makes keyframe metadata available for Flowplayer. When the user seeks in the timeline, the player retrieves the closest keyframe position from the metadata and passes it to the server. The server then serves the file starting from that position.

Seeking with byte-range requests

This plugin supports random seeking in the video timeline using byte-range requests. Most HTTP/1.1 capable web servers support this kind of requests by default. Make sure the HTTP servers hosting your media files support byte-range requests, if you choose to use this feature. Additionally a socket policy file server needs to be installed. Byte-range requests are enabled by adding rangeRequests: true to the plugin configuration.

Configuring the query string

When byte-range requests are not used, a query string is used to pass the seek target position to the web server. The default parameter the pseudostreaming provider uses for the start time is simply start. The value of this parameter holds the seek target file position and it needs to be compatible with the server's streaming module. You can configure the plugin to use a different parameter name for the keyframe number. You can also add more information to the query if needed. Here we use a target variable to hold the keyframe number and add one custom property called secretToken, assuming that we have a custom server-script that implements token-based protection of video files:

plugins: {
lighttpd: {
url: "flowplayer.pseudostreaming-3.2.13.swf",
 
// use ${start} as a placeholder for the target keyframe
queryString: escape('?target=${start}&secretToken=1235oh8qewr5uweynkc')
}
}

JavaScript

The queryString value is escaped so that the special characters in it get passed correctly to the player.

Download

flowplayer.pseudostreaming-3.2.13.swf

just the working flash file to get you going

flowplayer.pseudostreaming-3.2.13.zip

working flash file (swf) + README.txt and LICENSE.txt

flowplayer.pseudostreaming-3.2.13-src.zip

source code

Please right-click and choose "Save link as..." (or similar)

Note: For XSS security reasons Flash plugins must be located at and loaded from the same domain as the core player flowplayer-3.2.18.swf.

This is a Flash plugin, and its features are therefore not available on iOS. For iOS please consult the ipad plugin.

See the version history for this tool.

Found a bug?

If you encounter problems with this script, please turn to the Flowplayer Flash plugin forum with a link to a minimal sample page (no extra html, css, javascript) demonstrating the issue.