Warning: HTML preview using PygmentsRenderer failed (TypeError: function() takes at least 2 arguments (0 given))

source: trunk/fl5/doc/publishers/httpstreaming.rst @ 1280

Revision 1280, 12.6 KB checked in by jeroen, 4 years ago (diff)

fixed a bug in RTMPT error handling. Fixed a bug in HTTP continuous bitrate switching. Fixed a bug for playlist PNG rollovers without itemActive element. Added logic for hiding the image/description of playlist buttons when the button is <40px high or <240px wide. Added RST documentation on HTTP _droppedframes, HTTP DVR, RTMP DVRCast, RTMP _droppedframes, RTMP Tunneling and small playlist button element hiding.

Line 
1.. _httpstreaming:
2
3HTTP Pseudostreaming
4====================
5
6Both MP4 and FLV videos can be played back with a mechanism called *HTTP Pseudostreaming*. This mechanism allows your viewers to seek to not-yet downloaded parts of a video. Youtube is an example site that offers this functionality. HTTP pseudostreaming is enabled by setting the :ref:`option <options>` *provider=http* in your player.
7
8HTTP pseudostreaming combines the advantages of straight HTTP downloads (it passes any firewall, viewers on bad connections can simply wait for the download) with the ability to seek to non-downloaded parts. The drawbacks of HTTP Pseudostreaming compared to Flash's official :ref:`rtmpstreaming` are its reduced security (HTTP is easier to sniff than RTMP) and long loading times when seeking in large videos (> 15 minutes).
9
10HTTP Pseudostreaming should not be confused with HTTP Dynamic Streaming. The latter is a brand-new mechanism solely supported by the Flash Plugin 10.1+ that works by chopping up the original video in so-called *chunks* of a few seconds each. The videoplayer seamlessly glues these chunks together again. The JW Player does **not yet** support HTTP Dynamic Streaming.
11
12
13Servers
14-------
15
16HTTP Pseudostreaming does not work by default on any webserver. A serverside module is needed to enable it. Here are the two most widely used (and open source) modules for this:
17
18* The `H264 streaming module <http://h264.code-shop.com/trac/wiki>`_ for Apache, Lighttpd, IIS and NginX. It supports MP4 videos.
19* The `FLV streaming module <http://blog.lighttpd.net/articles/2006/03/09/flv-streaming-with-lighttpd mod_flv_streaming module>`_ for Lighttpd. It supports FLV videos.
20
21Several CDN's (Content Delivery Networks) support HTTP Pseudostreaming as well. We have done succesfull tests with `Bitgravity <http://www.bitgravity.com>`_, `CDNetworks <http://www.cdnetworks.com>`_, `Edgecast <http://www.edgecastcdn.com>`_ and `Limelight <http://llnw.com>`_.
22
23In addition to using a serverside module, pseudostreaming can be enabled by using a serverside script (in e.g. PHP or .NET). We do not advise this, since such a script consumes a lot of resources, has security implications and can only be used with FLV files. A much-used serverside script for pseudostreaming is `Xmoov-PHP <http://xmoov.com/xmoov-php/>`_.
24
25
26Mechanism
27---------
28
29Under the hood, HTTP pseudostreaming works as follows:
30
31When the video is initially loaded, the player reads and stores a list of *seekpoints* as part of the video's metadata. These seekpoints are offsets in the video (both in seconds and in bytes) at which a new *keyframe* starts. At these offsets, a request to the server can be made.
32
33When a user seeks to a not-yet-downloaded part of the video, the player translates this seek to the nearest seekpoint. Next, the player does a request to the server, with the seekpoint offset as a parameter. For FLV videos, the offset is always provided in bytes:
34
35.. code-block:: html
36
37   http://www.mywebsite.com/videos/bbb.flv?start=219476905
38
39For MP4 videos, the offset is always provided in seconds:
40
41.. code-block:: html
42
43   http://www.mywebsite.com/videos/bbb.mp4?starttime=30.4
44
45The server will return the video, starting from the offset. Because the first frame in this video is a keyframe, the player is able to correctly load and play it. Should the server have returned the video from an arbitrary offset, the player would not be able to pick up the stream and the display would only show garbage.
46
47.. note::
48
49     Some FLV encoders do not include seekpoints metadata when encoding videos. Without this data, HTTP Pseudostreaming will not work. If you suspect your videos to not have metadata, use our `Metaviewer plugin <http://www.longtailvideo.com/addons/plugins/64/Metaviewer>`_ to inspect the video. There should be a *seekpoints* or *keyframes* list. If it is not there, use the `FLVMDI tool <http://www.buraks.com/flvmdi/>`_ to parse your FLV videos and inject this metadata.
50
51
52Startparam
53----------
54
55When the player requests a video with an offset, it uses *start* as the default offset parameter:
56
57.. code-block:: html
58
59   http://www.mywebsite.com/videos/bbb.flv?start=219476905
60   http://www.mywebsite.com/videos/bbb.mp4?start=30.4
61
62This name is most widely used by serverside modules and CDNs. However, sometimes a CDN uses a different name for this parameter. In that case, use the option *http.startparam* to set a custom offset parameter name. Here are some examples of CDNs that use a different name:
63
64* The `H264 streaming module <http://h264.code-shop.com/trac/wiki>`_ uses *http.startparam=starttime* for MP4 videos.
65* `Bitgravity <http://www.bitgravity.com>`_ uses *http.startparam=apstart* for FLV videos and *http.startparam=starttime* for MP4 videos.
66* `Edgecast <http://www.edgecastcdn.com>`_ uses *http.startparam=ec_seek* for both FLV and MP4 videos (presuming bytes for FLV and seconds for MP4).
67* `Limelight <http://llnw.com>`_ uses *http.startparam=fs* for FLV videos.
68
69Here's what an example SWFObject :ref:`embed code <embedding>` looks like when both HTTP Pseudostreaming and a custom start parameter is enabled:
70
71.. code-block:: html
72
73   <div id='container'>The player will be placed here</div>
74
75   <script type="text/javascript">
76     var flashvars = {
77       file:'http://bitcast-a.bitgravity.com/botr/bbb.mp4',
78       provider:'http',
79       'http.startparam':'starttime'
80     };
81
82     swfobject.embedSWF('player.swf','container','480','270','9.0.115','false', flashvars,
83      {allowfullscreen:'true',allowscriptaccess:'always'},
84      {id:'jwplayer',name:'jwplayer'}
85     );
86   </script>
87
88
89
90Playlists
91---------
92
93HTTP Pseudostreaming can also be enabled in playlists, by leveraging the :ref:`JWPlayer namespace <playlistformats>`. Both the *provider* and *http.startparam* options can be set for every entry in a playlist. In this case, you don't have to set them in the embed code (just point the *file* to your playlist).
94
95Here's an example, an RSS feed with a single video:
96
97.. code-block:: xml
98
99   <rss version="2.0" xmlns:jwplayer="http://developer.longtailvideo.com/">
100     <channel>
101       <title>Playlist with HTTP Pseudostreaming</title>
102   
103       <item>
104         <title>Big Buck Bunny</title>
105         <description>Big Buck Bunny is a short animated film by the Blender Institute,
106            part of the Blender Foundation.</description>
107         <enclosure url="http://myserver.com/botr/bbb.mp4" type="video/mp4" length="3192846" />
108         <jwplayer:provider>http</jwplayer:provider>
109         <jwplayer:http.startparam>apstart</jwplayer:http.startparam>
110   
111       </item>
112     </channel>
113   </rss>
114
115Instead of the *enclosure* element, you can also use the *media:content* or *jwplayer:file* element. More info in :ref:`playlistformats`.
116
117.. note::
118
119   Do not forget the **xmlns** at the top of the feed. It is needed by the player (and any other feed reader you might use) to understand the *jwplayer:* elements.
120
121
122
123Bitrate Switching
124-----------------
125
126Like :ref:`rtmpstreaming`, HTTP Pseudostreaming includes the ability to dynamically adjust the video quality for each individual viewer. We call this mechanism *bitrate switching*.
127
128To use bitrate swiching, 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 below). The player recognizes the various *levels* of your video and automatically selects the highest quality one that:
129
130* Fits the *bandwidth* of the server » client connection.
131* Fits the *width* of the player's display (or, to be precise, is not more than 20% larger).
132* Does not result in more than 25% of *frames dropped* at any time (for example, if your video is 30fps, a level that results in 8fps dropped will get blacklisted).
133
134As a viewer continues to watch the video, the player re-examines its decision (and might switch) in response to certain events:
135
136* On **startup**, immediately after it has calculated the bandwidth for the first time.
137* On a **fullscreen** switch, since the *width* of the display then drastically changes. For example, when a viewer goes fullscreen and has sufficient bandwidth, the player might serve an HD version of the video.
138* On every **seek** in the video. Since the player has to rebuffer-the stream anyway, it takes the opportunity to also check if bandwidth conditions have not changed.
139* In the event where **framedrops** account for more than 25% of the frames of the video. The player continously monitors this metric (ruling out any one-time spikes). When 25% of frames are dropped, the current level is permanently blacklisted - i.e. it will not be used for the remainder of the playback session.
140
141Note that the player will not do a bandwidth switch if extreme bandwidth changes cause the video to re-buffer. In practice, we found such a heuristic to cause continous switching and an awful viewing experience. :ref:`rtmpstreaming` on the other hand, is able to switch seamlessly in response to bandwidth fluctuations.
142
143
144Example
145^^^^^^^
146
147Here is an example bitrate switching playlist (only one item). Note that it is similar to a *regular* HTTP Pseudostreaming playlist, with the exception of the multiple video elements per item. The mRSS extension is the only way to provide these multiple elements including *bitrate* and *width* attributes:
148
149.. code-block:: xml
150
151   <rss version="2.0" xmlns:media="http://search.yahoo.com/mrss/"
152     xmlns:jwplayer="http://developer.longtailvideo.com/">
153     <channel>
154       <title>Playlist with HTTP Bitrate Switching</title>
155   
156       <item>
157         <title>Big Buck Bunny</title>
158         <description>Big Buck Bunny is a short animated film by the Blender Institute,
159            part of the Blender Foundation.</description>
160         <media:group>
161           <media:content bitrate="1800" url="http://myserver.com/bbb-486.mp4"  width="1280" />
162           <media:content bitrate="1100" url="http://myserver.com/bbb-485.mp4" width="720"/>
163           <media:content bitrate="700" url="http://myserver.com/bbb-484.mp4" width="480" />
164           <media:content bitrate="400" url="http://myserver.com/bbb-483.mp4" width="320" />
165         </media:group>
166         <jwplayer:provider>http</jwplayer:provider>
167         <jwplayer:http.startparam>starttime</jwplayer:http.startparam>
168       </item>
169   
170     </channel>
171   </rss>
172
173Some hints:
174
175* The *bitrate* attributes must be in kbps, as defined by the `mRSS spec <http://video.search.yahoo.com/mrss>`_. The *width* attribute is in pixels.
176* It is recommended to order the streams by quality, the best one at the beginning. Most RSS readers will pick this one. The JW Player will do an internal sorting though, so the order is not important for the player.
177* The four levels displayed in this feed are actually what we recommend for bitrate switching of widescreen MP4 videos. For 4:3 videos or FLV videos, you might want to increase the bitrates or decrease the dimensions a little.
178* Some publishers only modify the bitrate when encoding multiple levels. The player can work with this, but modifying both the bitrate + dimensions allows for more variation between the levels (and re-use of videos, e.g. the smallest one for streaming to phones).
179* The *media:group* element here is optional, but it organizes the video links a little.
180
181
182Live DVR Streaming
183------------------
184
185The JW Player supports Live HTTP DVR streaming as offered by the `Bitgravity CDN <http://bitgravity.com>`_. This works as follows:
186
187* The player loads a stream, simply as HTTP download. The server returns a header saying the stream is 1GB+ long, so the Flash plugin will continue downloading the file.
188* On the server side, bytes are appended to the file as they come in from the live ingestion point.
189* The player will start with a duration of 0 seconds for the stream, and then simply use a timer to increase the duration of the stream.
190* Since HTTP video downloads are kept in memory, it is possible to seek back to the point where you began watching the live stream. All that time, the duration will continue to grow, so you'll also be able to instantly jump back to the **live** head again.
191
192Example
193^^^^^^^
194
195The HTTP live DVR streaming mechanism is enabled by setting the player option **http.dvr** to *true*. Here is an example embed code, using the  :ref:`SWFObject embed method <embedding>`:
196
197.. code-block:: html
198
199   <div id='container'>The player will be placed here</div>
200
201   <script type="text/javascript">
202     var flashvars = {
203       file:'http://bglive-a.bitgravity.com/tatamkt/testing/ld',
204       provider:'http',
205       'http.dvr':'true'
206     };
207
208     swfobject.embedSWF('player.swf','container','480','270','9.0.115','false', flashvars,
209      {allowfullscreen:'true',allowscriptaccess:'always'},
210      {id:'jwplayer',name:'jwplayer'}
211     );
212   </script>
213
Note: See TracBrowser for help on using the repository browser.