Skip to content
FrameworkStyle

Remote Playback

Remote playback state and actions for the player store

Controls remote playback to devices like Chromecast. Exits fullscreen before initiating a remote playback session.

API Reference

State

Property Type Details
remotePlaybackState 'disconnected' | 'connecting' | 'connected'
remotePlaybackAvailability 'available' | 'unavailable' | 'unsupported'

Actions

Action Type Details
toggleRemotePlayback () => Promise<void>

Selector

Pass selectRemotePlayback to usePlayer to subscribe to remote playback state. Returns undefined if the remote playback feature is not configured. 

import { selectRemotePlayback, usePlayer } from '@videojs/react';

function CastButton() {
  const remotePlayback = usePlayer(selectRemotePlayback);
  if (!remotePlayback || remotePlayback.remotePlaybackAvailability !== 'available') return null;

  return (
    <button onClick={remotePlayback.toggleRemotePlayback}>
      {remotePlayback.remotePlaybackState === 'connected' ? 'Disconnect' : 'Cast'}
    </button>
  );
}