Google Cast

Google Cast™ support in Radiant Media Player

Google Cast™ is a protocol allowing media data to be sent from an emitting device to a receiving device, example a TV. This is generally referred to as "second screen experience" in the industry. The emitting device can be a notebook or an Android tablet for example. This allows for the consuming of media content on a larger screen while keeping the ability to control the content through the emitting device.

Radiant Media Player supports in-player Google Cast casting from Chrome/Opera/MS Edge (Desktop, Android) and mobile applications built with Cordova (Android and iOS) to any Google Cast compatible receiving device. Our implementation is based on Google Cast SDK v3. Information on Google Cast SDK can be found here.

When a Google Cast receiver is detected in range the player will automatically display a casting icon on the top right corner (as part of a player module).

We have developed our own custom Cast Application Framework (CAF) receiver app which is used by default by the player. A Google Cast app receiver runs in a web environment (HTML5, CSS, JavaScript), so to load media content in a Google Cast app receiver your streaming server must be properly CORS configured.

Supported receiving devices

• Chromecast
• Android TV
• Any Google Cast™ compatible receiving device

Assistance for setting up a Chromecast device can be found here.

Supported emitting devices

• Chrome and MS Edge 79+ on Desktop
• Chrome and Opera for Android 5+
• Mobile apps for Android 5+ and iOS 12+ built with Cordova

Google Cast support in an Android or iOS mobile app

For Google Cast support in a mobile application for Android or iOS see our Google Cast for Cordova guide.

Supported features

Below is a non-exhaustive list of features you can expect to be available while using Radiant Media Player in our Google Cast receiver app:

• (1) HLS with CMAF/fmp4 HLS will fail to load (only HLS-TS is supported)
• (2) In-band CEA608/708 captions will fail to display but content can be viewed without captions on CAF receiver
• (3) IAB standard VAST & VMAP ads are supported
• (4) DVR streams will be treated as regular live streams - DVR controls will not be available
• (5) DASH only (HLS with audio-only content will fail to load)

Cast Application Framework (CAF) Receiver app

Our production custom CAF receiver app should cover most generic case-scenario. However you should consider developing your own custom CAF receiver app in the following cases:

• you need to apply your own styling to the CAF player
• you need to implement some other kind of custom behaviour required by your project

In order to assist Radiant Media Player customers with this task, we have published our custom CAF receiver app on GitHub. This can be used as a start point for more advanced use-case. We however cannot provide support for developing a custom CAF receiver as this fall outside our scope of support.

CORS requirements

Our production custom CAF receiver app requires proper CORS setup for streaming to work properly.

You need the following headers: Content-Type,Accept-Encoding, and Range. Note that the last two headers, Accept-Encoding and Range, are additional headers that you may not have needed previously. See this Google documentation page for more information.

Our production custom CAF receiver app is hosted on domain cdn.radiantmediatechs.com. You may also decide to host the custom CAF receiver app on your domain while publishing your own CAF receiver to Google.

Google Cast player settings

Radiant Media Player will automatically detect an in-range Google Cast receiver and will provide in-player casting options when needed.

The following player settings are available:

googleCast: Boolean

Enables or not Google Cast detection. Default: true. This setting is not supported and automatically set to false for the following features: 360° video.

googleCastReceiverAppId: String

Google Cast receiver app id. Since Radiant Media Player 4.7.0 we use a custom Cast Application Framework (CAF) receiver app. Default: 'C899A03E'. If you would rather use Google default receiver app (Receiver v2 app) you can set googleCastReceiverAppId to 'cast-default'.

googleCastAndroidReceiverCompatible: Boolean

Indicates if the app is compatible with an Android Receiver. Should only be set to true if you are specifically targeting an Android Receiver. Default: false.

googleCastAdTagUrl: String

By default the player uses the VAST tag from the adTagUrl setting to display ads on our Google Cast CAF receiver. Using googleCastAdTagUrl lets you define a VAST tag that will only be used on our Google Cast CAF receiver. Default: ''.

googleCastVmapAdsRequest: String

If you want VMAP support on our Google Cast CAF receiver then you must explicitly pass your VMAP tag with this setting. Default: ''.

googleCastEnableUITextDisplayer: Boolean

A flag to enable Shaka Player's DOM-based text renderer, shaka.text.UITextDisplayer on Google Cast receiver application. This can help with displaying some captions. Default: false.

googleCastDisableAds: Boolean

A flag to disable video advertisement on receiving device while keeping it on the sender device. This can be used to troubleshoot issues while playing DRM content with advertisement on Google Cast receiver. Default: false.

googleCastHeaders: Object

Custom headers to be passed to the Google Cast receiver from the player for streaming requests (see manifestRequestHandler and segmentRequestHandler). Default: {}. Example:

