Aplicación Google Cast para el TVSDK del explorador

Puede emitir cualquiera de las emisiones de una aplicación de remitente basada en TVSDK y hacer que el flujo se reproduzca en Chromecast con el TVSDK del explorador.

Hay dos componentes de una aplicación habilitada para reenvío:

  • La aplicación del remitente, que actúa como control remoto.

    Las aplicaciones de remitente incluyen teléfonos inteligentes, equipos personales, etc. La aplicación se puede desarrollar con SDK nativos para iOS, Android y Chrome.

  • La aplicación del receptor, que se ejecuta en Chromecast y reproduce el contenido.

    IMPORTANTE

    Esta aplicación solo puede ser una aplicación HTML5.

El remitente y el destinatario se comunican utilizando los SDK de reparto para pasar mensajes.

Flujo de trabajo básico

A continuación se muestra una descripción general del proceso:

  1. La aplicación del remitente establece una conexión con la aplicación del receptor.
  2. La aplicación del remitente envía un mensaje para cargar el contenido en la aplicación del receptor.
  3. La aplicación del receptor inicia la reproducción.
  4. La aplicación del remitente envía mensajes de control de reproducción, como reproducción, pausa, búsqueda, avance rápido, rebobinado rápido, rebobinado, cambio de volumen, etc., a la aplicación del receptor.
  5. La aplicación del receptor reacciona a estos mensajes.

Formato del mensaje

Debe definir los mensajes para que el remitente y el destinatario puedan entenderlos. Este es un ejemplo de mensaje de búsqueda:

{ 
"type": "seek", 
"seekTo": 10000 
} 

Al enviar mensajes personalizados, como el mensaje de búsqueda a través de los SDK de Cast, se requiere un espacio de nombres de mensaje personalizado. Este es un ejemplo en JavaScript:

Custom Message Namespace 
var MSG_NAMESPACE = "urn:x-cast:com.adobe.primetime"; 

Establecimiento de una conexión

IMPORTANTE

Las API del TVSDK del explorador no están implicadas al establecer la conexión.

Para establecer una conexión, el remitente y el receptor deben completar las siguientes tareas:

  • El remitente debe revisar la documentación de la plataforma en Desarrollo de aplicaciones del remitente.

  • El receptor utiliza las API del receptor de envío para establecer una conexión con la aplicación del remitente. Por ejemplo:

    window.castReceiverManager = cast.receiver.CastReceiverManager.getInstance(); 
    
    window.castReceiverManager.onReady = function (event) { /*handle event*/ }; 
    window.castReceiverManager.onSenderConnected = function (event) { /*handle event*/ }; 
    window.castReceiverManager.onSenderDisconnected = function (event) { /*handle event*/ }; 
    
    var customMessageBus = window.castReceiverManager.getCastMessageBus(MSG_NAMESPACE); 
    customMessageBus.onMessage = function (event) { /*handle messages*/ }; 
    
    window.castReceiverManager.start(); 
    

Administración de mensajes

Para enviar mensajes al receptor, consulte la documentación de la plataforma del remitente.

IMPORTANTE

Debe incluir el espacio de nombres del mensaje personalizado, MSG_NAMESPACE en todos los mensajes.

Para la aplicación del receptor, siga la documentación de las API del receptor de conversión.

Ejemplo de mensaje de remitente basado en Chrome

window.session.sendMessage(MSG_NAMESPACE, message, successCallback, errorCallback); //https://developers.google.com/cast/docs/reference/chrome/chrome.cast.Session#sendMessage

Gestión de eventos de remitente basada en Chrome

Enlace los controladores de eventos a los elementos de la interfaz de usuario que enviarán mensajes cuando se activen los eventos correspondientes. Por ejemplo, para una aplicación de remitente basada en Chrome, el evento de búsqueda podría enviarse de esta manera:

document.getElementById("#seekBar").addEventListener("click", seekEventHandler); 
   
function seekEventHandler(event) { 
    seekMessage = { type: "seek", seekTo: player.currentTime }; //player is an instance of AdobePSDK.MediaPlayer 
    window.session.sendMessage(MSG_NAMESPACE, seekMessage, successCallback, errorCallback); 
} 

Gestión de mensajes del receptor

Desde la aplicación del receptor, a continuación se muestra un ejemplo de cómo gestionar el mensaje de búsqueda:

customMessageBus.onMessage = function (event) { 
    var message = JSON.parse(event.data); 
    switch (message.type) { 
        case "seek":  
            player.seek(parseInt(message.seekTo)); 
            break; 
        //code for handling other events 
        default:  
            break; 
    } 
}; 

En esta página

Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now