The <a href="https://developers.google.com/cast/docs/overview" target="_blank">Google Cast</a> framework enables a viewer to stream content to a compatible TV or sound system. By enabling the Google Cast framework in your app, a viewer can use a cast button to stream your content to a Cast-enabled device on a shared network.

This article explains two integrations:

  • Enabling the Google Cast framework for the JW web player

  • Casting video content protected by Studio DRM with the JW Platform

ο»Ώ

VUDRM was rebranded as Studio DRM following <a href="https://www.jwplayer.com/news-room/latest-press-releases/jw-player-acquires-vualto" target="_blank">JW Player’s acquisition of Vualto</a>. Any references to VUDRM in this document or in the Studio DRM Admin portal refer to Studio DRM.

<br /> <hr />

## Requirements

Integrating Studio DRM with JW Platform and Chromecast has several requirements.

<table> <thead> <tr> <th> Item </th> <th> Notes </th> </tr> </thead> <tbody> <tr> <td width="27%"> <strong>Application Registration</strong> </td> <td width="73%"> <a href="https://developers.google.com/cast/codelabs/cast-receiver#3" target="_blank">Registration</a> allows you to test your custom receiver. Specifically, you will be able to connect to the custom receiver with your custom Cast implementation. </td> </tr> <tr> <td> <strong>Cast App</strong> </td> <td> A Cast app enables DRM-protected content to be streamed on a Cast-enabled device. <br /><br /> A Cast app consists of two components: <ul> <li><strong>Sender app (JW web player)</strong></li> <li><strong>Custom web receiver</strong></li> </ul> You can use the <a href="https://github.com/jwplayer/jwplayer-chromecast-custom-receiver/tree/main/studio-drm-with-jw-platform" target="_blank">JW Player Chromecast Custom Receiver Demo App</a> to guide your implementation. <br /><br />

ο»Ώ

Google recommends <a href="https://developers.google.com/cast/codelabs/cast-receiver#2" target="_blank">installing</a> a mix of <a href="https://www.npmjs.com/package/http-server" target="_blank">http-server</a> and <a href="https://www.npmjs.com/package/ngrok" target="_blank">ngrok</a> to deploy your receiver locally.

</td> </tr> <tr> <td> <strong>Content URLs</strong> </td> <td> Through a signed URL, the license URL and streaming URL for each media ID are retrieved. <br /><br /> Use the following steps to retrieve the content URLs: <ol> <li>Use this <a href="https://docs.jwplayer.com/platform/docs/protection-studio-drm-generate-a-signed-content-url-for-drm-playback#sample-code" target="_blank">sample code</a> to generate the signed URL.</li> <li>Make a <code>GET</code> call with the signed URL.</li> <li>From the API response, extract the license and streaming URLs from the following parameters:</li> <ul> <li><code>playlist[].sources.drm.widevine.url</code> (license)</li> <li><code>playlist[].sources.drm.file</code> (streaming)</li> </ul> </ol> <br />

ο»Ώ

</td> </tr> </tbody> </table>

<br /> <hr />

## Configure the Cast app

For DRM playback, deploy your custom web receiver.

<br />

ο»Ώ
ο»Ώ

<br /> <hr />

## Enable casting for a viewer

Once you set up your custom receiver, you will be able to cast DRM content from the JW web player. For reference, you may see our [Studio DRM integration with JW Player](πŸ”—ο»Ώ).

  1. Add the [cast object](πŸ”—ο»Ώ) to your setup.

  2. In the JW Player **studiodrm-jwplayer.js** file, define `dash-stream-url` with your signed streaming URL.

  3. Define `widevine-license-url` with the signed license URL.

  4. Define `your-receiver-application-id` with your registered custom receiver app ID from the Google Cast developer console.

ο»Ώ

You can now cast DRM-protected video content onto a Chromecast device.

<br /> <hr />

## FAQ

<details><summary><strong>How do I implement Airplay with DRM media?</strong></summary>

<br />

Airplay will automatically be implemented by the Apple OS with DRM Media.

ο»Ώ

If an Airplay session is initiating after 10 minutes or longer of playback on the sending device, playback on the receiving device will fail. The user will need to restart the video in the Airplay session. This occurs because the Airplay receiver is using the existing authorization which has timed out.

<br />

</details>

<br />

<!-- Removes the automatic page-to-page navigation at the bottom of the page -->

<style> .rm-Pagination { display: none; } </style>