{"library":"mediasoup-client","title":"mediasoup-client for WebRTC","description":"mediasoup-client is a TypeScript client-side library designed for building robust WebRTC applications that interact with a mediasoup Selective Forwarding Unit (SFU) server. Currently at version 3.19.0, it provides a low-level, signaling-agnostic API that abstracts away much of the underlying WebRTC/ORTC complexities. Unlike its v2 predecessor, v3 removes the 'Peer' concept, focusing directly on Devices, Transports, Producers, and Consumers, offering greater flexibility. It's actively maintained with a consistent release cadence to align with WebRTC standards and mediasoup server updates, making it a powerful choice for developers requiring fine-grained control over their real-time media flows.","language":"javascript","status":"active","last_verified":"Tue Apr 21","install":{"commands":["npm install mediasoup-client"],"cli":null},"imports":["import { Device } from 'mediasoup-client';","import { Producer } from 'mediasoup-client';","import { DataProducer } from 'mediasoup-client';"],"auth":{"required":false,"env_vars":[]},"quickstart":{"code":"import { Device } from 'mediasoup-client';\nimport mySignaling from './my-signaling'; // Our own signaling stuff.\n\n// Create a device (use browser auto-detection).\nconst device = new Device();\n\n// Communicate with our server app to retrieve router RTP capabilities.\nconst routerRtpCapabilities = await mySignaling.request(\n\t'getRouterCapabilities'\n);\n\n// Load the device with the router RTP capabilities.\nawait device.load({ routerRtpCapabilities });\n\n// Check whether we can produce video to the router.\nif (!device.canProduce('video')) {\n\tconsole.warn('cannot produce video');\n\n\t// Abort next steps.\n}\n\n// Create a transport in the server for sending our media through it.\nconst { id, iceParameters, iceCandidates, dtlsParameters, sctpParameters } =\n\tawait mySignaling.request('createTransport', {\n\t\tsctpCapabilities: device.sctpCapabilities,\n\t});\n\n// Create the local representation of our server-side transport.\nconst sendTransport = device.createSendTransport({\n\tid,\n\ticeParameters,\n\ticeCandidates,\n\tdtlsParameters,\n\tsctpParameters,\n});\n\n// Set transport \"connect\" event handler.\nsendTransport.on('connect', async ({ dtlsParameters }, callback, errback) => {\n\t// Here we must communicate our local parameters to our remote transport.\n\ttry {\n\t\tawait mySignaling.request('transport-connect', {\n\t\t\ttransportId: sendTransport.id,\n\t\t\tdtlsParameters,\n\t\t});\n\n\t\t// Done in the server, tell our transport.\n\t\tcallback();\n\t} catch (error) {\n\t\t// Something was wrong in server side.\n\t\terrback(error);\n\t}\n});\n\n// Set transport \"produce\" event handler.\nsendTransport.on(\n\t'produce',\n\tasync ({ kind, rtpParameters, appData }, callback, errback) => {\n\t\t// Here we must communicate our local parameters to our remote transport.\n\t\ttry {\n\t\t\tconst { id } = await mySignaling.request('produce', {\n\t\t\t\ttransportId: sendTransport.id,\n\t\t\t\tkind,\n\t\t\t\trtpParameters,\n\t\t\t\tappData,\n\t\t\t});\n\n\t\t\t// Done in the server, pass the response to our transport.\n\t\t\tcallback({ id });\n\t\t} catch (error) {\n\t\t\t// Something was wrong in server side.\n\t\t\terrback(error);\n\t\t}\n\t}\n);\n\n// Set transport \"producedata\" event handler.\nsendTransport.on(\n\t'producedata',\n\tasync (\n\t\t{ sctpStreamParameters, label, protocol, appData },\n\t\tcallback,\n\t\terrback\n\t) => {\n\t\t// Here we must communicate our local parameters to our remote transport.\n\t\ttry {\n\t\t\tconst { id } = await mySignaling.request('produceData', {\n\t\t\t\ttransportId: sendTransport.id,\n\t\t\t\tsctpStreamParameters,\n\t\t\t\tlabel,\n\t\t\t\tprotocol,\n\t\t\t\tappData,\n\t\t\t});\n\n\t\t\t// Done in the server, pass the response to our transport.\n\t\t\tcallback({ id });\n\t\t} catch (error) {\n\t\t\t// Something was wrong in server side.\n\t\t\terrback(error);\n\t\t}\n\t}\n);\n\n// Produce our webcam video.\nconst stream = await navigator.mediaDevices.getUserMedia({ video: true });\nconst webcamTrack = stream.getVideoTracks()[0];\nconst webcamProducer = await sendTransport.produce({ track: webcamTrack });\n\n// Produce data (DataChannel).\nconst dataProducer = await sendTransport.produceData({\n\tordered: true,\n\tlabel: 'foo',\n});","lang":"typescript","description":"This quickstart initializes a mediasoup-client Device, loads it with router capabilities, establishes a WebRTC send transport through a custom signaling layer, and then demonstrates producing both a webcam video stream and a DataChannel.","tag":null,"tag_description":null,"last_tested":null,"results":[]},"compatibility":null}