End-to-End Encryption (E2EE) - React Native

Overview

End-to-end encryption (E2EE) ensures that your media content remains private and secure by encrypting it on the sender's device and decrypting it only on the receiver's device. This prevents intermediaries, including VideoSDK servers, from accessing or modifying the content.

E2EE is particularly important for applications in security-critical domains such as telehealth, finance, and legal services.

How E2EE Works

• E2EE is applied at the room level, where a single shared key encrypts and decrypts all media tracks during a session.
• Participants without the key cannot access the media.
• The entire encryption process is handled client-side. VideoSDK does not access or store any encryption keys.

Key Management & Distribution

You are fully responsible for generating, managing, and securely distributing encryption keys to all participants. VideoSDK never stores, accesses, or transfers your encryption keys.

• Common Key Distribution Approaches:
  • Generate the key on your server when creating a meeting.
  • Send the key securely along with the meeting access token.
  • Use HTTPS-secured API calls to fetch the key on the client.

important

⚠️ Ensure that all participants have access to the correct encryption key before joining the room.

The table below shows the minimum SDK versions that support E2EE. All subsequent versions also include E2EE support.

iOS	React	React Native	Flutter	Android	JavaScript
2.2.2	Coming Soon	0.2.1	2.1.0	Coming Soon	Coming Soon

Enabling E2EE in VideoSDK React Native

To enable E2EE in VideoSDK for React Native, follow these steps:

import {
  MeetingProvider,
  useKeyProvider,
} from "@videosdk.live/react-native-sdk";

export default function App() {
  const keyProvider = useKeyProvider({ discardFrameWhenCryptorNotReady: true });
  keyProvider?.setSharedKey("<YOUR-SECURE-KEY>");

  return (
    <MeetingProvider
      config={{
        meetingId: "meeting-id",
        micEnabled: true,
        webcamEnabled: true,
        name: "Test User",
      }}
      token="your-token"
      keyProvider={keyProvider || null} // Enables End-to-End Encryption (E2EE)
    >
      <MeetingView />
    </MeetingProvider>
  );
}

Additional Configuration Options

You can customize the encryption behavior by passing parameters while creating the BaseKeyProvider instance:

Parameter	Type	Description
discardFrameWhenCryptorNotReady	bool	If true, frames will be discarded when the cryptor is not ready, ensuring no unencrypted content is sent.

warning

Make sure to set the encryption key using setSharedKey before passing it in as a prop to MeetingProvider.

Event for E2EE State Changes

To monitor encryption state changes for each participant's media stream:

• It returns the state of encryption/decryption along with the media kind (audio/video/share).

import { useParticipant } from "@videosdk.live/react-native-sdk";

const {onE2EEStateChanged} = useParticipant(participantId);
  onE2EEStateChanged((stateInfo) => {
    console.log("State Changed to", stateInfo.state, "for kind", stateInfo.kind);
  });

The possible values for state are:

State	Description
EncryptionSuccess	Media encryption is successfully applied.
DecryptionSuccess	Incoming media is successfully decrypted.
EncryptionFailed	Encryption encountered an error.
DecryptionFailed	Decryption encountered an error.
InternalError	Internal processing error occurred.

To Check Whether E2EE enable not

You can check whether E2EE is enabled by using e2eeEnabled property of useMeeting hook.

import { useMeeting } from "@videosdk.live/react-native-sdk";
  
const {e2eeEnabled} = useMeeting();
console.log('is e2eeEnabled', e2eeEnabled);

Limitations

E2EE only applies to media. It does not apply to:

• Chat messages or metadata
• API calls and signaling data

These communications are still protected by TLS but are not encrypted end-to-end.

info

Recording and transcription features are not supported when End-to-End Encryption (E2EE) is enabled.