Radiant Media Player

Web-based mobile applications support



Documentation sections


Scope of support for building web-based mobile applications with Radiant Media Player

You can use Radiant Media Player to build media-oriented web-based mobile applications for Android and iOS. The player is equipped with various optimisations, notably file:// protocol support, to work in the following environments:

  • Applications built with Apache Cordova: this includes support for frameworks and tools like Ionic or PhoneGap. Those applications require file:// protocol.
  • Standalone web applications.
  • WebView created from native code: for example when viewing content through Facebook in-app browser.

Using Radiant Media Player in a Cordova-based application is only available for PLATFORM edition customers as FILE protocol support is required. Using Radiant Media Player within a standalone application or a WebView through the HTTP protocol is available for all player editions.


Supported OS

Radiant Media Player can be used to build web-based mobile applications for the following mobile OS:

  • Android 5+
  • iOS 9+

It is possible that Radiant Media Player used in web-based mobile applications would work on previous versions of Android or iOS but they are not officially supported.

Note about Android 4.4 support: while we do support Chrome for Android 4.4.*, we do not officially support Android 4.4.* WebView. Android 4.4.* WebView are known to have several issues with HTML5 video playback including seek issues for on-demand content, fullscreen/aspect ratio issues, unstable media source extensions, feature detection issues ... Most of those issues were fixed with Android 5 WebView. While technically Radiant Media Player should play in Android 4.4.* WebView, we cannot guarantee the player will work as expected.


Supported features

All player features available for the mobile web are generally available with Radiant Media Player for web-based mobile applications. Below is a non-exhaustive list of features you can expect to be available or not when using Radiant Media Player in a web-based mobile application:

Feature Android iOS
HLS
AES HLS
DASH
Progressive download
HTML5 video ads (1)
VOD & Live streaming
DVR streaming (2)
360 video
Autoplay (with audio) support (3)
Mobile-first & responsive UI
Player API
Widevine DRM (DASH or HLS) (4)
ClearKey DRM (DASH or HLS)
FairPlay DRM (HLS)
Google Cast (5)
AirPlay
Offline playback (6)

Video ads support in mobile apps

We do support using video ads in an iOS or Android web-based mobile app. It should be noted that since the HTML5 Google IMA SDK is not officially supported in an iOS or Android WebView, the preferred solution is to use our VAST parser rmp-vast. However if you are using Google Ads (DFP, AdSense for Video, AdX) we still recommend using the IMA SDK even in OS or Android WebView. See this section for more information on using the IMA SDK in a WebView. The VAST parser can be selected with player setting adParser set to 'ima' or 'rmp-vast'.


Widevine DRM support in Android mobile apps

Using Widevine DRM in an Android WebView requires the Widevine CDM to be available in this WebView (this is generally available since Android 5). However, due to a recent inconsistency between WebView and Android versions the required EME API may be missing in some Android versions with WebView using the file protocol. We have confirmed Widevine DRM/EME is working properly in an Android 8+ WebView, but previous versions of Android may or may not work until Google finds a solution for the reported issue.

It is technically possible to make Widevine DRM work in Android versions before Android 8, but one must use a "https hosted" app in Cordova. This means setting <content src="https://app-url"> instead of <content src="index.html"> in your config.xml file. As such the WebView properly recognise the context as "secured" and allows for Widevine DRM playback. However this comes with significant limitations like unavailability to manage offline states for the app.


Offline playback

Since Radiant Media Player 4.6.0 we support offline playback of media content (HLS, DASH or progressive download) within an Android or iOS web-based application. In order to be displayed, offline content must be locally stored within the application (like in an assets/ or media/ folder). The player must point to this locally stored resource in order to start playback (through the usual bitrates setting). The mechanism where online media content could be dynamically saved on the device is not covered by Radiant Media Player.

Supported features:

  • Playback of HLS, DASH, progressive download on-demand content
  • Player settings and API that do not require an Internet connection are generally available
  • Video ads: only supported with rmp-vast (IMA SDK not available). In this case the adTag must be hosted locally within the app. The adTagUrl setting must point to this local resource. VAST metrics will not be ping since the device is offline.

Unsupported features:

  • Offline DRM licenses
  • Live & DVR streaming: those types of content require an Internet connection to run

