Skip to main content
Paid plans only useLiveStreaming(params?) : Object useLiveStreaming can also be used to set up optional callbacks for live streaming events. When multiple live streams are running concurrently (see multi-instance live streaming), you can pass an instanceId to get per-instance state. Without instanceId, the hook returns aggregate state across all instances. For a list of all active instances, see useLiveStreamingInstances.

​
Parameters (optional)

​
instanceId
string
A valid UUID. When provided, returns state for a specific live streaming instance and filters event callbacks to only fire for that instance. See multi-instance live streaming.
​
onLiveStreamingError
Function
Callback for the live-streaming-error event.
​
onLiveStreamingStarted
Function
Callback for the live-streaming-started event.
​
onLiveStreamingStopped
Function
Callback for the live-streaming-stopped event.
​
onLiveStreamingUpdated
Function
Callback for the live-streaming-updated event.
​
onLiveStreamingWarning
Function
Callback for the nonfatal-error event with type 'live-streaming-warning'.

​
Return value

An object with the following properties:

​
Without instanceId (aggregate state)

When called without instanceId, the hook returns aggregate state across all live streaming instances. This works well for single-instance use cases — the scalar fields (errorMsg, layout) reflect the only active instance. With multiple concurrent instances, these fields reflect the first active instance; use useLiveStreaming({ instanceId }) for unambiguous per-instance access.
​
errorMsg
string
Error message from the first errored instance. With multiple instances, use useLiveStreaming({ instanceId }) for per-instance error state.
​
isLiveStreaming
boolean
true if any live streaming instance is active.
​
layout
Object
Layout of the first active instance. With multiple instances, use useLiveStreaming({ instanceId }) for per-instance layout.
​
startLiveStreaming
Function
Wraps startLiveStreaming().
​
stopLiveStreaming
Function
Wraps stopLiveStreaming().
​
updateLiveStreaming
Function
Wraps updateLiveStreaming().

​
With instanceId (per-instance state)

When called with instanceId, the hook returns state for that specific live streaming instance only.
​
errorMsg
string
Error message for this instance, if any.
​
instanceId
string
The instance ID.
​
isLiveStreaming
boolean
Whether this instance is currently live streaming.
​
layout
Object
The live streaming layout for this instance.
​
startLiveStreaming
Function
Wraps startLiveStreaming().
​
stopLiveStreaming
Function
Wraps stopLiveStreaming().
​
updateLiveStreaming
Function
Wraps updateLiveStreaming().
For more on live streaming with Daily, reference our guide.

​
Example

​
Basic usage

import { useLiveStreaming } from '@daily-co/daily-react';

export const UseLiveStreamingDemo = () => {
  const liveStreamingState = useLiveStreaming();

  return (
    <div>
      This call is {!liveStreamingState.isLiveStreaming ? 'not' : ''} live
      streamed
    </div>
  );
};

​
Multi-instance usage

import { useLiveStreaming } from '@daily-co/daily-react';
import { useLiveStreamingInstances } from '@daily-co/daily-react';

// instanceId must be a valid UUID
const MOBILE_INSTANCE = 'a1b2c3d4-5678-9abc-def0-1234567890ab';
const DESKTOP_INSTANCE = 'b2c3d4e5-6789-abcd-ef01-234567890abc';

export const MultiStreamDemo = () => {
  // Aggregate state: true if any instance is streaming
  const { isLiveStreaming } = useLiveStreaming();

  // Per-instance state
  const mobileStream = useLiveStreaming({
    instanceId: MOBILE_INSTANCE,
  });
  const desktopStream = useLiveStreaming({
    instanceId: DESKTOP_INSTANCE,
  });

  return (
    <div>
      <p>Any stream active: {isLiveStreaming ? 'Yes' : 'No'}</p>
      <p>Mobile: {mobileStream.isLiveStreaming ? 'Live' : 'Idle'}</p>
      <p>Desktop: {desktopStream.isLiveStreaming ? 'Live' : 'Idle'}</p>
    </div>
  );
};

​
See also

daily-js methods

Events

Hooks

Guides