Merge pull request #83 from lgrahl/ice-connectivity

ICE Connectivity

README.md

@@ -80,8 +80,7 @@ The configuration of Threema Web can be tweaked in `src/config.ts`:
 
 **ICE**
 
-- `SALTYRTC_STUN`: Configuration object for the WebRTC STUN server.
-- `SALTYRTC_TURN`: Configuration object for the WebRTC TURN server.
+- `ICE_SERVERS`: Configuration object for the WebRTC STUN and ICE servers.
 
 **Push**
 

docs/self_hosting.md

@@ -30,8 +30,7 @@ First, adjust the configuration in `src/config.ts`:
 
 - Set `SELF_HOSTED` to `true`
 - If you host your own SaltyRTC server, adjust the `SALTYRTC_*` variables
-- If you host your own STUN / TURN server, adjust the `SALTYRTC_STUN` and
-  `SALTYRTC_TURN` variables
+- If you host your own STUN / TURN server, adjust the `ICE_SERVERS` variable
 
 Then, build the release version of Threema Web:
 

npm-shrinkwrap.json

@@ -3364,9 +3364,9 @@
       }
     },
     "sdp": {
-      "version": "1.0.2",
-      "from": "sdp@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/sdp/-/sdp-1.0.2.tgz"
+      "version": "1.3.0",
+      "from": "sdp@>=1.3.0 <1.4.0",
+      "resolved": "https://registry.npmjs.org/sdp/-/sdp-1.3.0.tgz"
     },
     "semver": {
       "version": "5.3.0",

package.json

@@ -59,6 +59,7 @@
     "node-sass": "~3.10.0",
     "saltyrtc-client": "~0.9.1",
     "saltyrtc-task-webrtc": "~0.9.1",
+    "sdp": "~1.3.0",
     "tsify": "~2.0.1",
     "tweetnacl": "~0.14.4",
     "typescript": "~2.1.0",

src/config.ts

@@ -16,14 +16,14 @@ export default {
     SALTYRTC_SERVER_KEY: 'b1337fc8402f7db8ea639e05ed05d65463e24809792f91eca29e88101b4a2171',
 
     // ICE
-    SALTYRTC_STUN: {
-        urls: 'stun:stun.threema.ch:443',
-    },
-    SALTYRTC_TURN: {
-        urls: 'turn:turn.threema.ch:443',
+    ICE_SERVERS: [{
+        urls: [
+            'turn:turn.threema.ch:443?transport=udp',
+            'turn:turn.threema.ch:443?transport=tcp'
+        ],
         username: 'threema-angular',
         credential: 'Uv0LcCq3kyx6EiRwQW5jVigkhzbp70CjN2CJqzmRxG3UGIdJHSJV6tpo7Gj7YnGB',
-    },
+    }],
 
     // Push
     PUSH_URL: 'https://push-web.threema.ch/push',

src/services/peerconnection.ts

@@ -16,6 +16,7 @@
  */
 
 /// <reference types="saltyrtc-task-webrtc" />
+import * as SDPUtils from 'sdp';
 
 /**
  * Wrapper around the WebRTC PeerConnection.
@@ -46,7 +47,7 @@ export class PeerConnectionHelper {
     constructor($log: ng.ILogService, $q: ng.IQService,
                 $timeout: ng.ITimeoutService, $rootScope: ng.IRootScopeService,
                 webrtcTask: saltyrtc.tasks.webrtc.WebRTCTask,
-                stunServer: RTCIceServer, turnServer: RTCIceServer) {
+                iceServers: RTCIceServer[]) {
         this.$log = $log;
         this.$log.info('Initialize WebRTC PeerConnection');
         this.$q = $q;
@@ -56,7 +57,7 @@ export class PeerConnectionHelper {
         this.webrtcTask = webrtcTask;
 
         // Set up peer connection
-        this.pc = new RTCPeerConnection({iceServers: [stunServer, turnServer]});
+        this.pc = new RTCPeerConnection({iceServers: iceServers});
         this.pc.onnegotiationneeded = (e: Event) => {
             this.$log.debug(this.logTag, 'RTCPeerConnection: negotiation needed');
             this.initiatorFlow().then(
@@ -95,6 +96,8 @@ export class PeerConnectionHelper {
         this.$log.debug(this.logTag, 'Setting up ICE candidate handling');
         this.pc.onicecandidate = (e: RTCPeerConnectionIceEvent) => {
             if (e.candidate) {
+                this.$log.debug(this.logTag, 'Gathered local ICE candidate:',
+                    PeerConnectionHelper.censorCandidate(e.candidate.candidate));
                 this.webrtcTask.sendCandidate({
                     candidate: e.candidate.candidate,
                     sdpMid: e.candidate.sdpMid,
@@ -135,6 +138,12 @@ export class PeerConnectionHelper {
         };
         this.webrtcTask.on('candidates', (e: saltyrtc.tasks.webrtc.CandidatesEvent) => {
             for (let candidateInit of e.data) {
+                if (candidateInit) {
+                    this.$log.debug(this.logTag, 'Adding remote ICE candidate:',
+                        PeerConnectionHelper.censorCandidate(candidateInit.candidate));
+                } else {
+                    this.$log.debug(this.logTag, 'No more remote ICE candidates');
+                }
                 this.pc.addIceCandidate(candidateInit);
             }
         });
@@ -233,4 +242,20 @@ export class PeerConnectionHelper {
             }
         });
     }
+
+    /**
+     * Censor an ICE candidate's address and port.
+     *
+     * Return the censored ICE candidate.
+     */
+    private static censorCandidate(candidateInit: string): string {
+        let candidate = SDPUtils.parseCandidate(candidateInit);
+        if (candidate.type !== 'relay') {
+            candidate.ip = '***';
+            candidate.port = 1;
+        }
+        candidate.relatedAddress = '***';
+        candidate.relatedPort = 2;
+        return SDPUtils.writeCandidate(candidate);
+    }
 }

src/services/webclient.ts

@@ -368,7 +368,7 @@ export class WebClientService implements threema.WebClientService {
         this.salty.once('state-change:task', () => {
             this.pcHelper = new PeerConnectionHelper(this.$log, this.$q, this.$timeout,
                                                      this.$rootScope, this.webrtcTask,
-                                                     this.config.SALTYRTC_STUN, this.config.SALTYRTC_TURN);
+                                                     this.config.ICE_SERVERS);
 
             // On state changes in the PeerConnectionHelper class, let state service know about it
             this.pcHelper.onConnectionStateChange = (state: threema.RTCConnectionState) => {

src/threema.d.ts

@@ -469,8 +469,7 @@ declare namespace threema {
         SALTYRTC_HOST: string | null;
         SALTYRTC_HOST_PREFIX: string | null;
         SALTYRTC_HOST_SUFFIX: string | null;
-        SALTYRTC_STUN: RTCIceServer;
-        SALTYRTC_TURN: RTCIceServer;
+        ICE_SERVERS: RTCIceServer[];
         PUSH_URL: string;
     }