fn
useUserMedia
v0.0.15testeddemoReactive `navigator.mediaDevices.getUserMedia` streaming. Acquires a `MediaStream` for camera/microphone capture, keeps it in sync with reactive constraints, and auto-restarts on constraint changes while enabled. SSR-safe and race-safe — overlapping acquisitions never leave an orphaned stream open.
Examples
ts
const { stream, enabled } = useUserMedia({ constraints: { video: true } });
enabled.value = true; // start capturingts
// Switch cameras reactively — the stream restarts automatically
const { constraints, start } = useUserMedia();
await start();
constraints.value = { video: { deviceId: nextCameraId } };Demo
Loading demo…
Signature
ts
export function useUserMedia(options: UseUserMediaOptions ={ ... }Parameters
| Parameter | Type | Description |
|---|---|---|
options? | UseUserMediaOptions | Options |
Returns
UseUserMediaReturnReactive support flag, stream, controls, and reactive `enabled`/`autoSwitch`/`constraints`