Radiant Media Player

Audio-only streaming with HLS



Supported streaming formats for audio-only

HTML5 Flash

Audio-only streaming support is new with Radiant Media Player 3.0.0

Radiant Media Player supports audio-only streaming in HLS and MPEG-DASH with flexible configuration options.

  • HLS to HTML5 video
  • MPEG-DASH to HTML5 video
  • HLS to Flash (fallback)

The only audio format currently supported is AAC either with HLS or MPEG-DASH. Live and on-demand audio-only streaming is supported. You can control the player in audio-only streaming mode with the player API as well. Most other audio-compatible player configuration options should work with an audio-only stream though we encourage you to test your implementation before going into production.

Browser support and other streaming requirements are the same as stated in our streaming documentation page for each protocol.

Audio-only streaming with HTTP progressive download or in MP3 format are not supported.

Only the 's1' & 's2' player skins are currently supported for audio-only streaming.


Player setup


HLS audio-only streaming with a poster

Player code example

<!-- Include Radiant Media Player JavaScript file in your <body> or <head> -->
<script src="https://cdn.radiantmediatechs.com/rmp/v3/latest/js/rmp.min.js"></script>
<!-- Set up your wrapper div with its unique id -->
<div id="rmpPlayer"></div>
<!-- Set up player configuration options -->
<script>
// First we specify bitrates to feed to the player
var bitrates = {
  hls: 'https://streamingrmp-1479.kxcdn.com/vod/smil:audio.smil/playlist.m3u8'
};
// Then we set our player settings
var settings = {
  licenseKey: 'your-license-key',
  bitrates: bitrates,
  width: 640,
  height: 360,
  audioOnly: true, // The magic happens here
  poster: 'https://www.radiantmediaplayer.com/images/poster-rmp-showcase.jpg'
};
// Reference to the wrapper div (unique id)
var elementID = 'rmpPlayer';
// Create an object based on RadiantMP constructor
var rmp = new RadiantMP(elementID);
// Initialization ... test your page and done!
rmp.init(settings);
</script>

Here the player will render the audio along with a poster in a 640x360 player. Note that the player features a layout designed to fit the audio-only format.


HLS audio-only streaming without a poster (control bar only)

First an example:

Player code for the above example:

<!-- Include Radiant Media Player JavaScript file in your <body> or <head> -->
<script src="https://cdn.radiantmediatechs.com/rmp/v3/latest/js/rmp.min.js"></script>
<!-- Set up your wrapper div with its unique id -->
<div id="rmpPlayer"></div>
<!-- Set up player configuration options -->
<script>
// First we specify bitrates to feed to the player
var bitrates = {
  hls: 'https://streamingrmp-1479.kxcdn.com/vod/smil:audio.smil/playlist.m3u8'
};
// Then we set our player settings
var settings = {
  licenseKey: 'your-license-key',
  bitrates: bitrates,
  backgroundColor: '212121',
  width: 640,
  height: 38, // This height of 38px is a requirement for audio-only streaming without a poster
  audioOnly: true // The magic happens here
};
// Reference to the wrapper div (unique id)
var elementID = 'rmpPlayer';
// Create an object based on RadiantMP constructor
var rmp = new RadiantMP(elementID);
// Initialization ... test your page and done!
rmp.init(settings);
</script>

Here the player will render the audio in a player featuring only a control bar (640x38). Note that the player features a layout designed to fit the audio-only format.


HLS with ID3 tags

Using our HLS to HTML5 implementation for desktop and mobile the player can extract ID3 tags from an HLS stream. See here for complete documentation.


Live MPEG-DASH audio-only streaming without a poster (control bar only)

<!-- Include Radiant Media Player JavaScript file in your <body> or <head> -->
<script src="https://cdn.radiantmediatechs.com/rmp/v3/latest/js/rmp.min.js"></script>
<!-- Set up your wrapper div with its unique id -->
<div id="rmpPlayer"></div>
<!-- Set up player configuration options -->
<script>
// First we specify bitrates to feed to the player
var bitrates = {
  dash: 'http://vm2.dashif.org/livesim/testpic_2s/audio.mpd'
};
// Then we set our player settings
var settings = {
  licenseKey: 'your-license-key',
  bitrates: bitrates,
  isLive: true,
  backgroundColor: '212121',
  width: 640,
  height: 38, // This height of 38px is a requirement for audio-only streaming without a poster
  audioOnly: true // The magic happens here
};
// Reference to the wrapper div (unique id)
var elementID = 'rmpPlayer';
// Create an object based on RadiantMP constructor
var rmp = new RadiantMP(elementID);
// Initialization ... test your page and done!
rmp.init(settings);
</script>
Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 3.0 License.