App Google Cast per browser TVSDK

Puoi eseguire il cast di uno qualsiasi dei flussi da un’app di invio basata su TVSDK e far sì che lo streaming venga riprodotto su Chromecast con il browser TVSDK.

Esistono due componenti di un’app abilitata per cast:

  • L’app mittente, che funge da telecomando.

    Le app di invio includono smartphone, personal computer e così via. L’app può essere sviluppata utilizzando SDK nativi per iOS, Android e Chrome.

  • L’app ricevente, che viene eseguita su Chromecast e riproduce il contenuto.

    IMPORTANTE

    Questa app può essere solo un'app HTML5.

Il mittente e il destinatario comunicano utilizzando gli SDK cast per trasmettere i messaggi.

Flusso di lavoro di base

Ecco una panoramica del processo:

  1. L’app mittente stabilisce una connessione con l’app ricevente.
  2. L’app mittente invia un messaggio per caricare i file multimediali sull’app ricevente.
  3. L'app ricevitore inizia la riproduzione.
  4. L’app mittente invia all’app ricevente messaggi di controllo della riproduzione, come riproduzione, pausa, ricerca, avanzamento rapido, riavvolgimento rapido, riavvolgimento, modifica del volume e così via.
  5. L’app ricevente reagisce a questi messaggi.

Formato del messaggio

È necessario definire i messaggi in modo che il mittente e il destinatario possano comprenderli. Ecco un esempio di messaggio di ricerca:

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

Quando si inviano messaggi personalizzati, come il messaggio di ricerca tramite gli SDK per cast, è necessario uno spazio dei nomi del messaggio personalizzato. Ecco un esempio in JavaScript:

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

Stabilimento di una connessione

IMPORTANTE

Le API TVSDK per browser non sono coinvolte quando si stabilisce la connessione.

Per stabilire una connessione, il mittente e il destinatario devono completare i seguenti compiti:

  • Il mittente deve consultare la documentazione relativa alla piattaforma in Sviluppo app mittente.

  • Il ricevitore utilizza le API del ricevitore cast per stabilire una connessione con l’app del mittente. Ad esempio:

    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();
    

Gestione dei messaggi

Per inviare messaggi al destinatario, consulta la documentazione relativa alla piattaforma del mittente.

IMPORTANTE

È necessario includere lo spazio dei nomi del messaggio personalizzato MSG_NAMESPACE in tutti i messaggi.

Per l’app ricevente, segui la documentazione relativa alle API del ricevitore cast.

Esempio di messaggio del mittente basato su Chrome

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

Gestione degli eventi del mittente basati su Chrome

Eseguire un binding dei gestori di eventi agli elementi dell’interfaccia utente che invieranno messaggi quando vengono attivati gli eventi corrispondenti. Ad esempio, per un’app mittente basata su Chrome, l’evento di ricerca potrebbe essere inviato come segue:

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);
}

Gestione dei messaggi del ricevitore

Dall’app ricevente, ecco un esempio di come gestire il messaggio di ricerca:

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;
    }
};

In questa pagina