Building A Mobile Video App With Web Technologies

Scope of support

You can use our HTML5 video player to build video-oriented native mobile apps for Android and Apple devices (iOS, iPadOS). The player can be used in the following environments:

• Mobile apps for Android and Apple devices built with Ionic and Capacitor - see our guide
• Mobile apps for Android and Apple devices built with Flutter - see our guide
• Mobile apps for Android and Apple devices built with Apache Cordova - see our guide
• Mobile apps for Android and Apple devices built with WebView created from native code
• Standalone web applications

Our player has been tested and optimised to work in the above environments to provide a video experience that can match apps built with native SDK - minus the cost and headaches of having to manage native SDK.

Using Radiant Media Player to build native Android or iOS app is only available for PLATFORM edition customers.

Supported OS

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

• Android 6+
• iOS 12+ (WKWebView)
• iPadOS 13+ (WKWebView)

Supported features

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

• (1) See the video ads support in mobile apps section
• (4) See the Widevine DRM support in Android mobile apps
• (5) Only available in Apache Cordova based application - see the guide
• (6) Requires iOS 17+
• (7) Support for FairPlay DRM (HLS) in a WebView starts at iOS 13+ and iPadOS 13+

Video ads support in mobile apps

We do support using video ads in an iOS, iPadOS or Android mobile app built with Ionic, Flutter, Apache Cordova or WebView. It should be noted that since the HTML5 Google IMA SDK is not officially supported in iOS or Android WebView, the preferred solution is to use our VAST manager rmp-vast. See this section for more information on limitations when using the Google IMA HTML5 SDK in a mobile app. The VAST manager can be selected with player setting adParser set to 'rmp-vast'.

Widevine DRM support in Android apps

It is perfectly possible to play Widevine DRM encrypted content in an Android apps built with Ionic, Flutter, Apache Cordova or WebView. Here are the requirements:

• Widevine CDM available in that WebView - this is typically the case on Android 7+. For Android versions before version 7, availability may vary
• Player must be used in a secure context: if you are using a remote Web App, this Web App needs to be hosted with HTTPS. For locally hosted Web App, localhost offers a secure context
• Permission needs to be granted for playback of DRM encrypted content: for Ionic and Apache Cordova this is enabled by default - for Flutter and WebView built from native codes this needs to be explicitly enabled

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.

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="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.

Mobile apps specific player settings

The following settings should only be used in the context of a mobile app:

appName: String

This setting allows to set a unique app name with Radiant Media Player. This app name will then be used as an unique identifier in our back-end reporting section. It can be read with getter appNameConfiguration. Default: ''.

App allowlisting (PLATFORM Edition)

Refer to our documentation for PLATFORM Edition allowlisting and denylisting.