Video Delivery: RTMP Streaming

Servers

In order to use RTMP, your webhoster or CDN needs to have a dedicated RTMP webserver installed. There are two major offerings, both supported by the JW Player:

• The Flash Media Server from Adobe is the de facto standard. Since Flash is also developed by Adobe, new video functionalities always find their way in FMS first.
• The Wowza Media Server from Wowza is a great alternative, because it includes support for other streaming protocols than RTMP (for e.g. Shoutcast, the iPad/iPhone or Silverlight).

RTMP servers are not solely used for one-to-many media streaming. They include support for such functionalities as video conferencing, document sharing and multiplayer games. Each of these functionalities is separately set up on the server in what is called an application. Every application has its own URL (typically a subfolder of the root). For example, these might be the path to both an on-demand streaming and live streaming application on your webserver:

rtmp://www.myserver.com/ondemand/
rtmp://www.myserver.com/live/

The JW Player solely supports the basic live, on-demand and dvr streaming applications. There's no support for such things as webcasting, videochat or screen sharing.

Options

To play an RTMP stream in the player, both the streamer and file options must be set. The streamer is set to the server + path of your RTMP application. The file is set to the internal URL of video or audio file you want to stream. Here is an example embed code:

<div id='container'>The player will be placed here</div>

<script type="text/javascript">
  var flashvars = {

    file:'library/clip.mp4',
    streamer:'rtmp://www.myserver.com/ondemand/'
  };

  swfobject.embedSWF('player.swf','container','480','270','9.0.115','false', flashvars,

   {allowfullscreen:'true',allowscriptaccess:'always'},
   {id:'jwplayer',name:'jwplayer'}

  );
</script>

Note that the documentation of RTMP servers tell you to set the file option in players like this:

• For FLV video: file=clip (without the .flv extension).
• For MP4 video: file=mp4:clip.mp4 (with mp4: prefix).
• For MP3 audio: file=mp3:song.mp3 (with mp3: prefix).
• For AAC audio: file=mp4:song.aac (with mp4: prefix).

You do not have to do this with the JW Player, since the player takes care of stripping the extension and/or adding the prefix. If you do add the prefix yourself, the player will recognize it and not modify the URL.

Additionally, the player will leave querystring variables (e.g. for certain CDN security mechanisms) untouched. It basically ignores everything after the ? character. However, because of the way options are loaded into Flash, it is not possible to plainly use querystring delimiters (?, =, &) inside the file or streamer option. This issue can be circumvented by URL encoding these characters.

Note: Amazon Cloudfront's private streaming protocol is an example in which the MP4 URL should be URL Encoded, since the long security hash appended to the video URL can contain special characters.

Playlists

RTMP streams can also be included in playlists, by leveraging the JWPlayer namespace. The streamer option should be set for every RTMP entry in a playlist. You don't have to set them in the embed code (just point the file option to your playlist).

Here's an example, an RSS feed with an RTMP video and audio clip:

<rss version="2.0" xmlns:jwplayer="http://developer.longtailvideo.com/">
  <channel>
    <title>Playlist with RTMP streams</title>

    <item>
      <title>Big Buck Bunny</title>
      <description>Big Buck Bunny is a short animated film by the Blender Institute,
         part of the Blender Foundation.</description>
      <enclosure url="files/bbb.mp4" type="video/mp4" length="3192846" />

      <jwplayer:streamer>rtmp://myserver.com/ondemand</jwplayer:streamer>
    </item>

    <item>
      <title>Big Buck Bunny (podcast)</title>

      <description>Big Buck Bunny is a short animated film by the Blender Institute,
         part of the Blender Foundation.</description>
      <enclosure url="files/bbb.mp3" type="audio/mp3" length="3192846" />

      <jwplayer:streamer>rtmp://myserver.com/ondemand</jwplayer:streamer>
    </item>

  </channel>
</rss>

Instead of the enclosure element, you can also use the media:content or jwplayer:file element. You could even set the enclosure to a regular http download of the video ánd jwplayer:file to the RTMP stream. That way, this single feed is useful for both regular RSS readers and the JW Player. More info in XML Playlist Support.

Live Streaming

A unique feature of RTMP is the ability to do live streaming, e.g. of presentations, concerts or sports events. Next to the player and an RTMP server, one then also needs a small tool to ingest (upload) the live video into the server. There's a bunch of such tools available, but the easiest to use is the (free) Flash Live Media Encoder. It is available for Windows and Mac.

A live stream can be embedded in the player using the same options as an on-demand stream. The only difference is that a live stream has no file extension. Example:

<div id='container'>The player will be placed here</div>

<script type="text/javascript">
  var flashvars = {
    file:'livepresentation',

    streamer:'rtmp://www.myserver.com/live/'
  };

  swfobject.embedSWF('player.swf','container','480','270','9.0.115','false', flashvars,

   {allowfullscreen:'true',allowscriptaccess:'always'},
   {id:'jwplayer',name:'jwplayer'}

  );
</script>

<div id='container'>The player will be placed here</div>

<script type="text/javascript">
  var flashvars = {

    file:'livepresentation',
    streamer:'rtmp://www.myserver.com/live/',
    'rtmp.subscribe':'true'

  };

  swfobject.embedSWF('player.swf','container','480','270','9.0.115','false', flashvars,

   {allowfullscreen:'true',allowscriptaccess:'always'},
   {id:'jwplayer',name:'jwplayer'}

  );
</script>

<div id='container'>The player will be placed here</div>

<script type="text/javascript">
  var flashvars = {
    file:'livepresentation',

    streamer:'rtmp://www.myserver.com/live/',
    'rtmp.dvr':'true', 
  };

  swfobject.embedSWF('player.swf','container','480','270','9.0.115','false', flashvars,

   {allowfullscreen:'true',allowscriptaccess:'always'},
   {id:'jwplayer',name:'jwplayer'}

  );
