e2ee. (#226)

* chore: e2ee.

* update.

* update.

* update.

* update.

* chore: Use feat/frame-encryption branch of flutter-webrtc.

* chore: Add E2EEKEY defines for dart environment, and e2ee switch.

* Add encodedInsertableStreams to RTCConfiguration.

* update.

* feat: Add e2ee indicator for Participant.

* feat: add e2ee worker js for flutter web.

* dart format.

* remove unused file.

* fix flutter analyze .

* update.

* update.

* add: indicate for decryption failure, and string key.

* remove .lock files.

* update.

* update.

* update e2ee.worker for web.

* feat: support setCodecPreferences.

* state TrackE2EEStateEvent.

* fix wrong import interface from dart_webrtc.

* update.

* update.

* update.

* update.

* update pubspec.lock.

* chore: update protocol and add EncryptionType for Participant.

* Update lib/src/e2ee/options.dart

Co-authored-by: Théo Monnom <[email protected]>

* fix typo.

* revert changes for internal import.

* Add _cleanUp() for previous room.

* Add e2ee supports detection method for native/web.

* Remove redundant overriding methods.

* dart format.

* Add e2ee.worker code and deployment docs.

* chore: remove duplicate words.

* chore: using Pbkdf2 derive the key.

* Update pubspec.yaml

* fix e2ee for safari.

* fix key length.

* update e2ee.worker.dart.js.

* fix.

* update proto.

* update.

* chore: add simulate for rachetKey.

* update.

* chore: key ratchet for flutter web.

* update.

* update.

* update.

* chore: key ratchet export for web.

* bump version for xframeworks.

* update.

* chore: some changes for key safety ratcheting.

* update.

* fix typo.

* update.

* rename.

* magic bytes for web.

* bump version for flutter-webrtc.

* fix analyzer.

---------

Co-authored-by: Théo Monnom <[email protected]>

Author: cloudwebrtc

Makefile

@@ -13,4 +13,6 @@ proto:
 format:
 	flutter format --set-exit-if-changed -l 100 .
 
+e2ee: dart compile js .\web\e2ee.worker.dart -o .\example\web\e2ee.worker.dart.js
+
 .PHONY: proto format

README.md

@@ -20,13 +20,13 @@ More Docs and guides are available at [https://docs.livekit.io](https://docs.liv
 
 ## Current supported features
 
-| Feature | Subscribe/Publish | Simulcast | Background audio | Screen sharing |
-| :-----: | :---------------: | :-------: | :--------------: | :------------: |
-|   Web   |        🟢         |    🟢     |        🟢        |       🟢       |
-|   iOS   |        🟢         |    🟢     |        🟢        |       🟢       |
-| Android |        🟢         |    🟢     |        🟢        |       🟢       |
-|   Mac   |        🟢         |    🟢     |        🟢        |       🟢       |
-| Windows |        🟢         |    🟢     |        🟢        |       🟢       |
+| Feature | Subscribe/Publish | Simulcast | Background audio | Screen sharing | End to End Encryption |
+| :-----: | :---------------: | :-------: | :--------------: | :------------: | :------------: |
+|   Web   |        🟢         |    🟢     |        🟢        |       🟢       |       🟢       |
+|   iOS   |        🟢         |    🟢     |        🟢        |       🟢       |       🟢       |
+| Android |        🟢         |    🟢     |        🟢        |       🟢       |       🟢       |
+|   Mac   |        🟢         |    🟢     |        🟢        |       🟢       |       🟢       |
+| Windows |        🟢         |    🟢     |        🟢        |       🟢       |       🟢       |
 
 🟢 = Available
 
@@ -215,6 +215,21 @@ try {
 }
 ```
 
+### End to End Encryption
+
+LiveKit supports end-to-end encryption for audio/video data sent over the network.
+By default, the native platform can support E2EE without any settings, but for flutter web, you need to use the following steps to create `e2ee.worker.dart.js` file.
+
+```bash
+# for example app
+dart compile js .\web\e2ee.worker.dart -o .\example\web\e2ee.worker.dart.js
+# for your project 
+export YOU_PROJECT_DIR=your_project_dir
+git clone https://github.com/livekit/client-sdk-flutter.git
+cd client-sdk-flutter && flutter pub get
+dart compile js .\web\e2ee.worker.dart -o ${YOU_PROJECT_DIR}\web\e2ee.worker.dart.js
+```
+
 ### Advanced track manipulation
 
 The setCameraEnabled/setMicrophoneEnabled helpers are wrappers around the Track API.

analysis_options.yaml

@@ -30,6 +30,7 @@ analyzer:
     - '**/*.pbenum.dart'
     - '**/*.pbjson.dart'
     - '**/*.pbserver.dart'
+    - 'web/*.dart'
 
 linter:
   rules:
@@ -39,3 +40,4 @@ linter:
     prefer_single_quotes: true
     unnecessary_brace_in_string_interps: false
     unawaited_futures: true
+    depend_on_referenced_packages: false

example/lib/exts.dart

@@ -194,4 +194,5 @@ enum SimulateScenarioResult {
   serverLeave,
   switchCandidate,
   clear,
+  e2eeKeyRatchet,
 }

example/lib/pages/connect.dart

@@ -25,14 +25,18 @@ class _ConnectPageState extends State<ConnectPage> {
   static const _storeKeyAdaptiveStream = 'adaptive-stream';
   static const _storeKeyDynacast = 'dynacast';
   static const _storeKeyFastConnect = 'fast-connect';
+  static const _storeKeyE2EE = 'e2ee';
+  static const _storeKeySharedKey = 'shared-key';
 
   final _uriCtrl = TextEditingController();
   final _tokenCtrl = TextEditingController();
+  final _sharedKeyCtrl = TextEditingController();
   bool _simulcast = true;
   bool _adaptiveStream = true;
   bool _dynacast = true;
   bool _busy = false;
   bool _fastConnect = false;
+  bool _e2ee = false;
 
   @override
   void initState() {
@@ -56,11 +60,15 @@ class _ConnectPageState extends State<ConnectPage> {
     _tokenCtrl.text = const bool.hasEnvironment('TOKEN')
         ? const String.fromEnvironment('TOKEN')
         : prefs.getString(_storeKeyToken) ?? '';
+    _sharedKeyCtrl.text = const bool.hasEnvironment('E2EEKEY')
+        ? const String.fromEnvironment('E2EEKEY')
+        : prefs.getString(_storeKeySharedKey) ?? '';
     setState(() {
       _simulcast = prefs.getBool(_storeKeySimulcast) ?? true;
       _adaptiveStream = prefs.getBool(_storeKeyAdaptiveStream) ?? true;
       _dynacast = prefs.getBool(_storeKeyDynacast) ?? true;
       _fastConnect = prefs.getBool(_storeKeyFastConnect) ?? false;
+      _e2ee = prefs.getBool(_storeKeyE2EE) ?? false;
     });
   }
 
@@ -69,10 +77,12 @@ class _ConnectPageState extends State<ConnectPage> {
     final prefs = await SharedPreferences.getInstance();
     await prefs.setString(_storeKeyUri, _uriCtrl.text);
     await prefs.setString(_storeKeyToken, _tokenCtrl.text);
+    await prefs.setString(_storeKeySharedKey, _sharedKeyCtrl.text);
     await prefs.setBool(_storeKeySimulcast, _simulcast);
     await prefs.setBool(_storeKeyAdaptiveStream, _adaptiveStream);
     await prefs.setBool(_storeKeyDynacast, _dynacast);
     await prefs.setBool(_storeKeyFastConnect, _fastConnect);
+    await prefs.setBool(_storeKeyE2EE, _e2ee);
   }
 
   Future<void> _connect(BuildContext ctx) async {
@@ -93,6 +103,13 @@ class _ConnectPageState extends State<ConnectPage> {
 
       // Create a Listener before connecting
       final listener = room.createListener();
+      E2EEOptions? e2eeOptions;
+      if (_e2ee) {
+        final keyProvider = await BaseKeyProvider.create();
+        e2eeOptions = E2EEOptions(keyProvider: keyProvider);
+        var sharedKey = _sharedKeyCtrl.text;
+        await keyProvider.setKey(sharedKey);
+      }
 
       // Try to connect to the room
       // This will throw an Exception if it fails for any reason.
@@ -107,6 +124,7 @@ class _ConnectPageState extends State<ConnectPage> {
           ),
           defaultScreenShareCaptureOptions:
               const ScreenShareCaptureOptions(useiOSBroadcastExtension: true),
+          e2eeOptions: e2eeOptions,
         ),
         fastConnectOptions: _fastConnect
             ? FastConnectOptions(
@@ -115,6 +133,7 @@ class _ConnectPageState extends State<ConnectPage> {
               )
             : null,
       );
+
       await Navigator.push<void>(
         ctx,
         MaterialPageRoute(builder: (_) => RoomPage(room, listener)),
@@ -136,6 +155,13 @@ class _ConnectPageState extends State<ConnectPage> {
     });
   }
 
+  void _setE2EE(bool? value) async {
+    if (value == null || _e2ee == value) return;
+    setState(() {
+      _e2ee = value;
+    });
+  }
+
   void _setAdaptiveStream(bool? value) async {
     if (value == null || _adaptiveStream == value) return;
     setState(() {
@@ -192,6 +218,26 @@ class _ConnectPageState extends State<ConnectPage> {
                       ctrl: _tokenCtrl,
                     ),
                   ),
+                  Padding(
+                    padding: const EdgeInsets.only(bottom: 25),
+                    child: LKTextField(
+                      label: 'Shared Key',
+                      ctrl: _sharedKeyCtrl,
+                    ),
+                  ),
+                  Padding(
+                    padding: const EdgeInsets.only(bottom: 5),
+                    child: Row(
+                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
+                      children: [
+                        const Text('E2EE'),
+                        Switch(
+                          value: _e2ee,
+                          onChanged: (value) => _setE2EE(value),
+                        ),
+                      ],
+                    ),
+                  ),
                   Padding(
                     padding: const EdgeInsets.only(bottom: 5),
                     child: Row(

example/lib/pages/room.dart

@@ -66,6 +66,7 @@ class _RoomPageState extends State<RoomPage> {
     })
     ..on<LocalTrackPublishedEvent>((_) => _sortParticipants())
     ..on<LocalTrackUnpublishedEvent>((_) => _sortParticipants())
+    ..on<TrackE2EEStateEvent>(_onE2EEStateEvent)
     ..on<ParticipantNameUpdatedEvent>((event) {
       print(
           'Participant name updated: ${event.participant.identity}, name => ${event.name}');
@@ -102,6 +103,10 @@ class _RoomPageState extends State<RoomPage> {
     _sortParticipants();
   }
 
+  void _onE2EEStateEvent(TrackE2EEStateEvent e2eeState) {
+    print('e2ee state: $e2eeState');
+  }
+
   void _sortParticipants() {
     List<ParticipantTrack> userMediaTracks = [];
     List<ParticipantTrack> screenTracks = [];

example/lib/widgets/controls.dart

@@ -226,6 +226,11 @@ class _ControlsWidgetState extends State<ControlsWidget> {
     final result = await context.showSimulateScenarioDialog();
     if (result != null) {
       print('${result}');
+
+      if (SimulateScenarioResult.e2eeKeyRatchet == result) {
+        await widget.room.e2eeManager?.ratchetKey();
+      }
+
       await widget.room.sendSimulateScenario(
         signalReconnect:
             result == SimulateScenarioResult.signalReconnect ? true : null,

example/lib/widgets/participant.dart

@@ -153,6 +153,8 @@ abstract class _ParticipantWidgetState<T extends ParticipantWidget>
                         firstAudioPublication?.subscribed == true,
                     connectionQuality: widget.participant.connectionQuality,
                     isScreenShare: widget.isScreenShare,
+                    enabledE2EE: widget.participant.firstTrackEncryptionType !=
+                        EncryptionType.kNone,
                   ),
                 ],
               ),

example/lib/widgets/participant_info.dart

@@ -18,12 +18,14 @@ class ParticipantInfoWidget extends StatelessWidget {
   final bool audioAvailable;
   final ConnectionQuality connectionQuality;
   final bool isScreenShare;
+  final bool enabledE2EE;
 
   const ParticipantInfoWidget({
     this.title,
     this.audioAvailable = true,
     this.connectionQuality = ConnectionQuality.unknown,
     this.isScreenShare = false,
+    this.enabledE2EE = false,
     Key? key,
   }) : super(key: key);
 
@@ -77,6 +79,14 @@ class ParticipantInfoWidget extends StatelessWidget {
                   size: 16,
                 ),
               ),
+            Padding(
+              padding: const EdgeInsets.only(left: 5),
+              child: Icon(
+                enabledE2EE ? EvaIcons.lock : EvaIcons.unlock,
+                color: enabledE2EE ? Colors.green : Colors.red,
+                size: 16,
+              ),
+            ),
           ],
         ),
       );