diff --git a/src/app/group-monitor/websocket-backend.service.ts b/src/app/group-monitor/websocket-backend.service.ts index 58c3a0dc2dccc8209c8887c2ca2b14c3d35bb3a7..045bcd07e2f82a7c6d4607f6d76848eb102658c6 100644 --- a/src/app/group-monitor/websocket-backend.service.ts +++ b/src/app/group-monitor/websocket-backend.service.ts @@ -62,26 +62,26 @@ export abstract class WebsocketBackendService<T> extends WebsocketService implem .get<T>(this.serverUrl + this.pollingEndpoint, {observe: 'response'}) .pipe( catchError((err: ApiError) => { - console.warn(`Api-Error: ${err.code} ${err.info}`); - this.connectionStatus$.next("error"); - return of([]) + console.warn(`Api-Error: ${err.code} ${err.info}`); + this.connectionStatus$.next("error"); + return of([]) }) ) .subscribe((response: HttpResponse<T>) => { - this.data$.next(response.body); + this.data$.next(response.body); - if (response.headers.has('SubscribeURI')) { + if (response.headers.has('SubscribeURI')) { - console.log('switch to websocket-mode'); - this.urlParam = response.headers.get('SubscribeURI'); - this.subScribeToStatusUpdateWsChannel(); + this.wsUrl = response.headers.get('SubscribeURI'); + console.log('switch to websocket-mode'); + this.subScribeToWsChannel(); - } else { + } else { - this.connectionStatus$.next("polling-sleep"); - this.scheduleNextPoll(); - } + this.connectionStatus$.next("polling-sleep"); + this.scheduleNextPoll(); + } }); } @@ -122,12 +122,12 @@ export abstract class WebsocketBackendService<T> extends WebsocketService implem } - private subScribeToStatusUpdateWsChannel() { + private subScribeToWsChannel() { this.wsDataSubscription = this.getChannel<T>(this.wsChannelName) .subscribe((dataObject: T) => this.data$.next(dataObject)); // subscribe only next, not complete! - this.wsConnectionStatusSubscription = this.serviceConnected$ + this.wsConnectionStatusSubscription = this.wsConnected$ .pipe( skipWhile((item: boolean) => item === null), // skip pre-init-state tap((wsConnected: boolean) => { diff --git a/src/app/group-monitor/websocket.service.ts b/src/app/group-monitor/websocket.service.ts index 3f5d6f099e7ae67668e3437e32a70bfc3b0de17a..84d9b5efdd07c8be4bad10842d970816b4498fd6 100644 --- a/src/app/group-monitor/websocket.service.ts +++ b/src/app/group-monitor/websocket.service.ts @@ -10,12 +10,11 @@ interface WsMessage { export class WebsocketService { - protected url = 'ws://127.0.0.1:3000'; - protected urlParam = "XYZ"; + protected wsUrl: string = ""; - private webSocketSubject$: WebSocketSubject<any>; + private wsSubject$: WebSocketSubject<any>; - public serviceConnected$ = new BehaviorSubject<boolean>(null); + public wsConnected$ = new BehaviorSubject<boolean>(null); constructor( @@ -23,17 +22,13 @@ export class WebsocketService { } - public connect(urlParam: string, forceReconnect: boolean = false): WebSocketSubject<any> { + public connect() { - this.urlParam = urlParam; + if (!this.wsSubject$) { - // const url = 'wss://echo.websocket.org'; + console.log('connecting...' + this.wsUrl); - if (!this.webSocketSubject$ || forceReconnect) { - - console.log('connecting...' + urlParam); - - this.webSocketSubject$ = webSocket({ + this.wsSubject$ = webSocket({ deserializer(event: MessageEvent): any { return JSON.parse(event.data); @@ -46,50 +41,48 @@ export class WebsocketService { openObserver: { next: () => { console.log('connection established'); - this.serviceConnected$.next(true); + this.wsConnected$.next(true); } }, - url: this.url + '/' + urlParam + url: this.wsUrl }); - this.webSocketSubject$.subscribe( + this.wsSubject$.subscribe( () => {}, () => { console.log('connection error'); - this.serviceConnected$.next(false); + this.wsConnected$.next(false); }, () => { console.log('connection closed'); - this.serviceConnected$.next(false); + this.wsConnected$.next(false); } ); } - - return this.webSocketSubject$; } public send(event: string, data: any) { - if (!this.webSocketSubject$) { - this.connect(this.urlParam); + if (!this.wsSubject$) { + this.connect(); } - this.webSocketSubject$.next({event, data}); + this.wsSubject$.next({event, data}); } public getChannel<T>(channelName: string): Observable<T> { - if (!this.webSocketSubject$) { - this.connect(this.urlParam); + if (!this.wsSubject$) { + this.connect(); } - return this.webSocketSubject$ + return this.wsSubject$ .multiplex( () => ({event: `subscribe:${channelName}`}), () => ({event: `unsubscribe:${channelName}`}),