</script>

Dynamic Streaming

Like HTTP Pseudostreaming, RTMP Streaming includes the ability to dynamically optimize the video quality for each individual viewer. Adobe calls this mechanism dynamic streaming. This functionality is supported for FMS 3.5+ and Wowza 2.0+.

To use dynamic streaming, you need multiple copies of your MP4 or FLV video, each with a different quality (dimensions and bitrate). These multiple videos are loaded into the player using an mRSS playlist (see example right below), or SMIL file (see: loadbalancing). The player recognizes the various levels of your video and automatically selects the highest quality one that:

• Fits the bandwidth of the server » client connection.
• Fits the width of the player's display (or, to be precise, is not more than 20% larger).
• Results in less than 25% *frames dropped* at any point in time (e.g. 7fps for a video that is 25fps).

As a viewer continues to watch the video, the player re-examines its decision (and might switch) in response to certain events:

• On a bandwidth increase or decrease - the bandwidth is re-calculated at an interval of 2 seconds.
• On a resize of the player. For example, when a viewer goes fullscreen and has sufficient bandwidth, the player might serve an HD version of the video.
• On a framedrop of more than about 7 or 8 fps.

Framedrop is continously monitored. Spikes are ruled out by taking 5-second averages. Once a quality level results in too large a framedrop, it will be blacklisted (made unavailable) for 30 seconds. After 30 seconds, it will be made available again, since the framedrop might be a result of a very decoding-heavy section in the video or external forces (e.g. the user opening Microsoft Office).

Unlike with HTTP Pseudostreaming, a dynamic streaming switch is unobtrusive. There'll be no re-buffering or audible/visible hickup. It does take a few seconds for a switch to occur in response to a bandwidth change / player resize, since the server has to wait for a keyframe to do a smooth switch and the player always has a few seconds of the old stream in its buffer. To keep stream switches fast, make sure your videos are encoded with a small (2 to 4 seconds) keyframe interval.

As of version 5.6 of the JW Player, dynamic streaming works in combination with load balancing and in combination with the FCSubscribe functionality. In previous versions, combining these features may result in unreliable switching behaviour.

<rss version="2.0" xmlns:media="http://search.yahoo.com/mrss/"
  xmlns:jwplayer="http://developer.longtailvideo.com/">

  <channel>
    <title>Playlist with RTMP Dynamic Streaming</title>

    <item>
      <title>Big Buck Bunny</title>

      <description>Big Buck Bunny is a short animated film by the Blender Institute,
         part of the Blender Foundation.</description>
      <media:group>
        <media:content bitrate="1800" url="videos/Qvxp3Jnv-486.mp4"  width="1280" />

        <media:content bitrate="1100" url="videos/Qvxp3Jnv-485.mp4" width="720"/>
        <media:content bitrate="700" url="videos/Qvxp3Jnv-484.mp4" width="480" />

        <media:content bitrate="400" url="videos/Qvxp3Jnv-483.mp4" width="320" />
      </media:group>

      <jwplayer:streamer>rtmp://www.myserver.com/ondemand/</jwplayer:streamer>
    </item>

  </channel>
</rss>

Load Balancing

For high-volume publishers who maintain several RTMP servers, the player supports load-balancing by means of an intermediate XML file. This is used by e.g. the Highwinds and Streamzilla CDNs. Load balancing works like this:

• The player first requests the XML file (typically from a single master server).
• The server returns the XML file, which includes the location of the RTMP server to use (typically the server that's least busy) and the location of the videos on this server.
• The player parses the XML file, connects to the server and starts the stream.

<smil>
  <head>
    <meta base="rtmp://server1234.mycdn.com/ondemand/" />
  </head>
  <body>

    <video src="library/myVideo.mp4" />
  </body>
</smil>

<div id='container'>The player will be placed here</div>

<script type="text/javascript">
  var flashvars = {

    file:'http://www.mycdn.com/videos/myVideo.mp4.xml',
    provider:'rtmp',
    'rtmp.loadbalance':'true'

  };

  swfobject.embedSWF('player.swf','container','480','270','9.0.115','false', flashvars,

   {allowfullscreen:'true',allowscriptaccess:'always'},
   {id:'jwplayer',name:'jwplayer'}

  );
</script>

<rss version="2.0" xmlns:jwplayer="http://developer.longtailvideo.com/">
  <channel>
    <title>Playlist with RTMP loadbalancing</title>

    <item>
      <title>Big Buck Bunny (podcast)</title>
      <description>Big Buck Bunny is a short animated film by the Blender Institute,
         part of the Blender Foundation.</description>
      <enclosure url="http://www.mycdn.com/videos/bbb.mp3.xml" type="text/xml" length="185" />

      <jwplayer:provider>rtmp</jwplayer:provider>
      <jwplayer:rtmp.loadbalance>true</jwplayer:rtmp.loadbalance>
    </item>

  </channel>

</rss>

<smil>
  <head>
    <meta base="rtmp://server1234.mycdn.com/ondemand/" />
  </head>
  <body>
    <switch>
      <video src="videos/Qvxp3Jnv-486.mp4" system-bitrate="1800000" width="1280" />
      <video src="videos/Qvxp3Jnv-485.mp4" system-bitrate="1100000" width="720"/>
      <video src="videos/Qvxp3Jnv-484.mp4" system-bitrate="700000" width="480"/>
      <video src="videos/Qvxp3Jnv-483.mp4" system-bitrate="400000" width="320"/>
    </switch>
  </body>
</smil>