fix(site): race condition on connect when sending ice candidates

Author: coadler

overlay/receive.go

@@ -117,9 +117,10 @@ func getWebRTCConfig() webrtc.Configuration {
 	}
 	for i, server := range iceConfig.IceServers {
 		config.ICEServers[i] = webrtc.ICEServer{
-			URLs:       server.URLs,
-			Username:   server.Username,
-			Credential: server.Credential,
+			URLs:           server.URLs,
+			Username:       server.Username,
+			Credential:     server.Credential,
+			CredentialType: webrtc.ICECredentialTypePassword,
 		}
 	}
 

overlay/wasm_js.go

@@ -72,7 +72,6 @@ type Wasm struct {
 	DerpRegionID uint16
 	DerpLatency  time.Duration
 
-	// peers is a map of channels that notify peers of node updates.
 	activePeer atomic.Pointer[chan *overlayMessage]
 	onNewPeer  js.Value
 
@@ -138,7 +137,6 @@ func (r *Wasm) SendTailscaleNodeUpdate(node *tailcfg.Node) {
 }
 
 func (r *Wasm) SendWebrtcCandidate(peer string, cand webrtc.ICECandidateInit) {
-
 	fmt.Println("go: sending webrtc candidate")
 	r.out <- &overlayMessage{
 		Typ:             messageTypeWebRTCCandidate,
@@ -180,14 +178,14 @@ func (r *Wasm) Connect(ctx context.Context, ca ClientAuth, offer webrtc.SessionD
 	go func() {
 		defer r.activePeer.CompareAndSwap(&updates, nil)
 		defer c.Close()
+		defer fmt.Println("closing send goroutine")
 
 		for {
 			select {
 			case <-ctx.Done():
 				return
 			case msg, ok := <-updates:
 				if !ok {
-					c.Close()
 					return
 				}
 
@@ -199,9 +197,10 @@ func (r *Wasm) Connect(ctx context.Context, ca ClientAuth, offer webrtc.SessionD
 				sealed := ca.OverlayPrivateKey.SealTo(ca.ReceiverPublicKey, raw)
 				err = c.Send(ca.ReceiverPublicKey, sealed)
 				if err != nil {
-					fmt.Printf("send response over derp: %s\n", err)
+					fmt.Println("send response over derp:", err)
 					return
 				}
+				fmt.Println("sent message to connected peer")
 			}
 		}
 	}()
@@ -318,10 +317,6 @@ func (r *Wasm) ListenOverlayDERP(ctx context.Context) error {
 					return true
 				})
 				if selectedPeer := r.activePeer.Load(); selectedPeer != nil {
-					// *selectedPeer <- &overlayMessage{
-					// 	Typ:  messageTypeNodeUpdate,
-					// 	Node: *msg.Node.Clone(),
-					// }
 					*selectedPeer <- msg
 					fmt.Println("sending message")
 				}
@@ -332,6 +327,7 @@ func (r *Wasm) ListenOverlayDERP(ctx context.Context) error {
 	for {
 		msg, err := c.Recv()
 		if err != nil {
+			fmt.Println("Recv derp:", err)
 			return err
 		}
 

site/context/wush.tsx

@@ -9,12 +9,13 @@ const iceServers = [
   {
     urls: "stun:stun.l.google.com:19302",
   },
-  ...(process.env.PUBLIC_TURN_SERVER_URL
+  ...(process.env.NEXT_PUBLIC_TURN_SERVER_URL
     ? [
         {
-          urls: process.env.PUBLIC_TURN_SERVER_URL,
-          username: process.env.PUBLIC_TURN_USERNAME ?? "",
-          credential: process.env.PUBLIC_TURN_CREDENTIAL ?? "",
+          urls: process.env.NEXT_PUBLIC_TURN_SERVER_URL,
+          username: process.env.NEXT_PUBLIC_TURN_USERNAME ?? "",
+          credential: process.env.NEXT_PUBLIC_TURN_CREDENTIAL ?? "",
+          credentialType: "password",
         },
       ]
     : []),
@@ -149,8 +150,6 @@ export const WasmProvider: React.FC<WasmProviderProps> = ({ children }) => {
       id: string,
       offer: RTCSessionDescriptionInit
     ): Promise<RTCSessionDescription | null> => {
-      console.log("got webrtc offer", id, JSON.stringify(offer));
-
       const rtc = wasm.rtc.current.get(id);
       if (!rtc) {
         console.log(
@@ -168,7 +167,6 @@ export const WasmProvider: React.FC<WasmProviderProps> = ({ children }) => {
         console.error(`failed to create answer: ${ex}`);
       }
 
-      console.log("desc", JSON.stringify(rtc.localDescription));
       return rtc.localDescription;
     },
     onWebrtcAnswer: async (
@@ -305,16 +303,16 @@ export const WasmProvider: React.FC<WasmProviderProps> = ({ children }) => {
           throw new Error("failed to parse peer id");
         }
 
+        // Initialize an array to buffer candidates
+        const bufferedCandidates: RTCIceCandidate[] = [];
+
         // Set up 'onicecandidate' handler before starting ICE gathering
         newPeerConnection.onicecandidate = (
           event: RTCPeerConnectionIceEvent
         ) => {
           if (event.candidate) {
-            console.log("onicecandidate", event.candidate);
-            wasm.wush.current?.sendWebrtcCandidate(
-              peerInfo.id,
-              event.candidate
-            );
+            console.log("Buffering ICE candidate", event.candidate);
+            bufferedCandidates.push(event.candidate);
           }
         };
 
@@ -340,6 +338,25 @@ export const WasmProvider: React.FC<WasmProviderProps> = ({ children }) => {
           throw new Error("Failed to connect to peer: peer is null");
         }
 
+        newPeerConnection.onicecandidate = (
+          event: RTCPeerConnectionIceEvent
+        ) => {
+          if (event.candidate) {
+            console.log("onicecandidate", event.candidate);
+            wasm.wush.current?.sendWebrtcCandidate(
+              peerInfo.id,
+              event.candidate
+            );
+          }
+        };
+
+        // Add a method to send buffered candidates
+        for (const candidate of bufferedCandidates) {
+          wasm.wush.current?.sendWebrtcCandidate(peerInfo.id, candidate);
+        }
+        // Clear the buffer after sending
+        bufferedCandidates.length = 0;
+
         setWasm((prevState) => {
           return {
             ...prevState,

site/pages/api/iceConfig.ts

@@ -26,14 +26,14 @@ export default function handler(
 
 	// Add TURN server if credentials are configured
 	if (
-		process.env.PUBLIC_TURN_SERVER_URL &&
-		process.env.PUBLIC_TURN_USERNAME &&
-		process.env.PUBLIC_TURN_CREDENTIAL
+		process.env.NEXT_PUBLIC_TURN_SERVER_URL &&
+		process.env.NEXT_PUBLIC_TURN_USERNAME &&
+		process.env.NEXT_PUBLIC_TURN_CREDENTIAL
 	) {
 		iceServers.push({
-			urls: [process.env.PUBLIC_TURN_SERVER_URL],
-			username: process.env.PUBLIC_TURN_USERNAME,
-			credential: process.env.PUBLIC_TURN_CREDENTIAL,
+			urls: [process.env.NEXT_PUBLIC_TURN_SERVER_URL],
+			username: process.env.NEXT_PUBLIC_TURN_USERNAME,
+			credential: process.env.NEXT_PUBLIC_TURN_CREDENTIAL,
 		});
 	}