From 0e7f02680aa677b54051e93fb951df3772737028 Mon Sep 17 00:00:00 2001 From: Bit-Barron Date: Sat, 2 Nov 2024 19:41:25 +0100 Subject: [PATCH] asd --- docker-compose.yml | 24 +++++++------ src/lib/server/socket.ts | 74 ++++++++++++++++++++++++++++------------ src/lib/socket.ts | 38 ++++++++++++++++----- 3 files changed, 96 insertions(+), 40 deletions(-) diff --git a/docker-compose.yml b/docker-compose.yml index 9b5eaa1..6e2c132 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -21,21 +21,25 @@ services: - proxy labels: - 'traefik.enable=true' - # HTTP Router + + # Main application - 'traefik.http.routers.youtubepedia.rule=Host(`youtubepedia.barron.agency`)' - 'traefik.http.routers.youtubepedia.entrypoints=websecure' - 'traefik.http.routers.youtubepedia.tls=true' - 'traefik.http.routers.youtubepedia.tls.certresolver=letsencrypt' - # Middleware for websocket - - 'traefik.http.middlewares.sio.headers.customrequestheaders.X-Forwarded-Host=youtubepedia.barron.agency' - - 'traefik.http.middlewares.sio.headers.customrequestheaders.X-Forwarded-Proto=https' - - 'traefik.http.middlewares.sio.headers.customrequestheaders.X-Forwarded-Port=443' - # Service configuration - 'traefik.http.services.youtubepedia.loadbalancer.server.port=3000' - # WebSocket specific configuration - - 'traefik.http.routers.youtubepedia.middlewares=sio' - - 'traefik.http.middlewares.youtubepredia-compress.compress=true' - - 'traefik.http.routers.youtubepedia.middlewares=youtubepredia-compress' + + # Socket.IO specific route + - 'traefik.http.routers.youtubepedia-socket.rule=Host(`youtubepedia.barron.agency`) && PathPrefix(`/socket.io`)' + - 'traefik.http.routers.youtubepedia-socket.entrypoints=websecure' + - 'traefik.http.routers.youtubepedia-socket.tls=true' + - 'traefik.http.routers.youtubepedia-socket.tls.certresolver=letsencrypt' + - 'traefik.http.routers.youtubepedia-socket.service=youtubepedia' + + # Middleware for websocket and long polling + - 'traefik.http.middlewares.sio.headers.customrequestheaders.Connection=upgrade' + - 'traefik.http.middlewares.sio.headers.customrequestheaders.Upgrade=websocket' + - 'traefik.http.routers.youtubepedia-socket.middlewares=sio' networks: proxy: diff --git a/src/lib/server/socket.ts b/src/lib/server/socket.ts index 0a89914..7095d4c 100644 --- a/src/lib/server/socket.ts +++ b/src/lib/server/socket.ts @@ -8,37 +8,63 @@ declare global { var __socketio: Server | null; } +const SOCKET_CONFIG: Partial = { + path: '/socket.io', + cors: { + origin: dev ? ['http://localhost:3000'] : ['https://youtubepedia.barron.agency'], + methods: ['GET', 'POST'], + credentials: true, + allowedHeaders: ['Content-Type', 'Authorization', 'X-Requested-With'] + }, + transports: ['polling', 'websocket'], + allowUpgrades: true, + upgradeTimeout: 10000, + pingInterval: 25000, + pingTimeout: 20000, + connectTimeout: 45000, + allowEIO3: true, + maxHttpBufferSize: 1e8, + perMessageDeflate: { + threshold: 1024 + }, + httpCompression: { + threshold: 1024 + }, + cookie: { + name: 'io', + path: '/', + httpOnly: true, + sameSite: 'lax' + } +}; + export const initSocketIO = (httpServer: HTTPServer): void => { if (!global.__socketio) { console.log('Initializing Socket.IO server...'); - const io = new Server(httpServer, { - path: '/socket.io', - cors: { - origin: dev ? ['http://localhost:3000'] : ['https://youtubepedia.barron.agency'], - methods: ['GET', 'POST'], - credentials: true - }, - transports: ['polling', 'websocket'], - allowUpgrades: true, - upgradeTimeout: 10000, - pingInterval: 10000, - pingTimeout: 5000, - cookie: { - name: 'io', - path: '/', - httpOnly: true, - sameSite: 'strict' - }, - allowEIO3: true, - connectTimeout: 45000 - } as Partial); + const io = new Server(httpServer, SOCKET_CONFIG); io.engine.on('connection_error', (err) => { console.log('Connection error:', err); }); + io.engine.on('initial_headers', (headers: Record) => { + headers['Access-Control-Allow-Credentials'] = 'true'; + if (dev) { + headers['Access-Control-Allow-Origin'] = 'http://localhost:3000'; + } else { + headers['Access-Control-Allow-Origin'] = 'https://youtubepedia.barron.agency'; + } + }); + io.on('connection', (socket) => { - console.log('Client connected', socket.id, 'transport:', socket.conn.transport.name); + console.log( + 'Client connected', + socket.id, + 'transport:', + socket.conn.transport.name, + 'headers:', + socket.handshake.headers + ); const userId = socket.handshake.auth.userId; if (userId) { @@ -49,6 +75,10 @@ export const initSocketIO = (httpServer: HTTPServer): void => { socket.on('disconnect', (reason) => { console.log('Client disconnected', socket.id, 'reason:', reason); }); + + socket.on('error', (error) => { + console.error('Socket error:', error); + }); }); global.__socketio = io; diff --git a/src/lib/socket.ts b/src/lib/socket.ts index 3811d38..24f1d67 100644 --- a/src/lib/socket.ts +++ b/src/lib/socket.ts @@ -3,34 +3,56 @@ import { io, type Socket } from 'socket.io-client'; export const initSocket = (userId: string): Socket | null => { if (browser) { - const socket = io(window.location.origin, { + const socketUrl = window.location.origin; + console.log('Initializing socket connection to:', socketUrl); + + const socket = io(socketUrl, { path: '/socket.io', auth: { userId }, + transports: ['polling', 'websocket'], reconnection: true, - reconnectionDelay: 1000, reconnectionAttempts: 5, - transports: ['polling', 'websocket'], // Start with polling first - upgrade: true, - rememberUpgrade: true, - timeout: 10000, - forceNew: true + reconnectionDelay: 1000, + reconnectionDelayMax: 5000, + timeout: 20000, + autoConnect: true, + withCredentials: true }); socket.on('connect', () => { - console.log('Connected to socket server with transport:', socket.io.engine.transport.name); + console.log( + 'Connected to socket server', + 'ID:', + socket.id, + 'Transport:', + socket.io.engine.transport.name + ); }); socket.on('connect_error', (error) => { console.error('Socket connection error:', error); + // Log additional debugging information + console.log('Current transport:', socket.io.engine.transport.name); + // console.log('Available transports:', socket.io.engine.transports); }); socket.on('disconnect', (reason) => { console.log('Disconnected:', reason); if (reason === 'io server disconnect') { + // the disconnection was initiated by the server, reconnect automatically socket.connect(); } }); + socket.on('error', (error) => { + console.error('Socket error:', error); + }); + + // Monitor transport changes + socket.io.engine.on('upgrade', (transport) => { + console.log('Transport upgraded to:', transport.name); + }); + return socket; } return null;