Skip to content

Commit dca5cba

Browse files
davidliudavidliu
authored
feat: e2ee implementation (#185)
* feat: e2ee implementation * fix: fix imports * chore: lint * chore: update min supported ios version to 14
1 parent 375c426 commit dca5cba

19 files changed

+531
-64
lines changed

‎ci/ios/Podfile

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ require Pod::Executable.execute_command('node', ['-p',
55
{paths: [process.argv[1]]},
66
)', __dir__]).strip
77

8-
platform :ios, min_ios_version_supported
8+
platform :ios, 14.0
99
prepare_react_native_project!
1010

1111
linkage = ENV['USE_FRAMEWORKS']

‎ci/ios/Podfile.lock

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -7,12 +7,12 @@ PODS:
77
- hermes-engine (0.74.2):
88
- hermes-engine/Pre-built (= 0.74.2)
99
- hermes-engine/Pre-built (0.74.2)
10-
- livekit-react-native (2.4.2):
10+
- livekit-react-native (2.4.3):
1111
- livekit-react-native-webrtc
1212
- React-Core
13-
- livekit-react-native-webrtc (125.0.5):
13+
- livekit-react-native-webrtc (125.0.6):
1414
- React-Core
15-
- WebRTC-SDK (~> 125.6422.05)
15+
- WebRTC-SDK (~> 125.6422.06)
1616
- RCT-Folly (2024.01.01.00):
1717
- boost
1818
- DoubleConversion
@@ -1171,7 +1171,7 @@ PODS:
11711171
- React-perflogger (= 0.74.2)
11721172
- React-utils (= 0.74.2)
11731173
- SocketRocket (0.7.0)
1174-
- WebRTC-SDK (125.6422.05)
1174+
- WebRTC-SDK (125.6422.06)
11751175
- Yoga (0.0.0)
11761176

11771177
DEPENDENCIES:
@@ -1361,8 +1361,8 @@ SPEC CHECKSUMS:
13611361
fmt: 4c2741a687cc09f0634a2e2c72a838b99f1ff120
13621362
glog: c5d68082e772fa1c511173d6b30a9de2c05a69a2
13631363
hermes-engine: 01d3e052018c2a13937aca1860fbedbccd4a41b7
1364-
livekit-react-native: e9b507c3df7d55d9c306a9d3ac7455d02ce3596f
1365-
livekit-react-native-webrtc: 081ba1baabf80183f35ac840fc3a787e99b45e45
1364+
livekit-react-native: b93bfc9038869dcbd5cee53b419c956c28e44949
1365+
livekit-react-native-webrtc: 7f040d0557b0e0903d6cfe4977ddf608462988c6
13661366
RCT-Folly: 02617c592a293bd6d418e0a88ff4ee1f88329b47
13671367
RCTDeprecation: b03c35057846b685b3ccadc9bfe43e349989cdb2
13681368
RCTRequired: 194626909cfa8d39ca6663138c417bc6c431648c
@@ -1411,9 +1411,9 @@ SPEC CHECKSUMS:
14111411
React-utils: 4476b7fcbbd95cfd002f3e778616155241d86e31
14121412
ReactCommon: ecad995f26e0d1e24061f60f4e5d74782f003f12
14131413
SocketRocket: abac6f5de4d4d62d24e11868d7a2f427e0ef940d
1414-
WebRTC-SDK: 1990a1a595bd0b59c17485ce13ff17f575732c12
1414+
WebRTC-SDK: 79942c006ea64f6fb48d7da8a4786dfc820bc1db
14151415
Yoga: ae3c32c514802d30f687a04a6a35b348506d411f
14161416

1417-
PODFILE CHECKSUM: 7927865c347f4d00f3934d2c6585d16bb3e659e6
1417+
PODFILE CHECKSUM: 7e787510e5e3fbe259a5a7507ea2e7e1b1ff65ef
14181418

14191419
COCOAPODS: 1.13.0

‎ci/yarn.lock

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2159,15 +2159,15 @@ __metadata:
21592159
linkType: hard
21602160

21612161
"@livekit/react-native-webrtc@npm:^125.0.5":
2162-
version: 125.0.5
2163-
resolution: "@livekit/react-native-webrtc@npm:125.0.5"
2162+
version: 125.0.6
2163+
resolution: "@livekit/react-native-webrtc@npm:125.0.6"
21642164
dependencies:
21652165
base64-js: 1.5.1
21662166
debug: 4.3.4
21672167
event-target-shim: 6.0.2
21682168
peerDependencies:
21692169
react-native: ">=0.60.0"
2170-
checksum: 3c492575156b5d243b03fdb6ed05881c9daaaddad05083f0bfa6d604cc0962f434a46d5fdbd592333caebcdab6d10d8bc3657aa227b6d726c6c853aa49e793be
2170+
checksum: 7c715568b4899bae718b39bd9bf1d72a346afdab008f6fd47b903f6bf96eabf9a7457d0de6835e4e76750754c7fc6f4a460fa4176733d8ba189e7cd2dc1f5e36
21712171
languageName: node
21722172
linkType: hard
21732173

‎example/index.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
import { AppRegistry } from 'react-native';
22
import App from './src/App';
33
import { name as appName } from './app.json';
4-
import { registerGlobals } from '@livekit/react-native';
5-
import { LogLevel, setLogLevel } from 'livekit-client';
4+
import { registerGlobals, setLogLevel } from '@livekit/react-native';
5+
import { LogLevel } from 'livekit-client';
66
import { setupErrorLogHandler } from './src/utils/ErrorLogHandler';
77
import { setupCallService } from './src/callservice/CallService';
88

‎example/ios/Podfile

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ require Pod::Executable.execute_command('node', ['-p',
55
{paths: [process.argv[1]]},
66
)', __dir__]).strip
77

8-
platform :ios, min_ios_version_supported
8+
platform :ios, 14.0
99
prepare_react_native_project!
1010

1111
linkage = ENV['USE_FRAMEWORKS']

‎example/ios/Podfile.lock

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -10,9 +10,9 @@ PODS:
1010
- livekit-react-native (2.4.3):
1111
- livekit-react-native-webrtc
1212
- React-Core
13-
- livekit-react-native-webrtc (125.0.5):
13+
- livekit-react-native-webrtc (125.0.6):
1414
- React-Core
15-
- WebRTC-SDK (~> 125.6422.05)
15+
- WebRTC-SDK (~> 125.6422.06)
1616
- RCT-Folly (2024.01.01.00):
1717
- boost
1818
- DoubleConversion
@@ -1201,7 +1201,7 @@ PODS:
12011201
- ReactCommon/turbomodule/core
12021202
- Yoga
12031203
- SocketRocket (0.7.0)
1204-
- WebRTC-SDK (125.6422.05)
1204+
- WebRTC-SDK (125.6422.06)
12051205
- Yoga (0.0.0)
12061206

12071207
DEPENDENCIES:
@@ -1407,7 +1407,7 @@ SPEC CHECKSUMS:
14071407
glog: fdfdfe5479092de0c4bdbebedd9056951f092c4f
14081408
hermes-engine: 01d3e052018c2a13937aca1860fbedbccd4a41b7
14091409
livekit-react-native: b93bfc9038869dcbd5cee53b419c956c28e44949
1410-
livekit-react-native-webrtc: 081ba1baabf80183f35ac840fc3a787e99b45e45
1410+
livekit-react-native-webrtc: 7f040d0557b0e0903d6cfe4977ddf608462988c6
14111411
RCT-Folly: 02617c592a293bd6d418e0a88ff4ee1f88329b47
14121412
RCTDeprecation: b03c35057846b685b3ccadc9bfe43e349989cdb2
14131413
RCTRequired: 194626909cfa8d39ca6663138c417bc6c431648c
@@ -1461,9 +1461,9 @@ SPEC CHECKSUMS:
14611461
RNCAsyncStorage: 0c357f3156fcb16c8589ede67cc036330b6698ca
14621462
RNScreens: b32a9ff15bea7fcdbe5dff6477bc503f792b1208
14631463
SocketRocket: abac6f5de4d4d62d24e11868d7a2f427e0ef940d
1464-
WebRTC-SDK: 1990a1a595bd0b59c17485ce13ff17f575732c12
1464+
WebRTC-SDK: 79942c006ea64f6fb48d7da8a4786dfc820bc1db
14651465
Yoga: ae3c32c514802d30f687a04a6a35b348506d411f
14661466

1467-
PODFILE CHECKSUM: 6fcbd8445e8602c6a7ab17fb1523c62772c821da
1467+
PODFILE CHECKSUM: b5aad0c7d12b2ea501eb822f98f00ca01d154bd9
14681468

14691469
COCOAPODS: 1.13.0

‎example/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
"postinstall": "patch-package"
1111
},
1212
"dependencies": {
13-
"@livekit/react-native-webrtc": "^125.0.5",
13+
"@livekit/react-native-webrtc": "^125.0.6",
1414
"@react-native-async-storage/async-storage": "^1.17.10",
1515
"@react-navigation/native": "^6.0.8",
1616
"@react-navigation/native-stack": "^6.5.0",

‎example/src/App.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,5 +23,5 @@ export default function App() {
2323

2424
export type RootStackParamList = {
2525
PreJoinPage: undefined;
26-
RoomPage: { url: string; token: string };
26+
RoomPage: { url: string; token: string; e2ee: boolean; e2eeKey: string };
2727
};

‎example/src/PreJoinPage.tsx

Lines changed: 75 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -2,23 +2,37 @@ import * as React from 'react';
22
import { useState, useEffect } from 'react';
33
import type { NativeStackScreenProps } from '@react-navigation/native-stack';
44

5-
import { StyleSheet, View, TextInput, Text, Button } from 'react-native';
5+
import {
6+
StyleSheet,
7+
View,
8+
TextInput,
9+
Text,
10+
Button,
11+
Switch,
12+
} from 'react-native';
613
import type { RootStackParamList } from './App';
714
import { useTheme } from '@react-navigation/native';
815
import AsyncStorage from '@react-native-async-storage/async-storage';
916

10-
const DEFAULT_URL = 'wss://www.example.com';
11-
const DEFAULT_TOKEN = '';
17+
const DEFAULT_URL = 'ws://192.168.11.3:7880';
18+
const DEFAULT_TOKEN =
19+
'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJleHAiOjE3MzU3ODc4OTYsImlzcyI6IkFQSVRMV3JLOHRid3I0NyIsIm5iZiI6MTczMzE5NTg5Niwic3ViIjoicGhvbmUiLCJ2aWRlbyI6eyJyb29tIjoibXlyb29tIiwicm9vbUpvaW4iOnRydWV9fQ.2ucoFK_t1rX8cnUVdx_7nS-TOGv_2Io6uNEw11kPs3M';
20+
const DEFAULT_E2EE = false;
21+
const DEFAULT_E2EE_KEY = '';
1222

1323
const URL_KEY = 'url';
1424
const TOKEN_KEY = 'token';
25+
const E2EE_KEY = 'e2eeEnabled';
26+
const E2EE_SHARED_KEY_KEY = 'e2eeSharedKey';
1527

1628
export const PreJoinPage = ({
1729
navigation,
1830
}: NativeStackScreenProps<RootStackParamList, 'PreJoinPage'>) => {
1931
const [url, setUrl] = useState(DEFAULT_URL);
2032
const [token, setToken] = useState(DEFAULT_TOKEN);
21-
33+
const [e2eeEnabled, setE2EE] = useState(DEFAULT_E2EE);
34+
const [e2eeKey, setE2EEKey] = useState(DEFAULT_E2EE_KEY);
35+
const toggleE2EE = () => setE2EE((previousState) => !previousState);
2236
useEffect(() => {
2337
AsyncStorage.getItem(URL_KEY).then((value) => {
2438
if (value) {
@@ -31,14 +45,44 @@ export const PreJoinPage = ({
3145
setToken(value);
3246
}
3347
});
48+
AsyncStorage.getItem(E2EE_KEY).then((value) => {
49+
if (value) {
50+
setE2EE(value === 'true');
51+
}
52+
});
53+
AsyncStorage.getItem(E2EE_SHARED_KEY_KEY).then((value) => {
54+
if (value) {
55+
setE2EEKey(value);
56+
}
57+
});
3458
}, []);
3559

3660
const { colors } = useTheme();
3761

38-
let saveValues = (saveUrl: string, saveToken: string) => {
62+
let e2eeKeyInputTitle = <Text style={{ color: colors.text }}>E2EE Key</Text>;
63+
let e2eeKeyInput = (
64+
<TextInput
65+
style={{
66+
color: colors.text,
67+
borderColor: colors.border,
68+
...styles.input,
69+
}}
70+
onChangeText={setE2EEKey}
71+
value={e2eeKey}
72+
/>
73+
);
74+
let saveValues = (
75+
saveUrl: string,
76+
saveToken: string,
77+
saveE2EE: boolean,
78+
saveE2EEKey: string
79+
) => {
3980
AsyncStorage.setItem(URL_KEY, saveUrl);
4081
AsyncStorage.setItem(TOKEN_KEY, saveToken);
82+
AsyncStorage.setItem(E2EE_KEY, saveE2EE.toString());
83+
AsyncStorage.setItem(E2EE_SHARED_KEY_KEY, saveE2EEKey);
4184
};
85+
4286
return (
4387
<View style={styles.container}>
4488
<Text style={{ color: colors.text }}>URL</Text>
@@ -63,10 +107,25 @@ export const PreJoinPage = ({
63107
value={token}
64108
/>
65109

110+
<Text style={{ color: colors.text }}>Enable E2EE</Text>
111+
<Switch onValueChange={toggleE2EE} value={e2eeEnabled} />
112+
113+
<View style={styles.spacer} />
114+
115+
{e2eeEnabled ? e2eeKeyInputTitle : null}
116+
{e2eeEnabled ? e2eeKeyInput : null}
117+
118+
<View style={styles.spacer} />
119+
66120
<Button
67121
title="Connect"
68122
onPress={() => {
69-
navigation.push('RoomPage', { url: url, token: token });
123+
navigation.push('RoomPage', {
124+
url,
125+
token,
126+
e2ee: e2eeEnabled,
127+
e2eeKey,
128+
});
70129
}}
71130
/>
72131

@@ -75,7 +134,7 @@ export const PreJoinPage = ({
75134
<Button
76135
title="Save Values"
77136
onPress={() => {
78-
saveValues(url, token);
137+
saveValues(url, token, e2eeEnabled, e2eeKey);
79138
}}
80139
/>
81140

@@ -84,9 +143,16 @@ export const PreJoinPage = ({
84143
<Button
85144
title="Reset Values"
86145
onPress={() => {
87-
saveValues(DEFAULT_URL, DEFAULT_TOKEN);
146+
saveValues(
147+
DEFAULT_URL,
148+
DEFAULT_TOKEN,
149+
DEFAULT_E2EE,
150+
DEFAULT_E2EE_KEY
151+
);
88152
setUrl(DEFAULT_URL);
89153
setToken(DEFAULT_TOKEN);
154+
setE2EE(DEFAULT_E2EE);
155+
setE2EEKey(DEFAULT_E2EE_KEY);
90156
}}
91157
/>
92158
</View>
@@ -105,7 +171,7 @@ const styles = StyleSheet.create({
105171
marginVertical: 20,
106172
},
107173
input: {
108-
width: '100%',
174+
width: '90%',
109175
height: 40,
110176
margin: 12,
111177
borderWidth: 1,

‎example/src/RoomPage.tsx

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,7 @@ import {
2828
type ReceivedDataMessage,
2929
AndroidAudioTypePresets,
3030
useIOSAudioManagement,
31+
useRNE2EEManager,
3132
} from '@livekit/react-native';
3233
import { Platform } from 'react-native';
3334
// @ts-ignore
@@ -44,7 +45,7 @@ export const RoomPage = ({
4445
navigation,
4546
route,
4647
}: NativeStackScreenProps<RootStackParamList, 'RoomPage'>) => {
47-
const { url, token } = route.params;
48+
const { url, token, e2ee, e2eeKey } = route.params;
4849
useEffect(() => {
4950
let start = async () => {
5051
// Perform platform specific call setup.
@@ -66,13 +67,17 @@ export const RoomPage = ({
6667
};
6768
}, []);
6869

70+
let { e2eeManager } = useRNE2EEManager({ sharedKey: e2eeKey });
71+
let e2eeOptions = e2ee ? { e2eeManager } : undefined;
72+
6973
return (
7074
<LiveKitRoom
7175
serverUrl={url}
7276
token={token}
7377
connect={true}
7478
options={{
7579
adaptiveStream: { pixelDensity: 'screen' },
80+
e2ee: e2eeOptions,
7681
}}
7782
audio={true}
7883
video={true}
@@ -89,6 +94,13 @@ interface RoomViewProps {
8994
const RoomView = ({ navigation }: RoomViewProps) => {
9095
const [isCameraFrontFacing, setCameraFrontFacing] = useState(true);
9196
const room = useRoomContext();
97+
useEffect(() => {
98+
let setup = async () => {
99+
await room.setE2EEEnabled(true);
100+
};
101+
setup();
102+
return () => {};
103+
}, [room]);
92104

93105
useIOSAudioManagement(room, true);
94106
// Setup room listeners

‎example/yarn.lock

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2149,16 +2149,16 @@ __metadata:
21492149
languageName: node
21502150
linkType: hard
21512151

2152-
"@livekit/react-native-webrtc@npm:^125.0.5":
2153-
version: 125.0.5
2154-
resolution: "@livekit/react-native-webrtc@npm:125.0.5"
2152+
"@livekit/react-native-webrtc@npm:^125.0.6":
2153+
version: 125.0.6
2154+
resolution: "@livekit/react-native-webrtc@npm:125.0.6"
21552155
dependencies:
21562156
base64-js: 1.5.1
21572157
debug: 4.3.4
21582158
event-target-shim: 6.0.2
21592159
peerDependencies:
21602160
react-native: ">=0.60.0"
2161-
checksum: 3c492575156b5d243b03fdb6ed05881c9daaaddad05083f0bfa6d604cc0962f434a46d5fdbd592333caebcdab6d10d8bc3657aa227b6d726c6c853aa49e793be
2161+
checksum: 7c715568b4899bae718b39bd9bf1d72a346afdab008f6fd47b903f6bf96eabf9a7457d0de6835e4e76750754c7fc6f4a460fa4176733d8ba189e7cd2dc1f5e36
21622162
languageName: node
21632163
linkType: hard
21642164

@@ -6079,7 +6079,7 @@ __metadata:
60796079
"@babel/core": ^7.20.0
60806080
"@babel/preset-env": ^7.20.0
60816081
"@babel/runtime": ^7.20.0
6082-
"@livekit/react-native-webrtc": ^125.0.5
6082+
"@livekit/react-native-webrtc": ^125.0.6
60836083
"@react-native-async-storage/async-storage": ^1.17.10
60846084
"@react-native/babel-preset": 0.74.84
60856085
"@react-native/eslint-config": 0.74.84

0 commit comments

Comments
 (0)