googleCastHeaders: {
  'stream-hearder-1': 'valid-1',
  'stream-hearder-2': 'valid-2'
}

googleCastData: Object

Custom data to be passed to the Google Cast receiver from the player. This can be used for advanced customisation of a Google Cast receiver. Default: {}. Example:

googleCastData: {
  'custom-data-1': 123456789,
  'custom-data-2': 'a tale that has not been told yet'
}

Additionally casted WebVTT captions can be customised. See our closed captions documentation for more information.

Player API

When casting is engaged two player exist at the same time: the remote player which lives in the receiver application and the local player which lives in the sender application. When a media is successfully cast from the sender application to the receiver application the local player is paused and its UI controls the remote player. The player API can be used to control the remote player when casting is engaged.

Supported player API events include

• play
• pause
• timeupdate
• durationchange
• volumechange
• castwaiting: content is buffering on Google Cast receiver app
• castplaying: content is playing after buffering on Google Cast receiver app
• castmedialoaded: media has been successfully loaded on receiving device
• castmediaunloaded: media has been successfully unloaded on receiving device and playback may continue on the sender
• castmediaerror: media could not be loaded on receiving device - current casting session ends
• castapiavailable: the Google Cast API has been successfully loaded and is now available. The global Google Cast related variables can now be accessed including window.chrome.cast and window.cast.framework

Supported player API methods include

• play
• pause
• stop
• getPaused
• getVolume
• setVolume
• getMute
• setMute
• seekTo
• getCurrentTime
• getDuration
• getLiveCurrentTime
• getLiveDuration
• setSrc
• destroy
• getCastUrl: returns a String representing the currently cast URL.
• getCastMediaLoaded: returns a Boolean stating if a media is loaded on the receiving application.
• getCastConnected: returns a Boolean stating if the remote player is currently connected to the sender application. Note that in some instances (like when a media ends on the receiving application) the remote player can be connected to the sender application but with no media loaded within it.

Player code examples

Video ads with Google Cast - see this example here

<script src="https://cdn.radiantmediatechs.com/rmp/9.15.19/js/rmp.min.js"></script>
<div id="rmp"></div>
<script>
  const src = {
    hls: 'https://your-hls-url.m3u8'
  };
  const settings = {
    licenseKey: 'your-license-key',
    src: src,
    width: 640,
    height: 360,
    contentMetadata: {
      poster: [
        'https://your-poster-url.jpg'
      ],
      title: 'Video ads demo through Google Cast'
    },
    // Our video ads setting
    ads: true,
    // Upon loading content on Google Cast the adTagUrl will play on receiver device
    adTagUrl: 'https://your-ad-tag-url',
    // if the adTag you are passing is a VMAP adTag make sure to use googleCastVmapAdsRequest
    // so that the CAF receiver can properly display the VMAP ads
    // googleCastVmapAdsRequest: 'https://your-vmap-ad-tag-url'
  };
  const rmp = new RadiantMP('rmp');
  rmp.init(settings);
</script>

DASH Widevine DRM with Google Cast - see this example here

<script src="https://cdn.radiantmediatechs.com/rmp/9.15.19/js/rmp.min.js"></script>
<div id="rmp"></div>
<script>
  const src = {
    dash: 'https://your-dash-widevine-drm-url'
  };
  // Then we set our player settings
  const settings = {
    licenseKey: 'your-license-key',
    src: src,
    width: 640,
    height: 360,
    // passing DRM settings - those settings will automatically be passed to the CAF receiver app
    shakaDrm: {
      servers: {
        'com.widevine.alpha': 'https://your-widevine-license-url'
      }
    },
    // we support passing custom headers for license request
    // and license request with credentials to the CAF receiver
    shakaRequestConfiguration: {
      license: {
        headers: {
          'drm-custom-header': 'abcdefghijklmnopqrstuvwxyz1234156789'
        }
        //credentials: true
      }
    },
    contentMetadata: {
      poster: [
        'https://your-poster-url.jpg'
      ],
      title: 'DASH Widevine DRM demo through Google Cast'
    }
  };
  const rmp = new RadiantMP('rmp');
  rmp.init(settings);
</script>

Support notes

• Google Cast is not supported on the iOS Chrome browser.
• Sender apps must be hosted on a HTTPS environment for Google Cast to work as expected.
• For pages where multiple player instances are present, only the first player instance will get Google Cast casting option/icon. Other players on the page will NOT get Google Cast casting capability. This is because the Google Cast JavaScript API currently does not support multiple instances on the same page.
• Using the destroy API on a player instance and replacing that player instance with a new player instance will cause the new player instance to loose Google Cast casting capability. This is because the Google Cast JavaScript API currently does not support multiple instances on the same page. We recommend using the setSrc API method instead as this method supports changing player sources while keeping Google Cast option available.