Chromecast is one of the vital components of any stream (audio/video) app. It gives your customers ability to enjoy your content on the big screen in their living room. Although, Google makes it really easy to add google-cast sdk into your app, it is important on how it is rendered on the receiver side. This post reviews the different options available to you on the receiver side of chromecast.
Get started
Get started by registering your application at console at cast.google.com/publish. Registration is not required if you plan to use Default Media Receiver. Once the app is published, we’re ready to start testing of the app.
There are mainly three types of chromecast receiver apps.
- Default Media Receiver
- Styled Media Receiver
- Custom Receiver
The complexity of setting receiver app increases as you go down the list. For example, the easiest one is Default Media Receiver.
Default Media Receiver
Google has done all the work here, and all you need to do in your client side app is to tell that you intend to use the default receiver. In iOS, this can be achieved by using kGCKDefaultMediaReceiverApplicationID as the application id.
The styling and branding of the Default Media Receiver comes out of the box and cannot be changed. This is the most inexpensive and fast way to bring your content to chromecast. But as you get more serious about the branding of your app, you might want to go with more flexible receivers such as Styled Media Receiver or Custom Chromecast Receiver.
Styled Media Receiver
Styled media receivers are a bit more flexible in terms of styling but not so much. At the time of registering the app, there is an option to provide a stylesheet. This is used to control components such as background image, splash screen, logo and progress bar color. An example stylesheet and more details can be found at at the documentation website. The app registration console will load the stylesheet dynamically so that we can see how the app would look like, based on the style classes specified in the css file.
Styled media receivers are suitable for most of the apps because the Chromecast itself manages the receiver side code. Also, it gives us a flexibility to modify the styling based on the app’s branding. However, if you are looking for full control over the appearance and behaviour of the receiver app, then writing a custom receiver app will be the best option for you.
Custom Chromecast Receiver
A custom receiver is basically an html/css/javascript application, which you develop, that runs on a Chromecast device. Chromecast is basically a glorified chrome browser, and hence it can render any html content just like the browser. The app is designed using html and css, and javascript is used to monitor the player changes, and you (as the developer of Chromecast app) can respond to the player changes (such as launching, idle, loading, buffering, paused and playing).
Another good reason to choose a custom implementation is to change the metadata shown on Chromecast needs to change without having to use the sender application. For example, if you are casting a live stream radio, and every five minutes the song changes, and you want to update it on Chromecast. Using a Default Media Receiver or Styled Media Receiver cannot do this, however, since Custom Receiver is a javascript application, we can write code to achieve this.
The playback is usually done using html media tag (<audio></audio> or <video></video>). And using the javascript code, you can access this element and control the playback after reading the metadata sent from sender (iOS/Android/Web) application.
General scenarios
Here are some very common scenarios and solutions to decide which flavour of receiver app to choose.
Choose Default Media Receiver if,
- You have a video/audio streaming app and you don’t care about how the chromecast app looks like.
- The app does not require special unlocking to playback (Authentication/DRM or decryption).
- Don’t want to host and manage custom html/css/javascript code.
Choose Styled Media Receiver if,
- You want to theme your chromecast to match the branding, but don’t want to spend time hiring a developer and building out a custom app
- The app does not require special unlocking to playback (Authentication/DRM or decryption)
- Don’t want to host and manage custom html/javascript code. However, the custom CSS file needs to be hosted through https
Choose Custom Chromecast Receiver if,
- You care about how the chromecast looks like and need full control of its behavior
- Playback require unlocking (Authentication/DRM or decryption)
- It is okay to host and manage custom receiver code (html/css/javascript)
- The receiver application needs to change metadata shown on screen without the involvement of the sender application
Conclusion
Building and debugging a custom receiver is a bit more involved work than the other two options. So you need to make the decision whether to spend all the time developing it, or to just use a styled receiver and take advantage of the styling capabilities and utilize the out-of-the-box interface that comes with it.
If you have any questions or feedback, or need help in bringing your app to Chromecast, simply send it to me at sonny@nowplayingapps.com.