Merge pull request #1231 from appwrite/handle-sessions-realtime-web

Author: ChiragAgg5k

templates/web/src/client.ts.twig

@@ -478,7 +478,7 @@ class Client {
                 this.realtime.lastMessage = message;
                 switch (message.type) {
                     case 'connected':
-                        let session = this.config.session;
+                        let session = this.config?.session;
                         if (!session) {
                             const cookie = JSON.parse(window.localStorage.getItem('cookieFallback') ?? '{}');
                             session = cookie?.[`a_session_${this.config.project}`];

templates/web/src/services/realtime.ts.twig

@@ -21,6 +21,18 @@ export type RealtimeResponseEvent<T = any> = {
     payload: T;
 }
 
+export type RealtimeResponseConnected = {
+    channels: string[];
+    user?: object;
+}
+
+export type RealtimeRequest = {
+    type: 'authentication';
+    data: {
+        session: string;
+    };
+}
+
 export enum RealtimeCode {
     NORMAL_CLOSURE = 1000,
     POLICY_VIOLATION = 1008,
@@ -31,6 +43,7 @@ export class Realtime {
     private readonly TYPE_ERROR = 'error';
     private readonly TYPE_EVENT = 'event';
     private readonly TYPE_PONG = 'pong';
+    private readonly TYPE_CONNECTED = 'connected';
     private readonly DEBOUNCE_MS = 1;
     private readonly HEARTBEAT_INTERVAL = 20000; // 20 seconds in milliseconds
 
@@ -332,6 +345,9 @@ export class Realtime {
         }
 
         switch (message.type) {
+            case this.TYPE_CONNECTED:
+                this.handleResponseConnected(message);
+                break;
             case this.TYPE_ERROR:
                 this.handleResponseError(message);
                 break;
@@ -344,6 +360,33 @@ export class Realtime {
         }
     }
 
+    private handleResponseConnected(message: RealtimeResponse): void {
+        if (!message.data) {
+            return;
+        }
+
+        const messageData = message.data as RealtimeResponseConnected;
+
+        let session = this.client.config?.session;
+        if (!session) {
+            try {
+                const cookie = JSON.parse(window.localStorage.getItem('cookieFallback') ?? '{}');
+                session = cookie?.[`a_session_${this.client.config.project}`];
+            } catch (error) {
+                console.error('Failed to parse cookie fallback:', error);
+            }
+        }
+
+        if (session && !messageData.user) {
+            this.socket?.send(JSON.stringify(<RealtimeRequest>{
+                type: 'authentication',
+                data: {
+                    session
+                }
+            }));
+        }
+    }
+
     private handleResponseError(message: RealtimeResponse): void {
         const error = new {{spec.title | caseUcfirst}}Exception(
             message.data?.message || 'Unknown error'