100ms Logo

100ms

Docs

Search docs
/

Chat

What's a video without being able to send messages to each other too? 100ms supports chat for every video/audio room you create.

Sending Chat Messages

With the HMSSDK instance call different send message functions.

Broadcast Messages

This will be received by everyone in the room.

// instance acquired from build() method await hmsInstance.sendBroadcastMessage('hello everyone!') // yes it's that simple 😉 .then(d => console.log('Broadcast Message Success: ', d)) .catch(e => console.log('Broadcast Message Error: ', e));

Group Messages

This will be received by every peer who is part of the passed in roles.

// instance acquired from build() method // all available Roles can be obtained from hmsInstance using hmsInstance.knownRoles. // it will return an array of HMSRole from which required roles can be selected for this API. await hmsInstance.sendGroupMessage('hi folks!', [role1, role2]) .then(d => console.log('Group Message Success: ', d)) .catch(e => console.log('Group Message Error: ', e));

Direct Messages

This will only be received by the peer whom the message was sent to.

// instance acquired from build() method await hmsInstance.sendDirectMessage('keep this message a secret!', peer) .then(d => console.log('Direct Message Success: ', d)) .catch(e => console.log('Direct Message Error: ', e));

Receiving Chat Messages

When you called hmsInstance.join(config) to join a room, add a ON_MESSAGE event listener with callback function onMessageReceived.

// import HMSUpdateListenerActions,HMSMessage classes import { HMSUpdateListenerActions, HMSMessage } from '@100mslive/react-native-hms'; // instance acquired from build() method hmsInstance.addEventListener(HMSUpdateListenerActions.ON_MESSAGE, onMessageReceived); const onMessageReceived = (message: HMSMessage) => { // perform action };

Putting together a list of chat messages.

The UI is completely up to you to decide! You'll also need to hold onto all the received messages if you want to display history.