useUserMedia
Custom hook that captures audio and video from the user's device.
Installation
npx sse-tool add use-user-media
npm install sse-hooks
Usage
import { useUserMedia } from "./{hooks file}";
const { stream, error, startCapture, stopCapture } = useUserMedia();
return (
<div>
{error && <p>Error: {error}</p>}
<video
autoPlay
muted
playsInline
ref={(node) => {
if (node && stream) node.srcObject = stream;
}}
/>
<button onClick={() => startCapture()}>Start Camera</button>
<button onClick={stopCapture}>Stop Camera</button>
</div>
);
import { useUserMedia } from "sse-hooks";
const { stream, error, startCapture, stopCapture } = useUserMedia();
return (
<div>
{error && <p>Error: {error}</p>}
<video
autoPlay
muted
playsInline
ref={(node) => {
if (node && stream) node.srcObject = stream;
}}
/>
<button onClick={() => startCapture()}>Start Camera</button>
<button onClick={stopCapture}>Stop Camera</button>
</div>
);
API
Parameters
| Name | Type | Description |
|---|---|---|
| initialConstraints | UseUserMediaConstraints | The initial constraints for audio and video. |
Return Value
Returns UseUserMediaReturn.
An object containing the stream, error state, and control functions.