Bayangkan Anda dapat menggunakan aplikasi web dari ponsel untuk mempresentasikan slide ke proyektor konferensi — atau membagikan gambar, bermain game, atau menonton video di layar TV — menggunakan aplikasi web seluler sebagai pengontrol.
Rilis terbaru Chrome di Android memungkinkan situs ditampilkan ke perangkat Google Cast menggunakan Cast Web SDK. Artinya, Anda kini dapat membuat aplikasi pengirim Cast menggunakan Web SDK dengan Chrome di Android atau iOS (atau di desktop dengan ekstensi) serta membuat aplikasi yang menggunakan SDK Cast native untuk Android dan iOS. (Sebelumnya, aplikasi pengirim Google Cast memerlukan ekstensi Chrome Google Cast, sehingga di Android, Anda hanya dapat berinteraksi dengan perangkat Cast dari aplikasi native.)
Berikut adalah pengantar singkat untuk mem-build aplikasi pengirim Cast menggunakan Web SDK. Informasi yang lebih komprehensif tersedia dari Panduan Pengembangan Aplikasi Pengirim Chrome.
Semua halaman yang menggunakan Cast harus menyertakan library Cast:
<script
type="text/javascript"
src="https://www.gstatic.com/cv/js/sender/v1/cast_sender.js"
></script>
Tambahkan callback untuk menangani ketersediaan API dan melakukan inisialisasi sesi Transmisi (pastikan untuk menambahkan pengendali sebelum API dimuat):
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);
}
Jika Anda menggunakan aplikasi Styled Media Receiver default, bukan aplikasi Custom Receiver terdaftar yang dibuat sendiri, Anda dapat membuat SessionRequest
seperti ini:
var sessionRequest = new chrome.cast.SessionRequest(chrome.cast.media.
DEFAULT_MEDIA_RECEIVER_APP_ID);
Callback receiverListener
di atas dieksekusi saat satu atau beberapa perangkat tersedia:
function receiverListener(e) {
if (e === chrome.cast.ReceiverAvailability.AVAILABLE) {
// update UI
}
}
Luncurkan sesi Transmisi saat pengguna mengklik ikon Transmisi, seperti yang diwajibkan oleh Panduan Pengalaman Pengguna:
chrome.cast.requestSession(onRequestSessionSuccess,
onRequestSessionError);
function onRequestSessionSuccess(e) {
session = e;
}
Pengguna akan melihat pemilih perangkat:
Dialog route details ditampilkan saat halaman sudah terhubung dan memanggil requestSession()
:
Setelah memiliki sesi Transmisi, Anda dapat memuat media untuk perangkat Transmisi yang dipilih, dan menambahkan pemroses untuk peristiwa pemutaran media:
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);
}
Variabel currentMedia
di sini adalah objek chrome.cast.media.Media
, yang dapat digunakan untuk mengontrol pemutaran:
function playMedia() {
currentMedia.play(null, success, error);
}
// ...
Notifikasi putar/jeda ditampilkan saat media diputar:
Jika tidak ada media yang diputar, notifikasi hanya memiliki tombol berhenti, untuk menghentikan transmisi:
Callback sessionListener
untuk chrome.cast.ApiConfig()
(lihat di atas) memungkinkan aplikasi Anda bergabung atau mengelola sesi Cast yang ada:
function sessionListener(e) {
session = e;
if (session.media.length !== 0) {
onMediaDiscovered('onRequestSessionSuccess', session.media[0]);
}
}
Jika Chrome di Android mengizinkan transmisi media dari situs Anda, tetapi Anda ingin menonaktifkan fitur ini agar UI transmisi default tidak mengganggu UI Anda sendiri, gunakan atribut disableRemotePlayback, yang tersedia di Chrome 49 dan yang lebih baru:
<video disableRemotePlayback src="..."></video>
Panduan Cast Web SDK memiliki link ke aplikasi contoh, dan informasi tentang fitur Cast seperti pengelolaan sesi, trek teks (untuk subtitel dan teks), serta pembaruan status.
Saat ini, Anda hanya dapat melakukan presentasi ke Aplikasi Penerima Cast menggunakan Cast Web SDK, tetapi ada upaya yang sedang dilakukan untuk memungkinkan Presentation API digunakan tanpa Cast SDK (di desktop dan Android) untuk menampilkan halaman web apa pun ke perangkat Cast tanpa pendaftaran ke Google. Tidak seperti Cast SDK khusus Chrome, penggunaan API standar akan memungkinkan halaman berfungsi dengan agen pengguna dan perangkat lain yang mendukung API.
Presentation API, bersama dengan Remote Playback API, adalah bagian dari upaya Second Screen Working Group untuk memungkinkan halaman web menggunakan layar kedua untuk menampilkan konten web.
API ini memanfaatkan berbagai perangkat yang terhubung ke internet — termasuk layar terhubung yang menjalankan agen pengguna — untuk memungkinkan berbagai aplikasi dengan perangkat 'kontrol' dan perangkat 'layar'.
Kami akan terus mengabari Anda tentang progres penerapannya.
Sementara itu, beri tahu kami jika Anda menemukan bug atau memiliki permintaan fitur: crbug.com/new.