Basic Usage
Include Dyte Meeting in your app
DyteClient
is a JavaScript library that can be included in your JavaScript
application to show the Dyte Meeting UI.
It has a Meeting
component which can be initialized
using 2 mandatory and 2 optional properties. The mandatory ones are defined
below along with their usage, and the optional ones can be found
here in the advanced usage
page.
Pass Client ID for verification
You need to pass a clientId
to DyteClient
to verify the participant's
authToken
against.
<script>
const client = new DyteClient({ clientId: 'orgId|clientId' });
</script>
Configure the meeting connection
You need to pass a meetingConfig
object to initialize the Meeting
, to define
which meeting should the client connect to and a couple of other setup
parameters, out of which only authToken
and roomName
are mandatory. This
Meeting
reference can be used to take further actions and make customizations
to the meeting.
<script>
const client = new DyteClient({ clientId: 'orgId|clientId' });
const meeting = client.Meeting({
roomName: '<roomName>',
authToken: '<authToken>',
});
</script>
Initialize the meeting in its parent container
You need to call the init
method on meeting
and pass it the id
of the
parent container in which you want the meeting to get initialized.
<script>
const client = new DyteClient({ clientId: 'orgId|clientId' });
const meeting = client.Meeting({
roomName: '<roomName>',
authToken: '<authToken>',
});
meeting.init('root');
</script>