Offline player starts are saved locally and push to our logging servers when an Internet connection becomes available.


Google Cast support in Android web-based application

As stated in the Cast SDK forum Google Cast casting from a Chromium WebView is not supported. Hence we do not support Google Cast casting from Radiant Media Player in an Android web-based mobile application. This does not mean it is not possible though. Google Cast support may be provided through a Cordova plugin. Various solutions are available on GitHub and while we do not recommend any specific solution, this one seems to be popular. When using such a plugin you would need to build your own cast and remote controlling logic outside the player.

Google Cast support through Radiant Media Player is available in standalone web applications or in Chrome for Android.


Using Radiant Media Player in a Cordova-based application

Refer to our Working with Apache Cordova guide.


Using Radiant Media Player in a Ionic-based application

Refer to our Working with Ionic Framework guide.


Using Radiant Media Player in a PhoneGap-based application

Refer to our Working with Adobe PhoneGap guide.


Using Radiant Media Player in a standalone web application

A standalone web application is designed to look and behave in a way similar to a native application - for example, it is scaled to fit the entire screen of a device. You can tailor your web application for Safari on iOS or Chrome for Android even further, by making it appear like a native application when the user adds it to the "Home screen".

When embedded in a standalone web application the player adds the rmp-standalone class to its container (HTML element with the rmp-container class). You can also query the player API isStandalone method which should return a boolean clearly stating if the player is currently used in a standalone web-app or not.


iOS

Apple has documentation on how to configure standalone web applications. Notably this is achieved by adding the following meta tag to your HTML page:

<meta name="apple-mobile-web-app-capable" content="yes">

Android

For Chrome on Android Google has a guide for Installable Web Apps with the Web App Manifest. This approach follows the W3C Web App Manifest specification which is also available in Firefox.


Web-based mobile apps specific player settings

The following settings should only be used in the context of a web-based mobile apps:

appName: String

This setting allows to set a unique application name when developing a web-based mobile application with Radiant Media Player. This application name will be used as an identifier in our back-end reporting section. It can be read with API method getAppName. Default: ''.


App white-listing (PLATFORM Edition)

By default you can use your platform edition license key on any app requiring the FILE protocol. However you may want and it is recommended to lock down usage of your license key on a limited number of apps.

Similarly to white-listing domains for usage on web sites you can white-list mobile/OTT apps (when rendered through the FILE protocol). This is a 2-steps process.


Add white-listing information in our back-end

First you need to tell us what is the name of your app(s) you want to white-list. This is done in our back-end in the PLATFORM > Black/white listing tab. You need to update the white-list JSON file that you upload with the name of your app(s). Example:

{
  "whitelist": [
    "site1.com",
    "site2.net",
    "site3.info"
  ],
  "appWhitelist": [
    "mySuperApp",
    "myOtherCoolApp"
  ]
}

Note that the appWhitelist Array comes in supplement to the whitelist Array. Adding your app name to the whitelist Array will have no effect, you need to create a separated entry under appWhitelist Array. Your app name could be anything but as a rule of thumb try to keep it simple, descriptive and avoid spaces or special characters.


Pass white-list data to the player

In order to verify the validity of an app name uploaded to our back-end the player must be able to identify the app name within the app. This is done by using a custom attribute data-rwlan on the player container:

<div id="rmpPlayer" data-rwlan="bXlTdXBlckFwcA=="></div>

The custom attribute data-rwlan value will be recognised by the player and compared to white-list data held in our back-end to authorise (or not) the player to function within your app. The data-rwlan value must be a string containing the Base64 representation of your app name. With JavaScript this can be obtained with the btoa method. In the example above bXlTdXBlckFwcA== is the string Base64 representation of app name: mySuperApp.


App white-listing considerations

App white-listing will only come into effect when the FILE protocol is in use. Where the HTTP protocol is in use the player will rely on classic domain-based white/black listing. Even if you only use the player in a web-based mobile app we recommend to always set "whitelist" (or "blacklist") and "appWhitelist" in your JSON file.

If an app white-list is available in our back-end for your PLATFORM Edition license key but the player container does not have a data-rwlan attribute or if the data-rwlan value does not match an app name registered in our back-end for your license key, the player will not work within the targeted app.

Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 3.0 License.