From c74b060a67a9c8f1f2d4f83d4e9905b1ca945076 Mon Sep 17 00:00:00 2001
From: Ben Willenbring <ben.willenbring@maibornwolff.de>
Date: Fri, 15 Dec 2023 16:36:25 +0100
Subject: [PATCH] feat: add configurable ice server urls

---
 README.md                                          | 7 +++++++
 packages/frontend/src/common/hooks/usePeer.ts      | 8 +++++++-
 packages/shared/configuration/src/configuration.ts | 5 +++++
 packages/shared/configuration/src/types.ts         | 1 +
 4 files changed, 20 insertions(+), 1 deletion(-)

diff --git a/README.md b/README.md
index a5173362..c841dc54 100644
--- a/README.md
+++ b/README.md
@@ -34,6 +34,12 @@ This application requires three services to be running and configured correctly.
 | [Retro Backend](https://hub.docker.com/r/retroapp/retro-backend)   | 3001         |
 | [Signaling Server](https://hub.docker.com/r/peerjs/peerjs-server)  | 9000         |
 
+### WebRTC
+
+By default, the clients identify the IP address of the other peers by using a public STUN server by Google. A TURN
+server is not provided by default and must be hosted additionally. The frontend can be configured to overwrite the ice
+server urls.
+
 ### Environment variables example
 
 #### Frontend
@@ -45,6 +51,7 @@ This application requires three services to be running and configured correctly.
 - SIGNALING_SERVER_PROTOCOL = "https"
 - SIGNALING_SERVER_HOST = "my-signaling-domain.com"
 - SIGNALING_SERVER_PORT = 443
+- ICE_SERVER_URLS = "stun:stun.l.google.com:19302"
 
 #### Backend
 
diff --git a/packages/frontend/src/common/hooks/usePeer.ts b/packages/frontend/src/common/hooks/usePeer.ts
index ed0016c5..59fedd2c 100644
--- a/packages/frontend/src/common/hooks/usePeer.ts
+++ b/packages/frontend/src/common/hooks/usePeer.ts
@@ -6,13 +6,19 @@ import { isClientSide } from "../utils/isClientSide";
 import { useConfigurationContext } from "../context/ConfigurationContext";
 
 export function usePeer() {
-  const { signalingServerUrl } = useConfigurationContext();
+  const { signalingServerUrl, iceServerUrls } = useConfigurationContext();
   const [peer, setPeer] = useState<Peer | undefined>(undefined);
   const { user } = useUserContext();
 
+  const iceServers = iceServerUrls.map((url) => {
+    return { urls: url };
+  });
   const peerOptions = {
     host: signalingServerUrl.host,
     port: signalingServerUrl.port,
+    config: {
+      iceServers,
+    },
   };
 
   useEffect(() => {
diff --git a/packages/shared/configuration/src/configuration.ts b/packages/shared/configuration/src/configuration.ts
index 43c4ac64..9725b0b9 100644
--- a/packages/shared/configuration/src/configuration.ts
+++ b/packages/shared/configuration/src/configuration.ts
@@ -24,9 +24,14 @@ function getConfiguration(): ApplicationConfiguration {
       maxVoteCount: Number(process.env.RETRO_MAX_VOTE_COUNT) ?? 3,
     },
     corsOrigins: parseCorsOrigins(process.env.CORS_ORIGIN) ?? "*",
+    iceServerUrls: parseStringList(process.env.ICE_SERVER_URLS) ?? ["stun:stun.l.google.com:19302"],
   };
 }
 
+function parseStringList(urls?: string) {
+  return urls?.split(",").map((origin) => origin.trim());
+}
+
 function parseCorsOrigins(list?: string): CorsOrigins | undefined {
   if (!list) return undefined;
 
diff --git a/packages/shared/configuration/src/types.ts b/packages/shared/configuration/src/types.ts
index d216495a..56d25cc0 100644
--- a/packages/shared/configuration/src/types.ts
+++ b/packages/shared/configuration/src/types.ts
@@ -10,6 +10,7 @@ export interface ApplicationConfiguration {
   retro: RetroConfiguration;
   signalingServerUrl: RetroAppUrl;
   corsOrigins: CorsOrigins;
+  iceServerUrls: string[];
 }
 
 export interface RetroConfiguration {