例項屬性
還繼承了其父介面 EventTarget 的屬性。
RemotePlayback.state只讀-
表示
RemotePlayback連線的狀態。可能的值為:"connecting"-
使用者代理正在嘗試與選定的裝置啟動遠端播放。
"connected"-
已從本地播放切換到遠端播放,所有命令現在都將在遠端裝置上執行。
"disconnected"-
尚未啟動遠端播放、啟動失敗或已停止。
例項方法
還繼承了其父介面 EventTarget 的方法。
RemotePlayback.watchAvailability()-
監視可用遠端播放裝置列表,並返回一個
Promise,該 Promise 解析為可用遠端播放裝置的callbackId。 RemotePlayback.cancelWatchAvailability()-
取消監視遠端播放裝置可用性的請求。
RemotePlayback.prompt()-
提示使用者選擇遠端播放裝置並授權連線。
事件
還繼承了其父介面 EventTarget 的事件。
connecting-
當用戶代理啟動遠端播放時觸發。
connect-
當用戶代理成功連線到遠端裝置時觸發。
disconnect-
當用戶代理斷開與遠端裝置的連線時觸發。
示例
以下示例演示了一個具有自定義控制元件的播放器,該播放器支援遠端播放。最初,用於選擇裝置的按鈕是隱藏的。
html
<video id="videoElement" src="https://example.org/media.ext">
<button id="deviceBtn" class="hidden">Pick device</button>
</video>
css
.hidden {
display: none;
}
使用 RemotePlayback.watchAvailability() 方法來監視可用的遠端播放裝置。如果裝置可用,則使用回撥函式顯示按鈕。
js
const deviceBtn = document.getElementById("deviceBtn");
const videoElem = document.getElementById("videoElement");
function availabilityCallback(available) {
// Show or hide the device picker button depending on device availability.
if (available) {
deviceBtn.classList.remove("hidden");
} else {
deviceBtn.classList.add("hidden");
}
}
videoElem.remote.watchAvailability(availabilityCallback).catch(() => {
// If the device cannot continuously watch available,
// show the button to allow the user to try to prompt for a connection.
deviceBtn.classList.remove("hidden");
});
規範
| 規範 |
|---|
| Remote Playback API # remoteplayback-interface |
瀏覽器相容性
載入中…