Update WebSocket configuration and enhance connection handling in WalletWebSocketService

- Increased reconnect delay from 1 second to 2 seconds and reduced max reconnect attempts from 5 to 3 to minimize server load.
- Improved logging messages for connection status and abnormal closures, providing clearer insights during reconnection attempts.
- Added a ping mechanism to test connection stability and handle network connectivity issues more effectively.

These changes enhance the reliability and performance of the WebSocket service, contributing to a better user experience.
This commit is contained in:
padreug 2025-09-18 10:30:33 +02:00
parent 6a1e70303d
commit 15a7540515
2 changed files with 53 additions and 10 deletions

View file

@ -77,8 +77,8 @@ export const appConfig: AppConfig = {
}, },
websocket: { websocket: {
enabled: import.meta.env.VITE_WEBSOCKET_ENABLED !== 'false', // Can be disabled via env var enabled: import.meta.env.VITE_WEBSOCKET_ENABLED !== 'false', // Can be disabled via env var
reconnectDelay: 1000, // 1 second reconnectDelay: 2000, // 2 seconds (increased from 1s to reduce server load)
maxReconnectAttempts: 5 maxReconnectAttempts: 3 // Reduced from 5 to avoid overwhelming server
} }
} }
} }

View file

@ -165,7 +165,7 @@ export class WalletWebSocketService extends BaseService {
* Handle WebSocket connection opened * Handle WebSocket connection opened
*/ */
private handleOpen(_event: Event): void { private handleOpen(_event: Event): void {
console.log('WalletWebSocketService: Connected') console.log('WalletWebSocketService: Connected successfully')
this.isConnected.value = true this.isConnected.value = true
this.connectionStatus.value = 'connected' this.connectionStatus.value = 'connected'
this.reconnectAttempts = 0 this.reconnectAttempts = 0
@ -175,6 +175,9 @@ export class WalletWebSocketService extends BaseService {
clearTimeout(this.reconnectTimer) clearTimeout(this.reconnectTimer)
this.reconnectTimer = null this.reconnectTimer = null
} }
// Send a ping to test connection stability
this.sendPing()
} }
/** /**
@ -282,10 +285,16 @@ export class WalletWebSocketService extends BaseService {
this.connectionStatus.value = 'disconnected' this.connectionStatus.value = 'disconnected'
this.ws = null this.ws = null
// Schedule reconnection if not a normal closure // Handle specific close codes
if (event.code !== 1000) { if (event.code === 1006) {
this.scheduleReconnect() console.warn('WalletWebSocketService: Abnormal closure detected - possible server issue')
// For code 1006, increase delay to avoid overwhelming server
this.scheduleReconnect(true)
} else if (event.code !== 1000) {
// Normal reconnection for other non-normal closures
this.scheduleReconnect(false)
} }
// Code 1000 = normal closure, don't reconnect
} }
/** /**
@ -300,12 +309,18 @@ export class WalletWebSocketService extends BaseService {
console.error('WalletWebSocketService: WebSocket state:', this.ws.readyState) console.error('WalletWebSocketService: WebSocket state:', this.ws.readyState)
console.error('WalletWebSocketService: WebSocket URL:', this.ws.url) console.error('WalletWebSocketService: WebSocket URL:', this.ws.url)
} }
// Check if this is a network connectivity issue
if (!navigator.onLine) {
console.log('WalletWebSocketService: Network appears to be offline')
this.connectionStatus.value = 'offline'
}
} }
/** /**
* Schedule a reconnection attempt * Schedule a reconnection attempt
*/ */
private scheduleReconnect(): void { private scheduleReconnect(isAbnormalClosure = false): void {
// Don't reconnect if we've exceeded max attempts // Don't reconnect if we've exceeded max attempts
if (this.reconnectAttempts >= this.config.maxReconnectAttempts) { if (this.reconnectAttempts >= this.config.maxReconnectAttempts) {
console.log('WalletWebSocketService: Max reconnection attempts reached - disabling WebSocket') console.log('WalletWebSocketService: Max reconnection attempts reached - disabling WebSocket')
@ -326,10 +341,16 @@ export class WalletWebSocketService extends BaseService {
} }
// Calculate delay with exponential backoff // Calculate delay with exponential backoff
const delay = this.config.reconnectDelay * Math.pow(2, this.reconnectAttempts) let delay = this.config.reconnectDelay * Math.pow(2, this.reconnectAttempts)
// For abnormal closures (1006), use longer delays to avoid overwhelming server
if (isAbnormalClosure) {
delay = Math.max(delay, 5000) // Minimum 5 second delay for 1006 errors
}
this.reconnectAttempts++ this.reconnectAttempts++
console.log(`WalletWebSocketService: Reconnecting in ${delay}ms (attempt ${this.reconnectAttempts}/${this.config.maxReconnectAttempts})`) console.log(`WalletWebSocketService: Reconnecting in ${delay}ms (attempt ${this.reconnectAttempts}/${this.config.maxReconnectAttempts})${isAbnormalClosure ? ' [abnormal closure]' : ''}`)
this.connectionStatus.value = 'reconnecting' this.connectionStatus.value = 'reconnecting'
this.reconnectTimer = setTimeout(() => { this.reconnectTimer = setTimeout(() => {
@ -379,12 +400,34 @@ export class WalletWebSocketService extends BaseService {
this.disconnect() this.disconnect()
} }
/**
* Send ping to test connection
*/
private sendPing(): void {
if (this.ws && this.ws.readyState === WebSocket.OPEN) {
try {
// Send a ping frame (most WebSocket implementations support this)
this.ws.ping?.()
} catch (error) {
console.log('WalletWebSocketService: Ping not supported, connection seems stable')
}
}
}
/** /**
* Manual reconnection method * Manual reconnection method
*/ */
public async reconnect(): Promise<void> { public async reconnect(): Promise<void> {
console.log('WalletWebSocketService: Manual reconnection triggered')
this.reconnectAttempts = 0 this.reconnectAttempts = 0
await this.connectIfNeeded()
// Disconnect current connection if any
this.disconnect()
// Wait a moment before reconnecting
setTimeout(() => {
this.connectIfNeeded()
}, 1000)
} }
/** /**