Halaman ini berisi cuplikan kode dan deskripsi fitur yang tersedia untuk aplikasi Penerima Web Kustom.
- Elemen
cast-media-player
yang merepresentasikan UI pemutar bawaan yang disediakan dengan Penerima Web. - Gaya visual seperti CSS khusus untuk elemen
cast-media-player
untuk menata gaya berbagai elemen UI sepertibackground-image
,splash-image
, danfont-family
. - Elemen skrip untuk memuat framework Penerima Web.
- Kode JavaScript untuk menangkap pesan dan menangani peristiwa.
- Antrean untuk putar otomatis.
- Opsi untuk mengonfigurasi pemutaran.
- Opsi untuk menyetel konteks Web Receiver.
- Opsi untuk menyetel perintah yang didukung oleh aplikasi Penerima Web.
- Panggilan JavaScript untuk memulai aplikasi Penerima Web.
Konfigurasi dan opsi aplikasi
CastReceiverContext
adalah class terluar yang diekspos ke developer, dan mengelola pemuatan
library dasar serta menangani inisialisasi Web Receiver SDK.
Jika Web Receiver API mendeteksi bahwa pengirim terputus, API ini akan memicu peristiwa SENDER_DISCONNECTED
. Jika Penerima Web belum dapat berkomunikasi dengan pengirim selama
yang kami jelaskan sebagai
maxInactivity
detik, hal ini juga akan memunculkan peristiwa SENDER_DISCONNECTED
. Sebaiknya tetapkan maxInactivity
ke nilai yang tinggi selama pengembangan
agar aplikasi
Penerima Web tidak tertutup saat melakukan debug aplikasi dengan Chrome Remote
Debugger:
const context = cast.framework.CastReceiverContext.getInstance();
const options = new cast.framework.CastReceiverOptions();
options.maxInactivity = 3600; //Development only
context.start(options);
Namun, untuk aplikasi Penerima Web yang dipublikasikan, sebaiknya tidak menetapkan
maxInactivity
dan mengandalkan nilai default. Perhatikan bahwa opsi Penerima
Web ditetapkan satu kali dalam aplikasi.
Konfigurasi lainnya adalah
cast.framework.PlaybackConfig
.
Ini dapat disetel sebagai berikut:
const playbackConfig = new cast.framework.PlaybackConfig();
playbackConfig.manifestRequestHandler = requestInfo => {
requestInfo.withCredentials = true;
};
context.start({playbackConfig: playbackConfig});
Konfigurasi ini memengaruhi setiap pemutaran konten dan pada dasarnya memberikan
perilaku penggantian. Untuk mengetahui daftar perilaku yang dapat diganti oleh developer, lihat
definisi cast.framework.PlaybackConfig
. Untuk mengubah konfigurasi
di antara konten, pengguna dapat menggunakan
PlayerManager
untuk mendapatkan playbackConfig
saat ini, mengubah atau menambahkan penggantian dan mereset
playbackConfig
seperti ini:
const playerManager =
cast.framework.CastReceiverContext.getInstance().getPlayerManager();
const playbackConfig = (Object.assign(
new cast.framework.PlaybackConfig(), playerManager.getPlaybackConfig()));
playbackConfig.autoResumeNumberOfSegments = 1;
playerManager.setPlaybackConfig(playbackConfig);
Perhatikan bahwa jika PlaybackConfig
tidak diganti,
getPlaybackConfig()
akan menampilkan objek null. Dan setiap properti di PlaybackConfig that
adalah undefined
akan menggunakan nilai default.
Pemroses peristiwa
Web Receiver SDK memungkinkan aplikasi Web Receiver Anda menangani peristiwa pemutar. Pemroses
peristiwa mengambil
parameter cast.framework.events.EventType
(atau array parameter ini) yang menentukan peristiwa yang
harus memicu pemroses. Array yang telah dikonfigurasi sebelumnya untuk
cast.framework.events.EventType
yang berguna untuk proses debug dapat ditemukan di
cast.framework.events.category
.
Parameter peristiwa memberikan informasi tambahan tentang peristiwa tersebut.
Misalnya, jika Anda ingin mengetahui kapan perubahan mediaStatus
sedang disiarkan, Anda dapat menggunakan logika berikut untuk menangani peristiwa tersebut:
const playerManager =
cast.framework.CastReceiverContext.getInstance().getPlayerManager();
playerManager.addEventListener(
cast.framework.events.EventType.MEDIA_STATUS, (event) => {
// Write your own event handling code, for example
// using the event.mediaStatus value
});
Intersepsi pesan
Dengan Web Receiver SDK, aplikasi Web Receiver Anda dapat menangkap pesan dan mengeksekusi kode kustom pada pesan tersebut. Intersep pesan mengambil parameter cast.framework.messages.MessageType
yang menentukan jenis pesan yang harus dicegat.
Interseptor harus menampilkan permintaan yang diubah atau Promise yang akan di-resolve dengan nilai permintaan yang diubah. Menampilkan null
akan mencegah pemanggilan pengendali pesan default. Lihat Memuat media untuk detail selengkapnya.
Misalnya, jika ingin mengubah data permintaan pemuatan, Anda dapat menggunakan logika berikut untuk menangkap dan memodifikasinya:
const context = cast.framework.CastReceiverContext.getInstance();
const playerManager = context.getPlayerManager();
playerManager.setMessageInterceptor(
cast.framework.messages.MessageType.LOAD, loadRequestData => {
const error = new cast.framework.messages.ErrorData(
cast.framework.messages.ErrorType.LOAD_FAILED);
if (!loadRequestData.media) {
error.reason = cast.framework.messages.ErrorReason.INVALID_PARAM;
return error;
}
if (!loadRequestData.media.entity) {
return loadRequestData;
}
return thirdparty.fetchAssetAndAuth(loadRequestData.media.entity,
loadRequestData.credentials)
.then(asset => {
if (!asset) {
throw cast.framework.messages.ErrorReason.INVALID_REQUEST;
}
loadRequestData.media.contentUrl = asset.url;
loadRequestData.media.metadata = asset.metadata;
loadRequestData.media.tracks = asset.tracks;
return loadRequestData;
}).catch(reason => {
error.reason = reason; // cast.framework.messages.ErrorReason
return error;
});
});
context.start();
Penanganan error
Saat terjadi error pada intersep pesan, aplikasi Penerima Web harus menampilkan cast.framework.messages.ErrorType
dan cast.framework.messages.ErrorReason
yang sesuai.
playerManager.setMessageInterceptor(
cast.framework.messages.MessageType.LOAD, loadRequestData => {
const error = new cast.framework.messages.ErrorData(
cast.framework.messages.ErrorType.LOAD_CANCELLED);
if (!loadRequestData.media) {
error.reason = cast.framework.messages.ErrorReason.INVALID_PARAM;
return error;
}
...
return fetchAssetAndAuth(loadRequestData.media.entity,
loadRequestData.credentials)
.then(asset => {
...
return loadRequestData;
}).catch(reason => {
error.reason = reason; // cast.framework.messages.ErrorReason
return error;
});
});
Intersepsi pesan vs pemroses peristiwa
Beberapa perbedaan utama antara intersepsi pesan dan pemroses peristiwa adalah sebagai berikut:
- Pemroses peristiwa tidak memungkinkan Anda mengubah data permintaan.
- Pemroses peristiwa paling baik digunakan untuk memicu analisis atau fungsi kustom.
playerManager.addEventListener(cast.framework.events.category.CORE,
event => {
console.log(event);
});
- Intersepsi pesan memungkinkan Anda memproses pesan, menahannya, dan mengubah data permintaan itu sendiri.
- Intersepsi pesan paling baik digunakan untuk menangani logika kustom terkait permintaan data.
Memuat media
MediaInformation
menyediakan banyak properti untuk memuat media dalam
pesan cast.framework.messages.MessageType.LOAD
termasuk entity
,
contentUrl
, dan contentId
.
entity
adalah properti yang disarankan untuk digunakan dalam penerapan Anda untuk aplikasi pengirim dan
penerima. Properti ini adalah URL deep link yang dapat berupa playlist atau konten media tertentu.
contentUrl
dirancang untuk URL yang dapat diputar dan dapat digunakan setelah tersedia.
contentId
tidak digunakan lagi karena ambiguitas apakah nilainya adalah URL
media, ID asli, atau parameter kunci untuk pencarian kustom.
Sebaiknya gunakan entity
untuk menyimpan ID atau parameter kunci yang sebenarnya, dan gunakan contentUrl
untuk URL media. Contohnya ditunjukkan dalam
cuplikan berikut yang menampilkan entity
dalam permintaan LOAD
dan
contentUrl
yang dapat diputar diambil:
playerManager.setMessageInterceptor(
cast.framework.messages.MessageType.LOAD, loadRequestData => {
...
if (!loadRequestData.media.entity) {
// Copy the value from contentId for legacy reasons if needed
loadRequestData.media.entity = loadRequestData.media.contentId;
}
return thirdparty.fetchAssetAndAuth(loadRequestData.media.entity,
loadRequestData.credentials)
.then(asset => {
loadRequestData.media.contentUrl = asset.url;
...
return loadRequestData;
});
});
Kemampuan perangkat
Metode
getDeviceCapabilities
menyediakan informasi perangkat pada perangkat Cast yang terhubung dan perangkat video atau
audio yang terpasang padanya. Metode getDeviceCapabilities
memberikan informasi
dukungan untuk Asisten Google, Bluetooth, serta perangkat layar dan audio
yang terhubung.
Metode ini menampilkan objek yang dapat Anda kueri dengan meneruskan salah satu enum yang ditentukan untuk mendapatkan kemampuan perangkat bagi enum tersebut. Enum
ditentukan dalam
cast.framework.system.DeviceCapabilities
.
Contoh ini memeriksa apakah perangkat Penerima Web dapat memutar HDR dan DolbyVision (DV) dengan kunci IS_HDR_SUPPORTED
dan IS_DV_SUPPORTED
.
const context = cast.framework.CastReceiverContext.getInstance();
context.addEventListener(cast.framework.system.EventType.READY, () => {
const deviceCapabilities = context.getDeviceCapabilities();
if (deviceCapabilities &&
deviceCapabilities[cast.framework.system.DeviceCapabilities.IS_HDR_SUPPORTED]) {
// Write your own event handling code, for example
// using the deviceCapabilities[cast.framework.system.DeviceCapabilities.IS_HDR_SUPPORTED] value
}
if (deviceCapabilities &&
deviceCapabilities[cast.framework.system.DeviceCapabilities.IS_DV_SUPPORTED]) {
// Write your own event handling code, for example
// using the deviceCapabilities[cast.framework.system.DeviceCapabilities.IS_DV_SUPPORTED] value
}
});
context.start();
Menangani interaksi pengguna
Pengguna dapat berinteraksi dengan aplikasi Penerima Web melalui aplikasi pengirim (Web, Android, dan iOS), perintah suara di perangkat yang dilengkapi Asisten, kontrol sentuh pada layar smart, dan remote control pada perangkat Android TV. SDK Cast menyediakan berbagai API untuk memungkinkan aplikasi Penerima Web menangani interaksi ini, mengupdate UI aplikasi melalui status tindakan pengguna, dan secara opsional mengirim perubahan untuk mengupdate layanan backend.
Perintah media yang didukung
Status kontrol UI didorong oleh
MediaStatus.supportedMediaCommands
untuk pengontrol yang diperluas oleh pengirim iOS dan Android, aplikasi penerima dan remote control
yang berjalan di perangkat sentuh, serta aplikasi penerima di perangkat Android TV. Jika
Command
bitwise tertentu diaktifkan di properti, tombol yang
terkait dengan tindakan tersebut akan diaktifkan. Jika nilainya tidak disetel, tombol akan
dinonaktifkan. Nilai ini dapat diubah di Web Receiver dengan:
- Menggunakan
PlayerManager.setSupportedMediaCommands
untuk menetapkanCommands
tertentu - Menambahkan perintah baru menggunakan
addSupportedMediaCommands
- Menghapus perintah yang ada menggunakan
removeSupportedMediaCommands
.
playerManager.setSupportedMediaCommands(cast.framework.messages.Command.SEEK |
cast.framework.messages.Command.PAUSE);
Saat penerima menyiapkan MediaStatus
yang diperbarui, penerima akan menyertakan
perubahan dalam properti supportedMediaCommands
. Saat statusnya
disiarkan, aplikasi pengirim yang terhubung akan memperbarui tombol di UI-nya
sesuai.
Untuk informasi selengkapnya tentang perintah media dan perangkat sentuh yang didukung, lihat
panduan
Accessing UI controls
.
Mengelola status tindakan pengguna
Saat berinteraksi dengan UI atau mengirim perintah suara, pengguna dapat mengontrol
pemutaran konten dan properti yang terkait dengan item yang diputar. Permintaan yang mengontrol pemutaran ditangani secara otomatis oleh SDK. Permintaan yang
mengubah properti untuk item saat ini yang sedang diputar, seperti perintah LIKE
,
mengharuskan aplikasi penerima menanganinya. SDK menyediakan serangkaian
API untuk menangani jenis permintaan ini. Untuk mendukung permintaan ini, berikut harus dilakukan:
- Mengintersep pesan
USER_ACTION
dan menentukan tindakan yang diminta. - Update
MediaInformation
UserActionState
untuk mengupdate UI.
Cuplikan di bawah ini mencegat pesan USER_ACTION
dan menangani pemanggilan backend dengan perubahan yang diminta. Selanjutnya, perangkat akan melakukan panggilan untuk memperbarui
UserActionState
pada penerima.
playerManager.setMessageInterceptor(cast.framework.messages.MessageType.USER_ACTION,
(userActionRequestData) => {
// Obtain the media information of the current content to associate the action to.
let mediaInfo = playerManager.getMediaInformation();
// If there is no media info return an error and ignore the request.
if (!mediaInfo) {
console.error('Not playing media, user action is not supported');
return new cast.framework.messages.ErrorData(messages.ErrorType.BAD_REQUEST);
}
// Reach out to backend services to store user action modifications. See sample below.
return sendUserAction(userActionRequestData, mediaInfo)
// Upon response from the backend, update the client's UserActionState.
.then(backendResponse => updateUserActionStates(backendResponse))
// If any errors occurred in the backend return them to the cast receiver.
.catch((error) => {
console.error(error);
return error;
});
});
Cuplikan di bawah ini menyimulasikan panggilan ke layanan backend. Fungsi ini memeriksa
UserActionRequestData
untuk melihat jenis perubahan yang diminta pengguna dan
hanya melakukan panggilan jaringan jika tindakan tersebut didukung oleh backend.
function sendUserAction(userActionRequestData, mediaInfo) {
return new Promise((resolve, reject) => {
switch (userActionRequestData.userAction) {
// Handle user action changes supported by the backend.
case cast.framework.messages.UserAction.LIKE:
case cast.framework.messages.UserAction.DISLIKE:
case cast.framework.messages.UserAction.FOLLOW:
case cast.framework.messages.UserAction.UNFOLLOW:
case cast.framework.messages.UserAction.FLAG:
case cast.framework.messages.UserAction.SKIP_AD:
let backendResponse = {userActionRequestData: userActionRequestData, mediaInfo: mediaInfo};
setTimeout(() => {resolve(backendResponse)}, 1000);
break;
// Reject all other user action changes.
default:
reject(
new cast.framework.messages.ErrorData(cast.framework.messages.ErrorType.INVALID_REQUEST));
}
});
}
Cuplikan di bawah mengambil UserActionRequestData
dan menambahkan atau menghapus
UserActionState
dari MediaInformation
. Memperbarui
UserActionState
dari MediaInformation
akan mengubah status tombol
yang terkait dengan tindakan yang diminta. Perubahan ini tercermin dalam UI kontrol
layar smart, aplikasi remote control, dan UI Android TV. Hal ini juga disiarkan melalui pesan MediaStatus
keluar untuk mengupdate UI pengontrol yang diperluas untuk pengirim iOS dan Android.
function updateUserActionStates(backendResponse) {
// Unwrap the backend response.
let mediaInfo = backendResponse.mediaInfo;
let userActionRequestData = backendResponse.userActionRequestData;
// If the current item playing has changed, don't update the UserActionState for the current item.
if (playerManager.getMediaInformation().entity !== mediaInfo.entity) {
return;
}
// Check for existing userActionStates in the MediaInformation.
// If none, initialize a new array to populate states with.
let userActionStates = mediaInfo.userActionStates || [];
// Locate the index of the UserActionState that will be updated in the userActionStates array.
let index = userActionStates.findIndex((currUserActionState) => {
return currUserActionState.userAction == userActionRequestData.userAction;
});
if (userActionRequestData.clear) {
// Remove the user action state from the array if cleared.
if (index >= 0) {
userActionStates.splice(index, 1);
}
else {
console.warn("Could not find UserActionState to remove in MediaInformation");
}
} else {
// Add the UserActionState to the array if enabled.
userActionStates.push(
new cast.framework.messages.UserActionState(userActionRequestData.userAction));
}
// Update the UserActionState array and set the new MediaInformation
mediaInfo.userActionStates = userActionStates;
playerManager.setMediaInformation(mediaInfo, true);
return;
}
Perintah suara
Perintah media berikut saat ini didukung di Web Receiver SDK untuk
perangkat yang dilengkapi dengan Asisten. Implementasi default dari perintah ini
dapat ditemukan di
cast.framework.PlayerManager
.
Perintah | Deskripsi |
---|---|
Putar | Memutar atau melanjutkan pemutaran dari status dijeda. |
Jeda | Jeda konten yang sedang diputar. |
Sebelumnya | Lewati ke item media sebelumnya di antrean media Anda. |
Berikutnya | Lewati ke item media berikutnya di antrean media Anda. |
Berhenti | Menghentikan media yang sedang diputar. |
Tidak Ada Pengulangan | Menonaktifkan pengulangan item media dalam antrean setelah item terakhir dalam antrean selesai diputar. |
Ulangi Single | Mengulang media yang sedang diputar tanpa batas waktu. |
Ulangi Semua | Mengulangi semua item dalam antrean setelah item terakhir dalam antrean diputar. |
Ulangi Semua dan Acak | Setelah item terakhir dalam antrean selesai diputar, acak antrean dan ulangi semua item dalam antrean. |
Acak | Acak item media di antrean media Anda. |
Teks AKTIF / NONAKTIF | Aktifkan / Nonaktifkan Teks Tertutup untuk media. Aktifkan / Nonaktifkan juga tersedia menurut bahasa. |
Cari waktu yang absolut | Melompat ke waktu absolut yang ditentukan. |
Mencari hingga waktu relatif terhadap waktu saat ini | Melompat maju atau mundur menurut jangka waktu yang ditentukan dibandingkan dengan waktu pemutaran saat ini. |
Mainkan Lagi | Mulai ulang media yang sedang diputar atau putar item media yang terakhir diputar jika tidak ada media yang sedang diputar. |
Menetapkan kecepatan pemutaran | Rasio pemutaran media yang bervariasi. Hal ini harus ditangani secara default. Anda dapat menggunakan intersep pesan SET_PLAYBACK_RATE untuk mengganti permintaan tarif yang masuk. |
Perintah media yang didukung dengan suara
Untuk mencegah perintah suara memicu perintah media di perangkat yang dilengkapi
Asisten, Anda harus menyetel
perintah media yang didukung
yang rencananya akan Anda dukung terlebih dahulu. Selanjutnya, Anda harus menerapkan perintah tersebut dengan mengaktifkan properti CastReceiverOptions.enforceSupportedCommands
. UI pada pengirim Cast SDK dan perangkat yang mendukung sentuhan akan berubah untuk
mencerminkan konfigurasi ini. Jika tanda ini tidak diaktifkan, perintah suara
masuk akan dieksekusi.
Misalnya, jika Anda mengizinkan PAUSE
dari aplikasi pengirim dan
perangkat yang mendukung sentuhan, Anda juga harus mengonfigurasi penerima untuk mencerminkan
setelan tersebut. Saat dikonfigurasi, perintah suara yang masuk akan dihapus jika tidak disertakan dalam daftar perintah yang didukung.
Pada contoh di bawah ini, kita memberikan CastReceiverOptions
saat memulai
CastReceiverContext
. Kami telah menambahkan dukungan untuk perintah PAUSE
dan
memberlakukan pemutar hanya untuk mendukung perintah tersebut. Sekarang, jika perintah suara meminta operasi lain seperti SEEK
, perintah tersebut akan ditolak. Pengguna akan diberi tahu bahwa perintah tersebut belum didukung.
const context = cast.framework.CastReceiverContext.getInstance();
context.start({
enforceSupportedCommands: true,
supportedCommands: cast.framework.messages.Command.PAUSE
});
Anda dapat menerapkan logika terpisah untuk setiap perintah yang ingin dibatasi. Hapus flag enforceSupportedCommands
dan untuk setiap perintah yang ingin dibatasi, Anda dapat menangkap pesan masuk. Di sini kami menangkap permintaan
yang disediakan oleh SDK sehingga perintah SEEK
yang dikeluarkan untuk perangkat yang dilengkapi dengan Asisten
tidak memicu pencarian di aplikasi Web Receiver Anda.
Untuk perintah media yang tidak didukung oleh aplikasi Anda, tampilkan alasan
error yang sesuai, seperti
NOT_SUPPORTED
.
playerManager.setMessageInterceptor(cast.framework.messages.MessageType.SEEK,
seekData => {
// Block seeking if the SEEK supported media command is disabled
if (!(playerManager.getSupportedMediaCommands() & cast.framework.messages.Command.SEEK)) {
let e = new cast.framework.messages.ErrorData(cast.framework.messages.ErrorType
.INVALID_REQUEST);
e.reason = cast.framework.messages.ErrorReason.NOT_SUPPORTED;
return e;
}
return seekData;
});
Latar belakang dari aktivitas suara
Jika platform Cast menyesuaikan suara aplikasi Anda karena aktivitas
Asisten seperti memproses ucapan pengguna atau berbicara kembali, pesan FocusState
dari NOT_IN_FOCUS
akan dikirim ke aplikasi Penerima Web saat
aktivitas dimulai. Pesan lain dengan IN_FOCUS
dikirim saat aktivitas berakhir.
Bergantung pada aplikasi dan media yang sedang diputar, Anda mungkin ingin
menjeda media saat FocusState
dalam status NOT_IN_FOCUS
dengan menangkap jenis
pesan FOCUS_STATE
.
Misalnya, adalah pengalaman pengguna yang baik untuk menjeda pemutaran buku audio jika Asisten merespons kueri pengguna.
playerManager.setMessageInterceptor(cast.framework.messages.MessageType.FOCUS_STATE,
focusStateRequestData => {
// Pause content when the app is out of focus. Resume when focus is restored.
if (focusStateRequestData.state == cast.framework.messages.FocusState.NOT_IN_FOCUS) {
playerManager.pause();
} else {
playerManager.play();
}
return focusStateRequestData;
});
Bahasa teks yang ditentukan untuk suara
Jika pengguna tidak secara eksplisit menyatakan bahasa untuk teks, bahasa yang digunakan untuk teks adalah bahasa yang sama dengan bahasa yang digunakan dalam perintah.
Dalam skenario ini, parameter isSuggestedLanguage
pesan masuk menunjukkan apakah bahasa terkait disarankan atau diminta secara eksplisit oleh pengguna.
Misalnya, isSuggestedLanguage
disetel ke true
untuk perintah "OK Google,
aktifkan teks", karena bahasa disimpulkan oleh bahasa
yang digunakan untuk berbicara. Jika bahasa diminta secara eksplisit, seperti di "Ok
Google, aktifkan teks bahasa Inggris", isSuggestedLanguage
akan disetel ke false
.
Metadata dan transmisi suara
Meskipun perintah suara ditangani oleh Penerima Web secara default, Anda harus memastikan metadata untuk konten Anda sudah lengkap dan akurat. Hal ini memastikan bahwa perintah suara ditangani dengan benar oleh Asisten dan metadata muncul dengan benar di berbagai jenis antarmuka baru seperti aplikasi Google Home dan layar smart seperti Google Home Hub.
Transfer streaming
Mempertahankan status sesi adalah dasar transfer streaming, tempat pengguna dapat memindahkan streaming audio dan video yang ada di seluruh perangkat menggunakan perintah suara, Aplikasi Google Home, atau layar smart. Media berhenti diputar di satu perangkat (sumber) dan berlanjut di perangkat lainnya (tujuan). Setiap perangkat Cast dengan firmware terbaru dapat berfungsi sebagai sumber atau tujuan dalam transfer streaming.
Alur peristiwa untuk transfer streaming adalah:
- Di perangkat sumber:
- Media berhenti diputar.
- Aplikasi Penerima Web menerima perintah untuk menyimpan status media saat ini.
- Aplikasi Web Receiver dimatikan.
- Di perangkat tujuan:
- Aplikasi Web Receiver dimuat.
- Aplikasi Penerima Web menerima perintah untuk memulihkan status media tersimpan.
- Media melanjutkan pemutaran.
Elemen status media meliputi:
- Posisi atau stempel waktu tertentu dari lagu, video, atau item media.
- Tempatnya di antrean yang lebih luas (seperti playlist atau radio artis).
- Pengguna terautentikasi.
- Status pemutaran (misalnya, memutar atau menjeda).
Mengaktifkan transfer streaming
Untuk menerapkan transfer aliran data untuk Penerima Web Anda:
- Update
supportedMediaCommands
dengan perintahSTREAM_TRANSFER
:playerManager.addSupportedMediaCommands( cast.framework.messages.Command.STREAM_TRANSFER, true);
- Jika ingin, ganti intersepsi pesan
SESSION_STATE
danRESUME_SESSION
seperti yang dijelaskan dalam Mempertahankan status sesi. Hanya ganti setelan ini jika data kustom perlu disimpan sebagai bagian dari snapshot sesi. Jika tidak, implementasi default untuk mempertahankan status sesi akan mendukung transfer streaming.
Mempertahankan status sesi
Web Receiver SDK menyediakan implementasi default untuk aplikasi Web Receiver untuk mempertahankan status sesi dengan mengambil snapshot status media saat ini, mengonversi status menjadi permintaan pemuatan, dan melanjutkan sesi dengan permintaan pemuatan.
Permintaan pemuatan yang dihasilkan oleh Web Receiver dapat diganti di
pencegat pesan SESSION_STATE
jika diperlukan. Jika Anda ingin menambahkan data kustom
ke dalam permintaan pemuatan, sebaiknya tempatkan data tersebut di
loadRequestData.customData
.
playerManager.setMessageInterceptor(
cast.framework.messages.MessageType.SESSION_STATE,
function (sessionState) {
// Override sessionState.loadRequestData if needed.
const newCredentials = updateCredentials_(sessionState.loadRequestData.credentials);
sessionState.loadRequestData.credentials = newCredentials;
// Add custom data if needed.
sessionState.loadRequestData.customData = {
'membership': 'PREMIUM'
};
return sessionState;
});
Data kustom dapat diambil dari loadRequestData.customData
di intersep pesan RESUME_SESSION
.
let cred_ = null;
let membership_ = null;
playerManager.setMessageInterceptor(
cast.framework.messages.MessageType.RESUME_SESSION,
function (resumeSessionRequest) {
let sessionState = resumeSessionRequest.sessionState;
// Modify sessionState.loadRequestData if needed.
cred_ = sessionState.loadRequestData.credentials;
// Retrieve custom data.
membership_ = sessionState.loadRequestData.customData.membership;
return resumeSessionRequest;
});
Pramuat konten
Penerima Web mendukung pramuat item media setelah item pemutaran saat ini dalam antrean.
Operasi pramuat akan mendownload otomatis beberapa segmen dari item yang akan datang. Spesifikasi dilakukan pada nilai pramuat di objek QueueItem (defaultnya adalah 20 detik jika tidak diberikan). Waktu dinyatakan dalam detik, relatif terhadap akhir item yang sedang diputar . Hanya nilai positif yang valid. Misalnya, jika nilainya 10 detik, item ini akan dipramuat 10 detik sebelum item sebelumnya selesai. Jika waktu untuk memuat di awal lebih tinggi daripada waktu yang tersisa di currentItem, pramuat akan terjadi sesegera mungkin. Jadi, jika nilai pramuat yang sangat besar ditentukan pada queueItem, seseorang dapat mencapai efek setiap kali kita memutar item saat ini, dan kita sudah memuat item berikutnya. Namun, kita membiarkan setelan dan pilihan ini untuk developer karena nilai ini dapat memengaruhi bandwidth dan performa streaming item yang sedang diputar.
Pramuat akan berfungsi untuk konten streaming HLS, DASH, dan Smooth secara default.
File video dan audio MP4 reguler seperti MP3 tidak akan dipramuat karena perangkat Cast hanya mendukung satu elemen media dan tidak dapat digunakan untuk melakukan pramuat saat item konten yang ada masih diputar.
Pesan kustom
Pertukaran pesan adalah metode interaksi utama untuk aplikasi Penerima Web.
Pengirim mengeluarkan pesan ke Penerima Web menggunakan API pengirim untuk platform yang dijalankan pengirim (Android, iOS, Web). Objek peristiwa (yang merupakan manifes pesan) yang diteruskan ke pemroses peristiwa memiliki elemen data (event.data
) tempat data mengambil properti jenis peristiwa tertentu.
Aplikasi Penerima Web dapat memilih untuk memproses pesan di namespace tertentu. Karena itu, aplikasi Penerima Web dikatakan mendukung protokol namespace tersebut. Kemudian, setiap pengirim terhubung yang ingin berkomunikasi di namespace tersebut menggunakan protokol yang sesuai.
Semua namespace ditentukan oleh string dan harus dimulai dengan "urn:x-cast:
"
diikuti dengan string apa pun. Misalnya, "urn:x-cast:com.example.cast.mynamespace
".
Berikut adalah cuplikan kode bagi Web Receiver untuk memproses pesan kustom dari pengirim yang terhubung:
const context = cast.framework.CastReceiverContext.getInstance();
const CUSTOM_CHANNEL = 'urn:x-cast:com.example.cast.mynamespace';
context.addCustomMessageListener(CUSTOM_CHANNEL, function(customEvent) {
// handle customEvent.
});
context.start();
Demikian pula, aplikasi Penerima Web dapat terus memberikan informasi kepada pengirim tentang status
Penerima Web dengan mengirim pesan ke pengirim yang terhubung. Aplikasi Penerima Web
dapat mengirim pesan menggunakan
sendCustomMessage(namespace, senderId, message)
di
CastReceiverContext
.
Penerima Web dapat mengirim pesan ke setiap pengirim, baik sebagai respons terhadap pesan yang diterima atau karena perubahan status aplikasi. Selain pesan point-to-point (dengan batas 64 kb), Penerima Web juga dapat menyiarkan pesan ke semua pengirim yang terhubung.
Cast untuk perangkat audio
Lihat Panduan Google Cast untuk perangkat audio guna mendapatkan dukungan tentang pemutaran hanya audio.
Android TV
Bagian ini membahas cara Google Web Receiver menggunakan input Anda sebagai pemutaran, dan kompatibilitas Android TV.
Mengintegrasikan aplikasi Anda dengan remote control
Google Web Receiver yang berjalan di perangkat Android TV menerjemahkan input dari
input kontrol perangkat (yaitu remote control genggam) sebagai pesan pemutaran
media yang ditentukan untuk namespace urn:x-cast:com.google.cast.media
, seperti
yang dijelaskan dalam Pesan Pemutaran Media. Aplikasi
Anda harus mendukung pesan ini untuk mengontrol pemutaran
media aplikasi agar memungkinkan kontrol pemutaran dasar dari input
kontrol Android TV.
Panduan untuk kompatibilitas Android TV
Berikut beberapa rekomendasi dan kesalahan umum yang harus dihindari untuk memastikan aplikasi Anda kompatibel dengan Android TV:
- Perhatikan bahwa string agen pengguna berisi "Android" dan "CrKey"; beberapa situs dapat mengalihkan ke situs khusus seluler karena mendeteksi label "Android". Jangan berasumsi bahwa "Android" dalam string agen pengguna selalu menunjukkan pengguna seluler.
- Media stack Android dapat menggunakan GZIP transparan untuk mengambil data. Pastikan
data media Anda dapat merespons
Accept-Encoding: gzip
. - Peristiwa media HTML5 Android TV dapat dipicu dalam waktu yang berbeda dengan Chromecast, yang dapat menyebabkan masalah yang disembunyikan di Chromecast.
- Saat memperbarui media, gunakan peristiwa terkait media yang diaktifkan oleh elemen
<audio>/<video>
, sepertitimeupdate
,pause
, danwaiting
. Hindari penggunaan peristiwa terkait jaringan sepertiprogress
,suspend
, danstalled
, karena cenderung bergantung pada platform. Lihat peristiwa media untuk informasi selengkapnya tentang penanganan peristiwa media di penerima Anda. - Saat mengonfigurasi sertifikat HTTPS situs penerima, pastikan untuk menyertakan sertifikat CA perantara. Lihat halaman pengujian SSL Qualsys untuk memverifikasi: jika jalur sertifikasi tepercaya untuk situs Anda menyertakan sertifikat CA berlabel "download tambahan", maka mungkin situs tidak dimuat pada platform berbasis Android.
- Meskipun Chromecast menampilkan halaman penerima pada bidang grafis 720p, platform Transmisi lainnya termasuk Android TV dapat menampilkan halaman ini hingga 1080p. Pastikan halaman penerima diskalakan dengan baik pada resolusi yang berbeda.