HmsView is a React component that renders a video track within a view.
It utilizes the HmsViewComponent to display the media track specified by the trackId.
This component is designed to be used with React's forwardRef to allow for ref forwarding,
enabling direct interaction with the DOM element.
Props:
trackId: The unique identifier for the track to be displayed.style: Custom styles to apply to the view.mirror: If true, the video will be mirrored; commonly used for local video tracks.scaleType: Determines how the video fits within the bounds of the view (e.g., aspect fill, aspect fit).setZOrderMediaOverlay: When true, the video view will be rendered above the regular view hierarchy.autoSimulcast: Enables automatic simulcast layer switching based on network conditions (if supported).The properties passed to the HmsView component.
A ref provided by forwardRef for accessing the underlying DOM element.
A HmsViewComponent element configured with the provided props and ref.
HMSSDK
<HmsView trackId="track-id" style={{ width: 100, height: 100 }} mirror={true} scaleType="aspectFill" />
HMSSDK
Asynchronously accepts a role change request for the local peer.
This method is used when a role change request has been made to the local peer, typically by an admin or moderator of the room. Invoking this method signals acceptance of the new role, and the role change is applied to the local peer. This can affect the peer's permissions and capabilities within the room, such as the ability to send video, audio, or chat messages.
The successful execution of this method triggers an update across the room, notifying other peers of the role change. It is important to handle this method's response to ensure the local UI reflects the new role's permissions and capabilities.
A promise that resolves when the role change has been successfully accepted and applied.
acceptRoleChange
HMSSDK
Throws an error if the role change acceptance operation fails.
// Accept a role change request to become a 'moderator'
await hmsInstance.acceptRoleChange();
https://www.100ms.live/docs/react-native/v2/how-to-guides/interact-with-room/peer/change-role
Registers an event listener for various HMS SDK events.
This method allows the registration of callbacks for different types of events that can occur within the HMS SDK. These events include but are not limited to updates about the room, peers, tracks, and errors. The method dynamically adds listeners based on the specified action and associates them with a callback function to handle the event. It ensures that only one subscription exists per event type to avoid duplicate listeners.
The specific action/event to listen for.
The callback function to execute when the event occurs. The specifics of the callback parameters depend on the event type.
HMSSDK
hmsInstance.addEventListener(HMSUpdateListenerActions.ON_JOIN, (event) => {
console.log('Joined the room:', event);
});
hmsInstance.addEventListener(HMSUpdateListenerActions.ON_PEER_UPDATE, (event) => {
console.log('Peer update:', event);
});
Asynchronously cancels the preview for a role change.
This method is intended to be used after a previewForRole invocation. It cancels the ongoing preview operation,
effectively clearing any tracks that were created in anticipation of a role change. This is useful in scenarios where
a role change preview was initiated but needs to be aborted before the actual role change occurs, allowing for clean
state management and resource cleanup.
A promise that resolves with an object containing a data string.
cancelPreview
HMSSDK
// Cancel a previously initiated role change preview
await hmsInstance.cancelPreview();
Changes the video track used in Picture in Picture (PIP) mode on iOS devices.
This function is specifically designed for iOS platforms to switch the video track displayed in PIP mode.
It takes a HMSVideoTrack object as an argument, which contains the track ID of the video track to be displayed in PIP mode.
This allows for dynamic changes to the video source in PIP mode, enhancing the flexibility of video presentation in applications that support PIP.
The video track to be used in PIP mode. Must contain a valid trackId.
changeIOSPIPVideoTrack
HMSSDK
// Example of changing the video track for PIP mode on iOS
hms.changeIOSPIPVideoTrack(videoTrack).then(() => {
console.log('Video track for PIP mode changed successfully');
}).catch(error => {
console.error('Failed to change video track for PIP mode', error);
});
Asynchronously changes the metadata for the local peer.
This method updates the metadata field of the local peer in the room. The metadata is a versatile field that can be used to store various information such as the peer's current status (e.g., raising hand, be right back, etc.). It is recommended to use a JSON object in string format to store multiple data points within the metadata. This allows for a structured and easily parseable format for metadata management.
The new metadata in string format. It is advised to use a JSON string for structured data.
A promise that resolves when the metadata has been successfully changed.
Throws an error if the metadata change operation fails.
https://www.100ms.live/docs/react-native/v2/how-to-guides/interact-with-room/peer/change-metadata
// Changing metadata to indicate the peer is raising their hand
const newMetadata = JSON.stringify({ status: 'raiseHand' });
await hmsInstance.changeMetadata(newMetadata);
changeMetadata
HMSSDK
Asynchronously changes the name of the local peer.
This function updates the name of the local peer in the room. It is useful for scenarios where a user's display name needs to be updated during a session, such as when a user decides to change their nickname or when correcting a typo in the user's name. The updated name is reflected across all participants in the room.
Once the name change is successful, all the peers receive HMSUpdateListenerActions.ON_PEER_UPDATE event with HMSPeerUpdate.NAME_CHANGED as update type. When this event is received, the UI for that peer should be updated.
The new name to be set for the local peer.
A promise that resolves when the name change operation has been successfully completed.
Throws an error if the name change operation fails.
https://www.100ms.live/docs/react-native/v2/how-to-guides/interact-with-room/peer/change-name for more information on changing the peer's name.
changeName
HMSSDK
// Change the name of the local peer to 'Alice'
await hmsInstance.changeName("Alice");
Deprecated. Changes the role of a specified peer within the room.
This function is marked as deprecated and should not be used in new implementations. Use changeRoleOfPeer instead.
It allows for the dynamic adjustment of a peer's permissions and capabilities within the room by changing their role.
The role change can be enforced immediately or offered to the peer as a request, depending on the force parameter.
A promise that resolves when the role change operation is complete.
Since version 1.1.0. Use changeRoleOfPeer instead.
Throws an error if the operation fails.
https://www.100ms.live/docs/react-native/v2/how-to-guides/interact-with-room/peer/change-role
// Change the role of a peer to 'viewer' forcefully
const peer = { peerID: 'peer123', ... };
const newRole = { name: 'viewer', ... };
await hmsInstance.changeRole(peer, newRole, true);
changeRole
HMSSDK
Asynchronously changes the role of a specified peer within the room.
This function is designed to dynamically adjust a peer's permissions and capabilities within the room by changing their role.
It can enforce the role change immediately or offer it to the peer as a request, depending on the force parameter.
If the role change is forced, it is applied immediately without the peer's consent. Otherwise, the peer receives a role change request,
which can be accepted or declined. This functionality supports flexible room management and control over participant permissions.
A promise that resolves to true if the role change operation is successful, or false otherwise.
changeRoleOfPeer
Throws an error if the operation fails.
https://www.100ms.live/docs/react-native/v2/features/change-role
// Change the role of a peer to 'viewer' forcefully
const peer = { peerID: 'peer123', ... };
const newRole = { name: 'viewer', ... };
await hmsInstance.changeRoleOfPeer(peer, newRole, true);
changeRoleOfPeer
HMSSDK
Asynchronously changes the roles of multiple peers within the room.
This function is designed to batch update the roles of peers based on their current roles. It is particularly useful
in scenarios where a group of users need to be granted or restricted permissions en masse, such as promoting all viewers
to participants or demoting all speakers to viewers. The function updates the roles of all peers that have any of the specified
ofRoles to the new toRole without requiring individual consent, bypassing the roleChangeRequest listener on the peer's end.
A promise that resolves when the role change operation is complete.
changeRoleOfPeersWithRoles
Throws an error if the operation fails.
https://www.100ms.live/docs/react-native/v2/how-to-guides/interact-with-room/peer/change-role
// Change the role of all peers with 'viewer' role to 'participant'
const viewerRole = { name: 'viewer', ... };
const participantRole = { name: 'participant', ... };
await hmsInstance.changeRoleOfPeersWithRoles([viewerRole], participantRole);
HMSSDK
Asynchronously changes the mute state of a specified track.
This function is designed to control the mute state of any track (audio or video) within the room.
When invoked, it sends a request to the HMSManager to change the mute state of the specified track.
The targeted peer, whose track is being manipulated, will receive a callback on the onChangeTrackStateRequestListener,
allowing for custom handling or UI updates based on the mute state change.
The track object whose mute state is to be changed.
The desired mute state of the track. true to mute the track, false to unmute.
A promise that resolves when the operation to change the track's mute state is complete.
changeTrackState
Throws an error if the operation fails or the track cannot be found.
https://www.100ms.live/docs/react-native/v2/how-to-guides/interact-with-room/track/remote-mute
changeTrackState
HMSSDK
// Mute a specific track
const trackToMute = { trackId: 'track123', ... };
await hmsInstance.changeTrackState(trackToMute, true);
// Unmute a specific track
const trackToUnmute = { trackId: 'track456', ... };
await hmsInstance.changeTrackState(trackToUnmute, false);
Asynchronously changes the mute state of tracks for peers with specified roles.
This method extends the functionality of changeTrackState by allowing the mute state of all tracks (audio, video, etc.)
belonging to peers with certain roles to be changed in a single operation. It is particularly useful for managing the audio
and video state of groups of users, such as muting all participants except the speaker in a conference call.
The peers whose track states are being changed will receive a callback on onChangeTrackStateRequestListener, allowing for
custom handling or UI updates based on the mute state change.
The desired mute state of the tracks. true to mute, false to unmute.
Optional type: HMSTrackTypeOptional. The type of the tracks to be muted/unmuted (e.g., audio, video).
Optional source: stringOptional. The source of the track (e.g., camera, screen).
Optional roles: HMSRole[]The roles of the peers whose tracks are to be muted/unmuted. If not specified, affects all roles.
A promise that resolves when the operation to change the track's mute state is complete.
changeTrackStateForRoles
Throws an error if the operation fails.
HMSSDK
// Mute all audio tracks for peers with the role of 'viewer'
const viewerRole = { name: 'viewer', ... };
await hmsInstance.changeTrackStateForRoles(true, 'audio', undefined, [viewerRole]);
Asynchronously destroys the HMSSDK instance.
destroy method on the HMSManager with the instance's ID.A promise that resolves when the destruction process has completed.
If the HMSSDK instance cannot be destroyed.
await hmsInstance.destroy();
https://www.100ms.live/docs/react-native/v2/how-to-guides/install-the-sdk/hmssdk
HMSSDK
Disables network quality updates for the local peer.
This method deactivates the network quality monitoring feature, which stops the periodic assessment and reporting of the network quality of peers in a room. Disabling network quality updates can be useful in scenarios where network quality information is no longer needed, or to reduce the computational overhead associated with monitoring network quality. Once disabled, network quality updates will no longer be emitted through the event listeners, allowing the application to cease reacting to or displaying network status information.
disableNetworkQualityUpdates
HMSSDK
// Disable network quality updates
hmsInstance.disableNetworkQualityUpdates();
Enables network quality updates for the local peer.
This method activates the network quality monitoring feature, which periodically assesses and reports the network quality of peers in a room.
The network quality updates are useful for providing feedback to the user about their current connection status, potentially prompting them to improve their network environment if necessary.
Upon enabling, network quality updates are emitted through the appropriate event listeners - HMSPeerUpdate.NETWORK_QUALITY_UPDATED allowing the application to react or display the network status dynamically.
enableNetworkQualityUpdates
HMSSDK
// Enable network quality updates
hmsInstance.enableNetworkQualityUpdates();
Asynchronously ends the current room session for all participants.
This method is used to programmatically end the current room session, effectively disconnecting all participants.
It can also optionally lock the room to prevent new participants from joining. This is particularly useful for
managing the end of scheduled events or meetings, ensuring that all participants are removed at the same time.
Upon successful execution, all participants will receive a notification through the onRemovedFromRoomListener
indicating that they have been removed from the room.
A descriptive reason for ending the room session. This reason is communicated to all participants.
Optional lock: boolean = falseOptional. Specifies whether the room should be locked after ending the session. Default is false.
A promise that resolves when the room has been successfully ended and, optionally, locked.
// End the room and lock it to prevent rejoining
await hmsInstance.endRoom("Meeting concluded", true);
https://www.100ms.live/docs/react-native/v2/how-to-guides/interact-with-room/room/end-room
endRoom
HMSSDK
Asynchronously enters Picture in Picture (PIP) mode with optional configuration.
This method attempts to enter PIP mode based on the provided configuration.
It returns a promise that resolves to a boolean indicating the success of the operation.
If PIP mode is not supported or fails to activate, the promise may resolve to undefined or false.
Optional data: HMSPIPConfigOptional configuration for entering PIP mode. This can include settings such as autoEnterPipMode and aspectRatio.
true if PIP mode was successfully entered, false if unsuccessful or PIP mode is not supported.HMSSDK
// Example of entering Picture in Picture mode
hms.enterPipMode().then((success) => {
if (success) {
// Picture in Picture mode entered successfully
} else {
// Picture in Picture mode could not be entered
}
});
// Example of entering Picture in Picture mode with configuration
const success = await hms.enterPipMode({ autoEnterPipMode: true, aspectRatio: [16,9] });
if (success) {
// Picture in Picture mode entered successfully
} else {
// Picture in Picture mode could not be entered
}
Retrieves a list of audio output devices. Android only.
This method asynchronously fetches and returns an array of audio output devices available on the device. It is designed to work specifically on Android platforms. For iOS, it will reject the promise with a message indicating that the API is not available. This can be useful for applications that need to display or allow the user to select from available audio output options, such as speakers, headphones, or Bluetooth devices.
A promise that resolves to an array of HMSAudioDevice objects on Android. On iOS, the promise is rejected.
HMSSDK
// Get the list of audio output devices
const audioDevices = await hmsInstance.getAudioDevicesList();
Asynchronously retrieves the current audio mixing mode, with functionality currently limited to Android devices.
This method queries the native HMSManager module to obtain the current audio mixing mode used in the audio share session.
The audio mixing mode determines how local and remote audio tracks are mixed together during an audio share session.
Note: This feature is only supported on Android. Attempting to use this feature on iOS will result in a console log indicating that the API is not available for iOS devices.
A promise that resolves to a string indicating the current audio mixing mode.
getAudioMixingMode
HMSSDK
Throws an error if the operation fails or the audio mixing mode cannot be retrieved.
// Get the current audio mixing mode on an Android device
const mixingMode = await hmsInstance.getAudioMixingMode();
console.log(mixingMode); // Outputs the current audio mixing mode or a message for iOS
Retrieves the current audio output device type on Android devices.
This method is a wrapper function that returns the type of the current audio output device.
The return type is a HMSAudioDevice, which is an enumeration representing different types of audio output devices.
Note: This API is not available for iOS devices. If invoked on iOS, it logs a message indicating the unavailability and rejects the promise.
A promise that resolves to the current audio output device type if the platform is Android. If the platform is iOS, the promise is rejected.
HMSSDK
// Get the current audio output device type
const currentAudioOutputDevice = await hmsInstance.getAudioOutputRouteType();
Asynchronously retrieves an authentication token using the room code, user ID, and endpoint.
This method is responsible for fetching an authentication token that is required to join a room in the HMS ecosystem.
It makes a call to the HMSManager's getAuthTokenByRoomCode method, passing in the necessary parameters.
The function logs the attempt and returns the token as a string.
The unique code of the room for which the token is being requested.
Optional userId: stringOptional. The user ID of the participant requesting the token. This can be used for identifying the user in the backend.
Optional endpoint: stringOptional. The endpoint URL to which the token request is sent. This can be used to specify a different authentication server if needed.
A promise that resolves to the authentication token as a string.
If the authentication token cannot be retrieved.
const authToken = await hmsInstance.getAuthTokenByRoomCode('room-code');
getAuthTokenByRoomCode
HMSSDK
Retrieves the current local peer's details.
This asynchronous method wraps around the native getLocalPeer function, providing a straightforward way to obtain the current local peer's details,
including their ID, name, role, and any tracks they may be publishing. The local peer object is fetched from the native module and then processed
to match the expected format in the React Native layer. This method is particularly useful for operations that require information about the local user,
such as updating UI elements to reflect the current user's status or for debugging purposes.
A promise that resolves to the current local peer object.
getLocalPeer
HMSSDK
// Fetch the current local peer's details
const localPeerDetails = await hmsInstance.getLocalPeer();
console.log(localPeerDetails);
https://www.100ms.live/docs/react-native/v2/how-to-guides/listen-to-room-updates/get-methods
getPeerListIterator method returns an instance of HMSPeerListIterator class
Optional options: HMSPeerListIteratorOptionsoptions for configuring iterator
instance of HMSPeerListIterator class
Example usage:
const peerListIterator = hmsInstance.getPeerListIterator();
OR
const peerListIterator = hmsInstance.getPeerListIterator({
limit: 10,
byRoleName: 'viewer-realtime',
});
Retrieves a remote audio track by its track ID.
The unique identifier for the remote audio track to be retrieved.
A promise that resolves to the encoded remote audio track data.
Retrieves an array of remote peers currently in the room.
This asynchronous method serves as a wrapper around the native getRemotePeers function, facilitating the retrieval of remote peers' details.
It fetches an array of HMSRemotePeer objects, each representing a remote participant in the room. The method processes the fetched data
to conform to the expected format in the React Native layer, making it suitable for UI rendering or further processing.
A promise that resolves with an array of HMSRemotePeer objects, representing the remote peers in the room.
getRemotePeers
HMSSDK
// Fetch the list of remote peers in the room
const remotePeers = await hmsInstance.getRemotePeers();
console.log(remotePeers);
https://www.100ms.live/docs/react-native/v2/how-to-guides/listen-to-room-updates/get-methods
Asynchronously retrieves a remote video track by its track ID.
The unique identifier for the remote video track to be retrieved.
A promise that resolves to the encoded remote video track data.
Retrieves a list of all roles currently available in the room.
This asynchronous method calls the native getRoles function to fetch an array of HMSRole objects, representing the roles defined for the room.
Each HMSRole object includes details such as the role name, permissions, and other role-specific settings. The roles are then processed
to match the expected format in the React Native layer. This method is useful for operations that require a comprehensive list of roles,
such as displaying role options in a UI dropdown for role assignment or for role-based access control checks.
A promise that resolves with an array of HMSRole objects, representing the available roles in the room.
getRoles
HMSSDK
// Fetch the list of available roles in the room
const roles = await hmsInstance.getRoles();
console.log(roles);
Retrieves the current room's details.
This method acts as a wrapper around the native getRoom function, providing an easy way to obtain the current room's state and details,
including participants, tracks, and other relevant information. The room object is fetched from the native module and then processed
to match the expected format in the React Native layer. This method is useful for getting the room's state at any point in time, such as
when needing to display current room information or for debugging purposes.
A promise that resolves to the current room object.
getRoom
HMSSDK
// Fetch the current room details
const roomDetails = await hmsInstance.getRoom();
console.log(roomDetails);
https://www.100ms.live/docs/react-native/v2/how-to-guides/listen-to-room-updates/get-methods
Checks if audio sharing is currently active.
This asynchronous method determines whether audio sharing is currently active, with support limited to Android devices.
On Android, it queries the native HMSManager module to check the audio sharing status and returns a promise that resolves to a boolean value.
A promise that resolves to a boolean indicating whether audio sharing is currently active.
isAudioShared
HMSSDK
// Check if audio is being shared on an Android device
const isSharing = await hmsInstance.isAudioShared();
console.log(isSharing); // true or false based on the sharing status, or a message for iOS
HMSSDK
// Example of checking if Picture in Picture mode is supported
const isPipModeSupported = await hms.isPipModeSupported();
if (isPipModeSupported) {
// Picture in Picture mode is supported
} else {
// Picture in Picture mode is not supported
}
// Example of checking if Picture in Picture mode is supported
hms.isPipModeSupported().then((isPipModeSupported) => {
if (isPipModeSupported) {
// Picture in Picture mode is supported
} else {
// Picture in Picture mode is not supported
}
});
Checks if the screen sharing is currently active in the room.
This asynchronous method queries the native HMSManager module to determine if the screen is currently being shared by the local peer in the room.
It returns a promise that resolves to a boolean value, indicating the screen sharing status. true signifies that the screen sharing is active,
while false indicates that it is not. This method can be used to toggle UI elements or to decide whether to start or stop screen sharing based on the current state.
A promise that resolves to a boolean indicating whether the screen is currently shared.
isScreenShared
HMSSDK
// Check if the screen is currently shared
const isShared = await hmsInstance.isScreenShared();
console.log(isShared ? "Screen is being shared" : "Screen is not being shared");
https://www.100ms.live/docs/react-native/v2/how-to-guides/set-up-video-conferencing/screenshare
Asynchronously joins a room with the provided configuration
This method is responsible for initiating the process of joining a room in the HMS ecosystem. It performs several key actions:
join method on the HMSManager with the provided configuration and the instance ID.The configuration object required to join a room. This includes credentials, room details, and user information.
A promise that resolves when the join operation has been successfully initiated.
If the join operation cannot be completed.
await hmsInstance.join(hmsConfig);
https://www.100ms.live/docs/react-native/v2/how-to-guides/set-up-video-conferencing/join
join
HMSSDK
Asynchronously leaves the current room and performs cleanup.
This method triggers the leave process for the current user, effectively disconnecting them from the room they are in.
It logs the leave action with the user's ID, calls the native leave method in HMSManager with the user's ID,
and then performs additional cleanup through roomLeaveCleanup. This cleanup includes removing app state subscriptions
and clearing cached data related to peers and the room.
A promise that resolves to true if the user has successfully left the room, or false otherwise.
If the user cannot leave the room.
HMSSDK
await hmsInstance.leave();
https://www.100ms.live/docs/react-native/v2/features/leave
leave
HMSSDK
Listener for the PIPModeChanged event.
This listener is triggered when the Picture in Picture (PIP) mode is toggled on or off.
It is an important event for handling UI updates or other actions when the user enters or exits PIP mode.
The event data.
A boolean value indicating whether the user is currently in PIP mode.
HMSSDK
// Example of handling the `PIPModeChanged` event
hms.onPIPModeChanged((data) => {
if (data.isInPictureInPictureMode) {
// Handle PIP mode enabled
} else {
// Handle PIP mode disabled
}
});
Listener for the PIPRoomLeave event. Android only.
This listener is triggered when a room is left from the Picture in Picture (PIP) mode, which is currently supported only on Android platforms. It is an essential event for handling cleanup or UI updates when the user exits the room while in PIP mode.
The event data.
HMSSDK
// Example of handling the `PIPRoomLeave` event
hms.onPIPRoomLeave((data) => {
// Handle PIP room leave event
});
Listener for the SessionStoreAvailable event.
This listener is triggered when the session store becomes available in the SDK. It is an important event for developers who need to access or manipulate the session store after it has been initialized and made available.
The event data.
Initiates a preview for the local peer.
This function triggers the preview process for the local peer, allowing the application to display preview tracks (e.g., video or audio tracks) before joining a room. The response from the previewListener will contain the preview tracks for the local peer, which can be used to render a preview UI.
The configuration object required for previewing, including credentials and user details.
// Example usage of the preview function
const previewConfig = {
authToken: "your_auth_token",
userName: "John Doe",
roomCode: "your_room_code"
};
hmsInstance.preview(previewConfig);
https://www.100ms.live/docs/react-native/v2/features/preview
preview
HMSSDK
Asynchronously previews the audio and video tracks for a specific role before applying the role change.
This method allows users to preview the expected audio and video tracks that will be visible to other peers in the room after changing their role. It is useful for scenarios where a user wants to understand the impact of a role change on their media tracks before making the change. This can help in ensuring that the right media settings are applied for the new role.
The role for which the preview is requested. The role should be defined within the room's role configurations.
A promise that resolves with the preview tracks information. The resolved object contains details about the audio and video tracks that would be available to the user if the role were changed to the specified role.
// Preview the tracks for the 'speaker' role
const previewTracks = await hmsInstance.previewForRole('speaker');
console.log(previewTracks);
previewForRole
HMSSDK
Mutes the audio for all peers in the room.
This asynchronous function communicates with the native HMSManager module to mute the audio tracks of all remote peers in the room.
It is particularly useful in scenarios where a moderator needs to quickly mute all participants to prevent background noise or interruptions during a session.
A promise that resolves with a boolean value indicating the success of the operation.
remoteMuteAllAudio
HMSSDK
Throws an error if the operation fails.
// Mute all remote audio tracks in the room
await hmsInstance.remoteMuteAllAudio();
https://www.100ms.live/docs/react-native/v2/how-to-guides/interact-with-room/track/remote-mute
Removes an event listener for a specified event action.
This method allows for the deregistration of previously registered callbacks for specific event types within the HMS SDK. By specifying the action and the callback, it ensures that the event listener associated with that action is removed, preventing the callback from being executed when the event occurs in the future. This is useful for cleaning up resources and avoiding potential memory leaks in applications that dynamically add and remove event listeners based on component lifecycle or user interactions.
The specific action/event for which the listener is to be removed.
HMSSDK
// Remove a listener for the ON_JOIN event
hmsInstance.removeEventListener(HMSUpdateListenerActions.ON_JOIN, onJoinCallback);
Asynchronously removes a peer from the room.
This method forcefully disconnects a specified peer from the room.
Upon successful removal, the removed peer will receive a callback through the onRemovedFromRoomListener, indicating
they have been removed from the room.
This can be used for managing room participants, such as removing disruptive users or managing room capacity.
The peer object representing the participant to be removed.
A string detailing the reason for the removal. This reason is communicated to the removed peer, providing context for the action.
A promise that resolves when the peer has been successfully removed. If the operation fails, the promise will reject with an error.
// Assuming `peer` is an instance of HMSPeer representing the participant to remove
await hmsInstance.removePeer(peer, "Violation of room rules");
https://www.100ms.live/docs/react-native/v2/how-to-guides/interact-with-room/peer/remove-peer
removePeer
HMSSDK
Sends a broadcast message to all peers in the room.
This asynchronous function sends a message to all peers in the room, which they can receive through the onMessage listener.
It can be used to send chat messages or custom types of messages like emoji reactions or notifications.
The message to be sent to all peers.
Optional type: string = 'chat'The type of the message. Default is 'chat'. Custom types can be used for specific purposes.
A promise that resolves with the message ID of the sent message, or undefined if the message could not be sent.
// Sending a chat message to all peers
await hmsInstance.sendBroadcastMessage("Hello everyone!", "chat");
// Sending a custom notification to all peers
await hmsInstance.sendBroadcastMessage("Meeting starts in 5 minutes", "notification");
https://www.100ms.live/docs/react-native/v2/how-to-guides/set-up-video-conferencing/chat
sendBroadcastMessage
HMSSDK
Sends a direct message to a specific peer in the room.
This method allows sending a private message to a single peer, ensuring that only the specified recipient can receive and view the message.
The message is delivered to the recipient through the onMessage listener. This functionality is useful for implementing private chat features
within a larger group chat context.
The message text to be sent.
The peer object representing the recipient of the message.
Optional type: string = 'chat'The type of the message being sent. Defaults to 'chat'. This can be customized to differentiate between various message types (e.g., 'private', 'system').
A promise that resolves with an object containing the messageId of the sent message. If the message could not be sent, messageId will be undefined.
Throws an error if the message could not be sent.
// Sending a private chat message to a specific peer
const peer = { peerID: 'peer123', ... };
await hmsInstance.sendDirectMessage("Hello, this is a private message.", peer, "chat");
https://www.100ms.live/docs/react-native/v2/features/chat
sendDirectMessage
HMSSDK
Sends a message to a specific set of roles within the room.
This method allows for targeted communication by sending a message to peers who have any of the specified roles.
The message is received by the peers through the onMessage listener. This can be useful for sending announcements,
instructions, or other types of messages to a subset of the room based on their roles.
The message to be sent.
An array of roles to which the message will be sent. Peers with these roles will receive the message.
Optional type: string = 'chat'The type of the message. Defaults to 'chat'. Custom types can be used for specific messaging scenarios.
A promise that resolves with an object containing the messageId of the sent message. If the message could not be sent, messageId will be undefined.
// Sending a message to all peers with the role of 'moderator'
await hmsInstance.sendGroupMessage("Please start the meeting.", [moderator]);
https://www.100ms.live/docs/react-native/v2/features/chat
sendGroupMessage
HMSSDK
Sends timed metadata for HLS (HTTP Live Streaming) playback.
This asynchronous function is designed to send metadata that can be synchronized with the HLS video playback. The metadata is sent to all viewers of the HLS stream, allowing for a variety of use cases such as displaying song titles, ads, or other information at specific times during the stream. The metadata should be an array of HMSHLSTimedMetadata objects, each specifying the content and timing for the metadata display.
An array of metadata objects to be sent.
A promise that resolves to true if the metadata was successfully sent, or false otherwise.
sendHLSTimedMetadata
const metadata = [
{ time: 10, data: "Song: Example Song Title" },
{ time: 20, data: "Advertisement: Buy Now!" }
];
await hmsInstance.sendHLSTimedMetadata(metadata);
A boolean value indicating whether to enable or disable the automatic switching of the active speaker video track in PIP mode.
setActiveSpeakerInIOSPIP
HMSSDK
// Example of enabling the automatic switching of the active speaker video track in PIP mode
hms.setActiveSpeakerInIOSPIP(true).then(() => {
console.log('Active speaker video track enabled in PIP mode');
}).catch(error => {
console.error('Failed to enable active speaker video track in PIP mode', error);
});
Adds a listener for changes in the audio output device. This function is platform-specific and currently only implemented for Android devices. When the audio output device changes (e.g., switching from the phone speaker to a Bluetooth headset), the specified callback function is triggered. This can be useful for applications that need to react to changes in audio routing, such as updating the UI to reflect the current output device.
Note: This API is not available on iOS as of the current implementation. Attempting to use it on iOS will result in a rejected promise with an appropriate error message.
The function to be called when the audio output device changes. This function does not receive any parameters.
Sets the audio mixing mode for the current session. Android only.
This asynchronous function is used to change the mode of audio mixing during a session. It is currently
available only for Android. The function logs the action with the instance ID and the specified audio mixing mode,
then calls the native setAudioMixingMode method in HMSManager with the provided parameters.
If the platform is not Android, it logs a message indicating that the API is not available for iOS.
The audio mixing mode to be set.
A promise that resolves to a boolean indicating the success of the operation.
Throws an error if the operation fails or the audio mixing mode cannot be set.
await hmsInstance.setAudioMixingMode(HMSAudioMixingMode.TALK_AND_MUSIC);
HMSSDK
Updates the logger instance for this HMSSDK instance.
This method allows for the dynamic updating of the logger instance used by the HMSSDK. It can be used to change the logger settings or replace the logger entirely at runtime. This is particularly useful for adjusting log levels or redirecting log output based on application state or user preferences.
Optional hmsLogger: HMSLoggerThe new logger instance to be used. If not provided, the logger will be reset to default.
HMSSDK
// Set a custom logger with a specific configuration
const customLogger = new HMSLogger();
customLogger.setLevel('verbose');
hmsInstance.setLogger(customLogger);
Asynchronously sets the parameters for Picture in Picture (PIP) mode.
This method configures the PIP window according to the provided HMSPIPConfig settings. It can be used to adjust various aspects of the PIP mode, such as its size, aspect ratio, and more. The method returns a promise that resolves to a boolean indicating the success of the operation. If the PIP mode is not supported or the configuration fails, the promise may resolve to undefined or false.
Optional data: HMSPIPConfigOptional configuration for setting PIP mode parameters. This can include settings such as aspectRatio, autoEnterPipMode, etc.
true if the PIP parameters were successfully set, false if unsuccessful. undefined may be returned if PIP mode is not supported.HMSSDK
// Example of setting Picture in Picture mode parameters
hms.setPipParams({ aspectRatio: [16, 9], autoEnterPipMode: true }).then((success) => {
if (success) {
// Picture in Picture mode parameters set successfully
} else {
// Picture in Picture mode parameters could not be set
}
});
Sets the mute status for all remote audio tracks in the room for the local peer.
This method allows the local user to mute or unmute the playback of all remote audio tracks in the room. It affects only the local peer's audio playback and does not impact other peers. This can be useful in scenarios where a user needs to quickly mute all incoming audio without affecting the audio state for other participants in the room.
A boolean value indicating whether to mute (true) or unmute (false) all remote audio tracks for the local peer.
A promise that resolves with a boolean value indicating the success of the operation.
Throws an error if the operation fails.
setPlaybackForAllAudio
HMSSDK
// Mute all remote audio tracks for the local peer
hmsInstance.setPlaybackForAllAudio(true);
// Unmute all remote audio tracks for the local peer
hmsInstance.setPlaybackForAllAudio(false);
https://www.100ms.live/docs/react-native/v2/how-to-guides/interact-with-room/track/playback-allowed
Sets the volume for a specific track of any peer in the room.
This function allows the adjustment of the playback volume for any given audio track of a peer within the room. It is particularly useful for controlling the audio levels of individual participants in a conference call or meeting. The volume level is specified as a number. Volume level can vary from 0(min) to 10(max). The default value for volume is 1.0.
The track object whose volume is to be set. This object must include a valid trackId.
The volume level to set for the specified track.
A promise that resolves when the operation to set the track's volume is complete.
Throws an error if the operation fails or the track cannot be found.
https://www.100ms.live/docs/react-native/v2/how-to-guides/interact-with-room/track/set-volume
HMSSDK
// Assuming `track` is an instance of HMSTrack representing the participant's audio track
hmsInstance.setVolume(track, 10);
Starts streaming device audio, available only on Android devices.
This method allows the application to share device audio, such as music or system sounds, with other participants in a video conference.
It leverages the native HMSManager's startAudioshare method to initiate audio sharing. The function takes an HMSAudioMixingMode parameter,
which specifies the audio mixing mode to be used during the audio share session.
Note: This feature is currently supported only on Android. Attempting to use this feature on iOS will result in a console log indicating that the API is not available for iOS.
The audio mixing mode to be used for the audio share session.
A promise that resolves to a success if the audio share is started successfully
startAudioshare
Throws an error if the operation fails or the audio share cannot be started.
// Start audio sharing with the default mixing mode
await hmsInstance.startAudioshare(HMSAudioMixingMode.DEFAULT);
Initiates HLS (HTTP Live Streaming) based on the provided configuration.
This asynchronous function starts HLS streaming, allowing for live video content to be delivered over the internet in a scalable manner.
The function takes an optional HMSHLSConfig object as a parameter, which includes settings such as the meeting URL, HLS variant parameters, and recording settings.
The operation's response can be observed through the onRoomUpdate event, specifically when the HLS_STREAMING_STATE_UPDATED action is triggered, indicating the streaming state has been updated.
Optional data: HMSHLSConfigOptional configuration object for HLS streaming. Defines parameters such as meeting URL, HLS variants, and recording options.
A promise that resolves when the HLS streaming starts successfully. The promise resolves with the operation result.
Throws an error if the operation fails or if the provided configuration is invalid.
https://www.100ms.live/docs/react-native/v2/how-to-guides/record-and-live-stream/hls
startHLSStreaming
HMSSDK
await hmsInstance.startHLSStreaming();
Initiates RTMP streaming or recording based on the provided configuration.
This method starts RTMP streaming or recording by taking a configuration object of type HMSRTMPConfig.
The configuration specifies the URLs for streaming and whether recording should be enabled. The response to this
operation can be observed in the onRoomUpdate event, specifically when the RTMP_STREAMING_STATE_UPDATED action is triggered.
The configuration object for RTMP streaming or recording. It includes streaming URLs and recording settings.
A promise that resolves with the operation result when the streaming or recording starts successfully.
Throws an error if the operation fails or the configuration is invalid.
https://www.100ms.live/docs/react-native/v2/how-to-guides/record-and-live-stream/recording
const rtmpConfig = {
meetingURL: "https://meet.example.com/myMeeting",
rtmpURLs: ["rtmp://live.twitch.tv/app", "rtmp://a.rtmp.youtube.com/live2"],
record: true,
resolution: { width: 1280, height: 720 }
};
await hmsInstance.startRTMPOrRecording(rtmpConfig);
startRTMPOrRecording
HMSSDK
Initiates real-time transcription services.
This asynchronous function triggers the HMSManager to start real-time transcription services, capturing and transcribing audio in real time.
startRealTimeTranscription
HMSSDK
// Example of starting real-time transcription services
await hmsInstance.startRealTimeTranscription();
https://www.100ms.live/docs/react-native/v2/how-to-guides/extend-capabilities/live-captions
Initiates screen sharing in the room.
This asynchronous function triggers the screen sharing feature, allowing the local peer to share their screen with other participants in the room. Upon successful execution, other participants in the room will be able to see the shared screen as part of the video conference.
Note: Proper permissions must be granted by the user for screen sharing to work. Ensure to handle permission requests appropriately in your application.
A promise that resolves when the screen sharing has successfully started.
startScreenshare
HMSSDK
Throws an error if the operation fails or screen sharing cannot be initiated.
https://www.100ms.live/docs/react-native/v2/how-to-guides/set-up-video-conferencing/screenshare
// Start screen sharing
await hmsInstance.startScreenshare();
Stops the streaming of device audio, with functionality currently limited to Android devices.
This asynchronous method communicates with the native HMSManager module to stop the audio sharing session that was previously started.
It is primarily used when the application needs to cease sharing device audio, such as music or system sounds, with other participants in a video conference.
On Android devices, it successfully terminates the audio share session. On iOS devices, since the feature is not supported, it logs a message indicating the unavailability of the API.
A promise that resolves to a boolean indicating the success of the operation.
stopAudioshare
HMSSDK
// Stop audio sharing
await hmsInstance.stopAudioshare();
Stops the ongoing HLS (HTTP Live Streaming) streams.
This asynchronous function is responsible for stopping any active HLS streaming sessions.
It communicates with the native HMSManager module to execute the stop operation.
The completion or status of this operation can be observed through the onRoomUpdate event, specifically when the HLS_STREAMING_STATE_UPDATED action is triggered, indicating that the HLS streaming has been successfully stopped.
A promise that resolves when the HLS streaming has been successfully stopped.
stopHLSStreaming
https://www.100ms.live/docs/react-native/v2/how-to-guides/record-and-live-stream/hls for more details on HLS streaming.
HMSSDK
await hmsInstance.stopHLSStreaming();
Stops the real-time transcription services.
This asynchronous function signals the HMSManager to terminate the ongoing real-time transcription services.
stopRealTimeTranscription
HMSSDK
await hmsInstance.stopRealTimeTranscription();
https://www.100ms.live/docs/react-native/v2/how-to-guides/extend-capabilities/live-captions
Stops all ongoing RTMP streaming and recording.
This function is responsible for halting any active RTMP streaming or recording sessions.
It communicates with the native HMSManager module to execute the stop operation.
The completion or status of this operation can be monitored through the onRoomUpdate event, specifically when the RTMP_STREAMING_STATE_UPDATED action is triggered, indicating that the streaming or recording has been successfully stopped.
A promise that resolves when the RTMP streaming and recording have been successfully stopped.
stopRtmpAndRecording
https://www.100ms.live/docs/react-native/v2/how-to-guides/record-and-live-stream/recording
HMSSDK
await hmsInstance.stopRtmpAndRecording();
Asynchronously stops the screen sharing session.
This method communicates with the native HMSManager module to stop the ongoing screen sharing session initiated by the local peer.
Upon successful execution, the screen sharing session is terminated, and other participants
in the room will no longer be able to see the shared screen. This method can be used to programmatically control the end of a screen sharing session,
providing flexibility in managing the screen sharing feature within your application.
Note: Ensure that the necessary permissions and conditions for screen sharing are managed appropriately in your application.
A promise that resolves when the screen sharing has successfully stopped.
stopScreenshare
HMSSDK
Throws an error if the operation fails or the screen sharing cannot be stopped.
https://www.100ms.live/docs/react-native/v2/how-to-guides/set-up-video-conferencing/screenshare
// Stop screen sharing
await hmsInstance.stopScreenshare();
Switches the audio output device to a specified device. This function is a wrapper around the native module's method to change the audio output route. It allows for changing the audio output to a device other than the default one, such as a Bluetooth headset or speaker.
The audio device to switch the output to. This should be one of the devices available in HMSAudioDevice.
A promise that resolves when the audio output device is successfully switched. Rejected if the operation fails.
// To switch audio output to a Bluetooth device
hmsSDK.switchAudioOutput(HMSAudioDevice.Bluetooth);
HMSSDK
Static buildAsynchronously builds and returns an instance of the HMSSDK class.
This method initializes the HMSSDK with optional configuration parameters and returns the initialized instance. It is responsible for setting up the SDK with specific settings for track management, app groups, extensions for iOS screen sharing, logging configurations, etc.
Optional params: { Optional configuration parameters for initializing the HMSSDK.
Optional appis an optional value only required for implementing Screen & Audio Share on iOS. They are not required for Android. DO NOT USE if your app does not implements Screen or Audio Share on iOS.
Optional haltOptional flag to halt the preview/join process until permissions are explicitly granted by the user. Android only. This is particularly useful when you might want to request permissions before proceeding with the preview or join operation.
Optional isOptional logOptional settings for logging.
Optional preferredis an optional value only required for implementing Screen & Audio Share on iOS. They are not required for Android. DO NOT USE if your app does not implements Screen or Audio Share on iOS.
Optional trackis an optional value only required to enable features like iOS Screen/Audio Share, Android Software Echo Cancellation, etc
A promise that resolves to an instance of HMSSDK.
If the HMSSDK instance cannot be created.
// Regular usage:
const hmsInstance = await HMSSDK.build();
// Advanced Usage:
const hmsInstance = await HMSSDK.build({
trackSettings: {...},
appGroup: 'group.example',
preferredExtension: 'com.example.extension',
logSettings: {...},
});
https://www.100ms.live/docs/react-native/v2/how-to-guides/install-the-sdk/hmssdk
build
HMSSDK
Static getRetrieves the current logger instance used by the HMSSDK.
This static method provides access to the logger instance, allowing for the manipulation of log levels and the retrieval of log information. It is useful for debugging purposes, enabling developers to monitor and adjust the verbosity of logs generated by the HMS SDK.
The current logger instance.
HMSSDK
const logger = HMSSDK.getLogger();
logger.setLevel('debug'); // Adjusting the log level to debug
Generated using TypeDoc
Represents the main SDK class for the 100ms (HMS) video conferencing service in a React Native application. This class provides methods to manage the video conferencing lifecycle including joining a room, leaving a room, managing streams, and handling events.
Export
Example
See
https://www.100ms.live/docs/react-native/v2/quickstart/quickstart