Google Cast w Chrome na Androida

Sam Dutton

Wyobraź sobie, że możesz używać aplikacji internetowej na telefonie, aby prezentować slajdy na projektorze konferencyjnym lub udostępniać obrazy, grać w gry i oglądać filmy na ekranie telewizora, używając aplikacji internetowej na urządzeniu mobilnym jako kontrolera.

Najnowsza wersja Chrome na Androida umożliwia witrynom prezentowanie treści na urządzeniach Google Cast za pomocą pakietu SDK do przesyłania treści do urządzeń Cast. Oznacza to, że możesz teraz tworzyć aplikacje przesyłające treści do Casta za pomocą pakietu SDK internetowego w Chrome na Androida lub iOS (lub na komputerze z rozszerzeniem) oraz tworzyć aplikacje, które korzystają z rodzimego pakietu SDK Cast na Androida i iOS. (wcześniej aplikacja przesyłająca treści do Google Cast wymagała rozszerzenia Google Cast do Chrome, więc na Androidzie można było korzystać z urządzeń Cast tylko z natywnych aplikacji).

Poniżej znajdziesz krótkie wprowadzenie do tworzenia aplikacji przesyłającej treści do Google Cast za pomocą pakietu SDK internetowego. Więcej informacji znajdziesz w przewodniku programisty aplikacji Chrome Sender.

Wszystkie strony korzystające z Cast muszą zawierać bibliotekę Cast:

<script
  type="text/javascript"
  src="https://www.gstatic.com/cv/js/sender/v1/cast_sender.js"
></script>

Dodaj funkcję zwracaną, aby obsłużyć dostępność interfejsu API, i inicjuj sesję Cast (pamiętaj, aby dodać uchwyt przed załadowaniem interfejsu API):

window['__onGCastApiAvailable'] = function (isLoaded, error) {
  if (isLoaded) {
    initializeCastApi();
  } else {
    console.log(error);
  }
};

function initializeCastApi() {
  var sessionRequest = new chrome.cast.SessionRequest(applicationID);
  var apiConfig = new chrome.cast.ApiConfig(
    sessionRequest,
    sessionListener,
    receiverListener
  );
  chrome.cast.initialize(apiConfig, onInitSuccess, onError);
}

Jeśli używasz domyślnej aplikacji Styled Media Receiver, a nie zarejestrowanej aplikacji Custom Receiver, możesz utworzyć SessionRequest w ten sposób:

var sessionRequest = new chrome.cast.SessionRequest(chrome.cast.media.
  DEFAULT_MEDIA_RECEIVER_APP_ID);

Powyższe wywołanie zwrotne receiverListener jest wykonywane, gdy co najmniej 1 urządzenie stanie się dostępne:

function receiverListener(e) {
  if (e === chrome.cast.ReceiverAvailability.AVAILABLE) {
    // update UI
  }
}

Rozpocznij sesję przesyłania, gdy użytkownik kliknie ikonę przesyłania, zgodnie z wytycznymi dotyczącymi wygody użytkowników:

chrome.cast.requestSession(onRequestSessionSuccess,
    onRequestSessionError);

function onRequestSessionSuccess(e) {
  session = e;
}

Użytkownik zobaczy selektor urządzeń:

Okno wyboru urządzenia do przesyłania treści

Okno Szczegóły trasy jest wyświetlane, gdy strona jest już połączona i wywołuje funkcję requestSession():

Okno szczegółów trasy w Cast

Po rozpoczęciu sesji przesyłania możesz wczytać multimedia na wybrane urządzenie przesyłania i dodawać odbiornik do zdarzeń odtwarzania multimediów:

var mediaInfo = new chrome.cast.media.MediaInfo(mediaURL);
var request = new chrome.cast.media.LoadRequest(mediaInfo);
session.loadMedia(
  request,
  onMediaDiscovered.bind(this, 'loadMedia'),
  onMediaError
);

function onMediaDiscovered(how, media) {
  currentMedia = media;
  media.addUpdateListener(onMediaStatusUpdate);
}

Zmienna currentMedia to obiekt chrome.cast.media.Media, który może służyć do sterowania odtwarzaniem:

function playMedia() {
  currentMedia.play(null, success, error);
}


    // ...

Powiadomienie o odtworzeniu/wstrzymaniu wyświetla się podczas odtwarzania multimediów:

Powiadomienie o odtwarzaniu/wstrzymywaniu przesyłanego filmu.

Jeśli nie odtwarzasz żadnych multimediów, powiadomienie będzie zawierać tylko przycisk Zatrzymaj, aby zatrzymać przesyłanie:

Powiadomienie o zatrzymaniu przesyłania.

sessionListener wywołania zwrotnego dla chrome.cast.ApiConfig() (patrz wyżej) umożliwia aplikacji dołączenie do istniejącej sesji przesyłania lub zarządzanie nią:

function sessionListener(e) {
  session = e;
  if (session.media.length !== 0) {
    onMediaDiscovered('onRequestSessionSuccess', session.media[0]);
  }
}

Jeśli Chrome na Androidzie umożliwia przesyłanie multimediów z Twojej witryny, ale chcesz wyłączyć tę funkcję, aby domyślny interfejs przesyłania nie kolidował z Twoim własnym, użyj atrybutu disableRemotePlayback, który jest dostępny w Chrome 49 i nowszych wersjach:

<video disableRemotePlayback src="..."></video>

Alt Urządzenia nadawcze i odbiorcze

Przewodnik po pakiecie SDK do przesyłania treści na urządzenia mobilne zawiera linki do przykładowych aplikacji oraz informacje o funkcjach przesyłania treści na urządzenia mobilne, takich jak zarządzanie sesją, ścieżki tekstowe (do napisów) i aktualizacje stanu.

Obecnie możesz prezentować treści tylko w aplikacji odbiorczej za pomocą pakietu SDK do przesyłania treści do Casta w wersji dla przeglądarek internetowych, ale pracujemy nad umożliwieniem używania interfejsu Presentation API bez pakietu SDK do przesyłania treści do Casta (na komputerach i urządzeniach z Androidem), aby można było prezentować dowolną stronę internetową na urządzeniu Cast bez rejestracji w Google. W przeciwieństwie do pakietu SDK przesyłania do Chromecasta przeznaczonego tylko dla Chrome korzystanie ze standardowego interfejsu API pozwoli na działanie strony z innymi klientami użytkownika i urządzeniami, które obsługują ten interfejs.

Interfejs Presentation API wraz z interfejsem Remote Playback API to część działań Second Screen Working Group, których celem jest umożliwienie wyświetlania treści internetowych na stronach internetowych za pomocą drugiego ekranu.

Te interfejsy API wykorzystują różne urządzenia podłączone do sieci, w tym wyświetlacze z użyciem agenta użytkownika, aby umożliwić obsługę wielu aplikacji za pomocą urządzenia sterującego i urządzenia wyświetlającego.

Będziemy Cię informować o postępach w implementacji.

Jeśli znajdziesz błąd lub chcesz zgłosić prośbę o dodanie nowej funkcji, odwiedź stronę crbug.com/new.

Więcej informacji