Switch websocket address proactively to avoid unnecessary redirects t…

…o the correct address
raimohanska · Mar 11, 2024 · a07e1b5 · a07e1b5
1 parent f37316a
commit a07e1b5
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 8 deletions.
diff --git a/frontend/src/index.tsx b/frontend/src/index.tsx
@@ -18,7 +18,7 @@ import { UserSessionStore } from "./store/user-session-store"
 
 const App = () => {
     const { boardId, page } = BoardNavigation()
-    const connection = BrowserSideServerConnection()
+    const connection = BrowserSideServerConnection(boardId)
     const sessionStore = UserSessionStore(connection, localStorage)
     const boardStore = BoardStore(boardId, connection, sessionStore.sessionState, boardLocalStore)
     const cursorsStore = CursorsStore(connection, sessionStore)

diff --git a/frontend/src/store/server-connection.ts b/frontend/src/store/server-connection.ts
@@ -17,18 +17,22 @@ export function getWebSocketRootUrl() {
     return `${WS_PROTOCOL}//${location.host}`
 }
 
-export function BrowserSideServerConnection() {
+export function BrowserSideServerConnection(boardId: L.Property<string | undefined>) {
     const documentHidden = L.fromEvent(document, "visibilitychange").pipe(
         L.toStatelessProperty(() => document.hidden || false),
     )
 
+    const socketAddress = L.view(boardId, (id) =>
+        id ? `${getWebSocketRootUrl()}/socket/board/${id}` : `${getWebSocketRootUrl()}/socket/lobby`,
+    )
+
     //const root = "wss://www.ourboard.io"
     //const root = "ws://localhost:1339"
-    return GenericServerConnection(`${getWebSocketRootUrl()}/socket/lobby`, documentHidden, (s) => new WebSocket(s))
+    return GenericServerConnection(socketAddress, documentHidden, (s) => new WebSocket(s))
 }
 
 export function GenericServerConnection(
-    initialSocketAddress: string,
+    initialSocketAddress: L.Property<string>,
     documentHidden: L.Property<boolean>,
     createSocket: (address: string) => WebSocket,
 ) {
@@ -44,8 +48,12 @@ export function GenericServerConnection(
 
     const connectionStatus = L.atom<ConnectionStatus>("connecting")
     const forceOffline = L.atom<boolean>(false)
-    let currentSocketAddress = initialSocketAddress
-    let socket = initSocket()
+    let currentSocketAddress: string | undefined = undefined
+    let socket: WebSocket | null = null
+    initialSocketAddress.forEach((newAddress) => {
+        currentSocketAddress = newAddress
+        newSocket()
+    })
 
     setInterval(() => {
         if (documentHidden.get() && connectionStatus.get() === "connected" && socket) {
@@ -65,7 +73,7 @@ export function GenericServerConnection(
     })
 
     function initSocket() {
-        if (forceOffline.get()) {
+        if (forceOffline.get() || currentSocketAddress === undefined) {
             return null
         }
         connectionStatus.set("connecting")

diff --git a/perf-tester/src/index.ts b/perf-tester/src/index.ts
@@ -36,7 +36,7 @@ function createTester(nickname: string, boardId: string) {
     const WS_ROOT = `${DOMAIN ? "wss" : "ws"}://${DOMAIN ?? "localhost:1337"}`
     const WS_ADDRESS = `${WS_ROOT}/socket/board/${boardId}`
 
-    let connection = GenericServerConnection(WS_ADDRESS, L.constant(false), (s) => new WebSocket(s) as any)
+    let connection = GenericServerConnection(L.constant(WS_ADDRESS), L.constant(false), (s) => new WebSocket(s) as any)
     let sessionId = ""
     connection.bufferedServerEvents.forEach((event) => {
         if (event.action === "board.join.ack") {