Stream on-demand media (HTTP)

Search

Prerequisites for streaming on-demand media (HTTP)

To complete these tutorials, use the following software:

For more information, see Supported clients, encoders, codecs, and file formats and Pre-built media players.

Play a single on-demand media file over HTTP

Note:

A community member has created a screencast that walks you through similar steps: Stream on-demand video to Flash and iOS over HTTP.

  1. Install Adobe Media Server 5 and choose to install Apache HTTP Server.

  2. Copy an F4V/MP4 file to the following location:

    rootinstall/webroot/vod

    Note:

    Replace rootinstall with the Adobe Media Server installation folder.

    This tutorial uses the file sample2_1000kbps.f4v which installs with Adobe Media Server to the rootinstall/webroot/vod folder.

  3. (Adobe HTTP Dynamic Streaming) To play the media in Flash Media Playback, do the following:

    1. Open Flash Media Playback in a web browser.

    2. Note:

      Flash Media Playback requires Flash Player 10.1 to support HTTP Dynamic Streaming. To see which version of Flash Player is installed on your computer, go to Adobe Flash Player.

    3. In Video Source, enter:

      http://localhost/hds-vod/sample2_1000kbps.f4v.f4m

      HDS on-demand streaming in Flash Media Playback

      Although the media file lives in the /webroot/vod directory, the URL request is /hds-vod. The path /hds-vod is a <Location> directive in the Apache httpd.conf file. When a request URL begins with /hds-vod, the server looks for media in the /webroot/vod folder and packages it for HTTP Dynamic Streaming. For information about the request URL syntax, see URLs for playing on-demand streams over HTTP.

    4. Select Yes under the question “Are you using HTTP Streaming or Adobe Access 2.0?”.

    5. Clear the text from the Poster frame file location text box.

    6. Click Preview to update the embed code.

    7. Click the Play button to test the code.

    8. To use the player in your own HTML page, copy the embed code and paste it into the body of the page. Flash Media Playback is a compiled SWF file hosted by Adobe. For more information, see Flash Media Playback.

  4. (Adobe HTTP Dynamic Streaming) To play the media in Strobe Media Playback, select VOD and click PLAY STREAM. For more information, see Pre-built media players.

  5. (Apple HTTP Live Streaming) On iOS, enter the following URL in the Safari address bar:

    http://t/hls-vod/sample2_1000kbps.f4v.m3u8

    HLS on-demand streaming in Safari on an iPad

    To test in Safari on Mac OS 10.6, use the following HTML code:

    <video src="http://servername/hls-vod/sample2_1000kbps.f4v.m3u8” controls="controls"></video>
Note:

You can replace localhost and servername with the domain name or IP address of the computer hosting Adobe Media Server. If you’re using a Adobe Media Server hosting provider, they can give you this value.

Play on-demand multi-bitrate media files over HTTP

Note:

A community member, Jody Bleyle has created a screencast that walks you through similar steps: HTTP adaptive bitrate streaming to Flash and iOS.

  1. Install Adobe Media Server 5 and choose to install Apache HTTP Server.

  2. Do one of the following:

    • Encode an F4V/MP4 file at 3 different bitrates.

    • Use the multi-bitrate sample files that install with Adobe Media Server to the rootinstall/webroot/vod folder.

    This tutorial uses the following files installed to the webroot/vod folder:

    rootinstall/webroot/vod/sample1_150kbps.f4v

    rootinstall/webroot/vod/sample1_700kbps.f4v

    rootinstall/webroot/vod/sample1_1500kbps.f4v

  3. (Adobe HTTP Dyanmic Streaming) To stream multi-bitrate content, Flash and AIR media players request a set-level manifest file. This is a .f4m file that contains the location and bitrate of each stream. To create a set-level F4M file, do the following:

      1. Open rootinstall/Adobe Media Server/tools/f4mconfig/configurator/f4mconfig.html in a browser.

      2. Select the f4m file type.

      3. Stream URIs can be absolute or relative to a Base URI. Enter the following for the Base URI:

        http://localhost/hds-vod/

      4. Enter the following for each stream and click Add:

        Stream URI

        Bitrate

        sample1_150kbps.f4v.f4m

        150

        sample1_700kbps.f4v.f4m

        700

        sample1_1500kbps.f4v.f4m

        1500

      5. To view the file, click View Manifest. The manifest file looks like this:

        <manifest xmlns="http://ns.adobe.com/f4m/2.0"> 
  <media href="http://localhost/hds-vod/sample1_150kbps.f4v.f4m" bitrate="150"/> 
  <media href="http://localhost/hds-vod/sample1_700kbps.f4v.f4m" bitrate="700"/> 
  <media href="http://localhost/hds-vod/sample1_1500kbps.f4v.f4m" bitrate="1500"/> 
