diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index 04debfac5..31bb6e884 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -48,7 +48,6 @@ import NotificationToast from '$lib/components/NotificationToast.svelte'; import AppSidebar from '$lib/components/app/AppSidebar.svelte'; import { chatCompletion } from '$lib/apis/openai'; - import { setupSocket } from '$lib/utils/websocket'; setContext('i18n', i18n); @@ -59,6 +58,53 @@ const BREAKPOINT = 768; + const setupSocket = async (enableWebsocket) => { + const _socket = io(`${WEBUI_BASE_URL}` || undefined, { + reconnection: true, + reconnectionDelay: 1000, + reconnectionDelayMax: 5000, + randomizationFactor: 0.5, + path: '/ws/socket.io', + transports: enableWebsocket ? ['websocket'] : ['polling', 'websocket'], + auth: { token: localStorage.token } + }); + + await socket.set(_socket); + + _socket.on('connect_error', (err) => { + console.log('connect_error', err); + }); + + _socket.on('connect', () => { + console.log('connected', _socket.id); + }); + + _socket.on('reconnect_attempt', (attempt) => { + console.log('reconnect_attempt', attempt); + }); + + _socket.on('reconnect_failed', () => { + console.log('reconnect_failed'); + }); + + _socket.on('disconnect', (reason, details) => { + console.log(`Socket ${_socket.id} disconnected due to ${reason}`); + if (details) { + console.log('Additional details:', details); + } + }); + + _socket.on('user-list', (data) => { + console.log('user-list', data); + activeUserIds.set(data.user_ids); + }); + + _socket.on('usage', (data) => { + console.log('usage', data); + USAGE_POOL.set(data['models']); + }); + }; + const executePythonAsWorker = async (id, code, cb) => { let result = null; let stdout = null; @@ -515,6 +561,8 @@ await WEBUI_NAME.set(backendConfig.name); if ($config) { + await setupSocket($config.features?.enable_websocket ?? true); + const currentUrl = `${window.location.pathname}${window.location.search}`; const encodedUrl = encodeURIComponent(currentUrl); @@ -526,7 +574,6 @@ }); if (sessionUser) { - await setupSocket($config.features?.enable_websocket ?? true); // Save Session User to Store $socket.emit('user-join', { auth: { token: sessionUser.token } }); diff --git a/src/routes/auth/+page.svelte b/src/routes/auth/+page.svelte index 81b9fbd30..019b713b1 100644 --- a/src/routes/auth/+page.svelte +++ b/src/routes/auth/+page.svelte @@ -12,7 +12,6 @@ import { WEBUI_NAME, config, user, socket } from '$lib/stores'; import { generateInitialsImage, canvasPixelTest } from '$lib/utils'; - import { setupSocket } from '$lib/utils/websocket'; import Spinner from '$lib/components/common/Spinner.svelte'; import OnBoarding from '$lib/components/OnBoarding.svelte'; @@ -42,10 +41,6 @@ if (sessionUser.token) { localStorage.token = sessionUser.token; } - if (!$socket) { - await setupSocket($config.features?.enable_websocket ?? true); - } - $socket.emit('user-join', { auth: { token: sessionUser.token } }); await user.set(sessionUser); await config.set(await getBackendConfig());