WebRTC-unified
Docs updated 03th November 2019
Introduction
This package was created to simplify work with original WebRTC. Yes, you can create voice/video chat with multiple users by use this package.
Tested only on Chrome. Most likely this package does not work in other browsers. If you need support for other browsers, write to me
This specification is very confusing, the intricacies of which will be described here.
Like WebRTC, this package assumes that users are already connected to the server(sockets or etc) that will connect them.
Table of contents
Installing
npm i webrtc-unified
Same packet for server and client
Client file for direct connection - client.js or client.min.js
Example Usage
Server
Full example code server-demo.js
// require libconst Voicer = ;// create server instanceconst voicer = ; // some code // example connection event handler { // create client instance // you can put off initializing client instance before getting data for this package wsvoicer = voicer; // we get some data from client ws; // when connection closed, use close for disconnect this user from other and destroy client instance ws;}
Client
Full example code client-demo.js
// ignore this file if you include client.js file earlyconst WebRTCUnified = ;let rtcUnified = ; // add ice server// rtcUnified.addIceServer({// url: `turn:someserver.example:3478?transport=tcp`,// username: "username",// credential: "credential",// }) // create connection with our servervar socket = 'ws' + locationorigin + '/ws'; // function to send data to the server { socket;}; // reload page if connection lostsocket { location;}; // get a messages handler functionlet conn_handler = rtcUnified; // handle socket a connected statesocket { // join to default room rtcUnified;}; // handle messagessocket { var json = JSON; if jsonaction === 'webrtc-unified' ; else console;}; // bind actionsbutt_micro { if thisinnerHTML == 'Enable micro' rtcUnified; thisinnerHTML = 'Mute micro'; else rtcUnified; thisinnerHTML = 'Enable micro'; }butt_micro;butt_cam { if thisinnerHTML == 'Enable cam' rtcUnified; thisinnerHTML = 'Disable cam'; else rtcUnified; thisinnerHTML = 'Enable cam'; }butt_screen { if thisinnerHTML == 'Enable screen' rtcUnified; thisinnerHTML = 'Disable screen'; else rtcUnified; thisinnerHTML = 'Enable screen'; }; // user reject request to use audio/video/screenrtcUnified; // handle local stream for drawrtcUnified; // handle local stream for removertcUnified; // handle remote stream for drawrtcUnified; // handle remote stream for removertcUnified;
API reference(client)
Designation List
Media
The media this is any audio or video resource that is broadcast to other chat participants
Type of media
audio
- microphonevideo
- webcamdisplay
- desktop, specific program or etc
new WebRTCUnified()
Returns WebRTCUnified
instance
Methods of WebRTCUnified instance
rtcUnified.addIceServer(iceServer)
iceServer
- an object containing following properties:-
url
- required, URL which can be used to connect to the server. Example:turn:someserver.example:3478?transport=tcp
-
username
- Optional. if the RTCIceServer is a TURN server, then this is the username to use during the authentication process.
-
credential
- Optional. The credential to use when logging into the server. This is only used if the RTCIceServer represents a TURN server.
The RTCIceServer dictionary defines how to connect to a single ICE server (such as a STUN or TURN server). It includes both the URL and the necessary credentials, if any, to connect to the server.
By default added stun:stun.l.google.com:19302
rtcUnified.setConnect(sendData)
- function
sendData
- is called when need senddata
to server -
data
- an object with data for server
Returns: function for messages from server, receives an object from the server side
rtcUnified.joinRoom(roomId = "default")
- roomId - an string with room id, can be user id or etc
Will join other users in the room. If the user is already another in the room, first they will exit.
rtcUnified.leaveRoom()
Leave current room
rtcUnified.setMedia(options)
options
- an object containing following properties:-
type
- type of media
-
enable
- optional an boolean. If not set, toggled current state
-
args
- optional an object fornavigator.mediaDevices.getUserMedia/getDisplayMedia
Turn on / off media
rtcUnified.getMedia(type)
type
- type of media
Returns: native browser stream or undefined. Use to verify enabled media
rtcUnified.createStream(options)
options
- an object containing following properties:-
type
- type of media
-
args
- optional an object fornavigator.mediaDevices.getUserMedia/getDisplayMedia
Turn on media. Better use setMedia
to manage state
Events of WebRTCUnified instance
rtcUnified.on(eventName, function(...args))
Set handle, allowed rtcUnified.once
Event connect
Handled when called setConnect
Event joinRoom
options
- an object containing following properties:-
clientId
- Client system identifier unique to each connection
-
userId
- The identifier of the user who transmitted the server
-
roomId
- Room id
Handled when user connected to room, before connecting to other chat participants
Event leaveRoom
Handled when it was called or the server kicked the user from the room
Event newPeerConnected
options
- an object containing following properties:-
clientId
- Client system identifier unique to each connection
-
userId
- The identifier of the user who transmitted the server
Handled when user connected to room, before connecting with him
Event removePeerConnected
options
- an object containing following properties:-
clientId
- client system identifier unique to each connection
-
userId
- the identifier of the user who transmitted the server
Handled when user leaves from room, before disconnect with him
Event rejectUseMedia
type
- type of media
Handled when user reject use media
Event addedLocalStream
stream
- native browser streamtype
- type of media
Handled when media has been added by setMedia
or createStream
methods
Event removedLocalStream
stream
- native browser streamtype
- type of media
Handled when media has been removed by setMedia
method
Event addedRemoteStream
stream
- native browser streamtype
- type of mediaclientId
- client system identifier unique to each connectionuserId
- the identifier of the user who transmitted the server
Handled when a room user started broadcasting media
Event removedRemoteStream
stream
- native browser streamtype
- type of mediaclientId
- client system identifier unique to each connectionuserId
- the identifier of the user who transmitted the server
Handled when a room user has finished broadcasting media
FAQ
Limitations
- Tested only on Chrome
- getUserMedia - Privacy and security