</manifest>

      6. Click Save Manifest to save the file as sample1.f4m to rootinstall/webroot.

        The media player requests this file from a web server. This tutorial saves the file to rootinstall/webroot, but the file can be served from any location on any webserver. This file does not need to live on Adobe Media Server. This file can have any name.

  4. (Apple HTTP Live Streaming)For multi-bitrate streaming, iOS devices request a set-level M3U8 variant playlist file that contains the location, bitrate, and optionally the codec of each stream. To create a set-level M3U8 file, do the following:

    1. If the File Generator tool isn’t open, double-click rootinstall/Adobe Media Server/tools/f4mconfig/configurator/f4mconfig.html to open it in a browser.

    2. Select the m3u8 file type.

    3. Enter the Stream URI, bitrate, program-ID, and optionally a resolution and codec for each stream. Stream URIs can be absolute or relative. If they are relative, they are relative to the m3u8 file. The program-ID must be the same for each stream.

      Note:

      For information about supported codecs, see Apple HTTP Live Streaming Overview.

      This tutorial uses the following Stream URI settings:

      Stream URI

      Bitrate

      http://servername/hls-vod/sample1_150kbps.f4v

      150

      http://servername/hls-vod/sample1_700kbps.f4v

      700

      http://servername/hls-vod/sample1_1500kbps.f4v

      1500

    4. To view the file, click View Manifest. The m3u8 file looks like this:

      #EXTM3U 
#EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=150000 
http://servername/hls-vod/sample1_150kbps.f4v.m3u8 
#EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=700000 
http://servername/hls-vod/sample1_700kbps.f4v.m3u8 
#EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=1500000 
http://servername/hls-vod/sample1_1500kbps.f4v.m3u8

    5. Click Save Manifest and save the file as sample1.m3u8 to the folder rootinstall/webroot.

      The media player requests this file from a web server. This tutorial saves the file to rootinstall/webroot, but the file can be served from any location on any webserver. This file does not need to live on Adobe Media Server.

  5. (Adobe HTTP Dynamic Streaming) Flash Media Playback does not support set-level manifest files. To play the media, use Strobe Media Playback. Strobe Media Playback is used in the sample video player that installs with Adobe Media Server.

    1. Double-click rootinstall/samples/videoPlayer/videoplayer.html to open it in a browser.

    2. In Video Source, enter the following:

      http://localhost/sample1.f4m

  6. (Apple HTTP Live Streaming) On iOS, enter the following URL in the Safari address bar:

    http://servername/sample1.m3u8

    To test in Safari on Mac OS 10.6, use the following HTML code:

    <video src="http://servername/sample1.m3u8” controls="controls"></video>

    For more information, see HTTP Live Streaming Overview in the iOS Reference Library.

URLs for playing on-demand streams over HTTP

Use the following URLs to play on-demand streams over HTTP:

Client

Live or VOD

Single stream or Adaptive Bitrate

Request URL

Adobe HTTP Dynamic Streaming

VOD

Single stream

http://<ams-dns-or-ip>/hds-vod/<streamname>.<fileextension>.f4m

Apple HTTP Live Streaming

VOD

Single stream

http://<ams-dns-or-ip>/hls-vod/<streamname>.<fileextension>.m3u8

Adobe HTTP Dynamic Streaming

VOD

Adaptive bitrate

The media player requests a set-level manifest file:

http://<webserver-dns-or-ip>/<set-level-manifest>.f4m

The URLs in the set-level manifest point to the individual streams and use the following URL:

http://<ams-dns-or-ip>/hds-vod/<streamname>.<fileextension>.f4m

Apple HTTP Live Streaming

VOD

Adaptive bitrate

The media player requests a set-level variant playlist file:

http://<webserver-dns-or-ip>/<set-level-variant-playlist>.m3u8

The URLs in the set-level variant playlist point to the individual streams and use the following URL:

http://<ams-dns-or-ip>/hls-vod/<streamname>.<fileextension>.m3u8

The path /hds-vod is a <Location> directive in the Apache httpd.conf file. The directive tells the server to look for the content in the rootinstall/webroot/vod folder. It also tells the server to package the content for delivery to Flash and AIR over HTTP (called HTTP Dynamic Streaming or HDS).

The path /hls-vod is a <Location> directive in the Apache httpd.conf file. The directive tells the server to look for the content in the rootinstall/webroot/vod folder. It also tells the server to package the content for delivery to Apple HTTP Live Streaming.

Note:

Apple HTTP Live Streaming supports live and on-demand streaming.

For adaptive bitrate streaming, the client requests a set-level manifest file. For HDS, this file is an .f4m file. For HLS, this file is a .m3u8 file. Set-level manifest files contain the paths to the physical locations of the media files. The paths to the media files must begin with /hds-vod or /hls-vod to tell the server to package them for HTTP.

More information

Content storage (HDS and HLS)

More like this

 Adobe

Get help faster and easier

New user?

Quick links

View all your plans Manage your plans
View quick links
Hide quick links
Adobe MAX 2024

Adobe MAX
The Creativity Conference

Oct 14–16 Miami Beach and online

Register Now

Adobe MAX

The Creativity Conference

Oct 14–16 Miami Beach and online

Register Now
Adobe MAX 2024

Adobe MAX
The Creativity Conference

Oct 14–16 Miami Beach and online

Register Now

Adobe MAX

The Creativity Conference

Oct 14–16 Miami Beach and online

Register Now

Legal Notices    |    Online Privacy Policy