Bayangkan Anda dapat menggunakan aplikasi web dari ponsel untuk mempresentasikan slide presentasi ke proyektor konferensi — atau berbagi gambar, bermain game, atau menonton video di layar TV — menggunakan aplikasi web seluler sebagai pengontrol.
Rilis terbaru Chrome di Android memungkinkan situs dipresentasikan 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 yang memiliki ekstensi) serta membuat aplikasi yang menggunakan Cast SDK native untuk Android dan iOS. (Sebelumnya, aplikasi pengirim Google Cast memerlukan ekstensi Chrome Google Cast, jadi di Android, aplikasi hanya dapat berinteraksi dengan perangkat Transmisi dari aplikasi asli.)
Di bawah ini adalah pengantar singkat untuk membuat aplikasi pengirim Cast menggunakan Web SDK. Informasi yang lebih komprehensif tersedia di 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 menginisialisasi sesi Cast (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 Penerima Media Bergaya default dan bukan aplikasi Penerima Kustom yang terdaftar dan milik 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 dimandatkan oleh Pedoman Pengalaman Pengguna:
chrome.cast.requestSession(onRequestSessionSuccess,
onRequestSessionError);
function onRequestSessionSuccess(e) {
session = e;
}
Pengguna akan melihat pemilih perangkat:
Dialog detail rute akan ditampilkan saat halaman sudah terhubung dan memanggil requestSession():
Setelah memiliki sesi Transmisi, Anda dapat memuat media untuk perangkat Cast 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 Transmisi 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, tetapi Anda ingin menonaktifkan fitur ini agar UI transmisi default tidak mengganggu media 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 mempresentasikan ke Aplikasi Penerima Cast menggunakan SDK Web Cast, tetapi masih ada pekerjaan yang sedang dilakukan untuk mengaktifkan Presentation API agar dapat digunakan tanpa SDK Cast (di desktop dan Android) guna menyajikan halaman web apa pun ke perangkat Cast tanpa mendaftar ke Google. Tidak seperti SDK Cast khusus Chrome, menggunakan API standar akan memungkinkan halaman berfungsi dengan agen pengguna dan perangkat lain yang mendukung API.
Presentation API, beserta Remote Playback API, adalah bagian dari upaya Second Screen Working Group dalam memungkinkan halaman web menggunakan layar kedua untuk menampilkan konten web.
API ini memanfaatkan berbagai perangkat yang online — termasuk layar terhubung yang menjalankan agen pengguna — untuk memungkinkan beragam aplikasi dengan perangkat 'kontrol' dan perangkat 'tampilan'.
Kami akan terus mengabari Anda mengenai progres penerapannya.
Sementara itu, beri tahu kami jika Anda menemukan bug atau memiliki permintaan fitur: crbug.com/new.