Angular4 Websocket rxjs Переподключиться и onError
Похоже, что есть несколько похожих вопросов, но через несколько дней я не могу найти правильный ответ. Мой вопрос заключается в том, как узнать, закрыл ли сервер веб-сокет и как попытаться восстановить соединение. Я видел несколько примеров, но ни один из них не работал должным образом, когда я хотел реализовать функциональность закрытия веб-сокета от клиента при изменении представления.
Затем я нашел этот пример, который является лучшим из всех, что я когда-либо видел, и с небольшими изменениями я смог добавить функцию закрытия, которая работает довольно хорошо.
Закрытие веб-сокета от клиента больше не является проблемой, однако я не могу знать, когда веб-сокет закрыт сервером и как снова подключиться.
Мой код очень похож на этот вопрос, но я спрашиваю о другом. Кроме того, у меня были проблемы с повторным использованием websocket, пока я не увидел функцию общего доступа, о которой они говорят, по ссылке, которую я разместил, поэтому в классе, который я разместил, служба websocket и служба, которая использовала службу websocket, объединены в одну.
Мой сервис веб-сокетов
import { Injectable } from '@angular/core';
import { Observable, Observer, Subscription } from 'rxjs';
import { Subject } from 'rxjs/Subject';
import { ConfigService } from "../config.service";
@Injectable()
export class WSEtatMachineService {
public messages: Subject<any> = new Subject<any>();
private url: string = '';
static readonly ID = 'machine';
private _subject: Subject<MessageEvent>;
private _subjectData: Subject<number>;
private _ws: any;
constructor(private configService: ConfigService) {
console.log('constructyor ws machine service')
this.setUrl(WSEtatMachineService.ID)
}
public setUrl(id:string) {
const host = this.configService.getConfigReseau().ipServer;
const port = this.configService.getConfigReseau().portServer;
this.url = `ws://${host}:${port}/` + id
}
public connect() {
console.log('connect ws machine service ', this.url)
this.messages = <Subject<any>>this._connect(this.url)
.map((response: any): any => {
console.log('ws etat machine service: ', response)
return JSON.parse(response.data);
})
}
public close() {
console.log('on closing WS');
this._ws.close()
this._subject = null
}
public send(msg: any) {
this.messages.next(JSON.stringify(msg));
}
// Private methods to create the websocket
public _connect(url: string): Subject<MessageEvent> {
if (!this._subject) {
this._subject = this._create(url);
}
return this._subject;
}
private _create(url: string): Subject<MessageEvent> {
this._ws = new WebSocket(url);
let observable = Observable.create(
(obs: Observer<MessageEvent>) => {
this._ws.onmessage = obs.next.bind(obs);
this._ws.onerror = obs.error.bind(obs);
this._ws.onclose = obs.complete.bind(obs);
return this._ws.close.bind(this._ws);
}).share();
let observer = {
next: (data: Object) => {
if (this._ws.readyState === WebSocket.OPEN) {
this._ws.send(JSON.stringify(data));
}
}
};
return Subject.create(observer, observable);
}
} // end class
Затем в компоненте я делаю:
constructor( private wsMachineService: WSMachineService) { ... }
ngOnInit() {
...
this.wsMachineService.connect();
// connexion du web socket
this.wsMachineService.messages.subscribe(
machine => {
console.log(" wsMachineService open and alive", machine);
},
err => {
// This code is never executed
console.log(" wsMachineService closed by server!!", err);
}
);
}
ngOnDestroy() {
//let tmp = this.synoptiqueSocketSubscription.unsubscribe();
this.wsMachineService.messages.unsubscribe();
this.wsMachineService.close()
}
Я предполагаю, что что-то упустил в функции _create, потому что я пытаюсь сделать уловку в теме функции connect, и она не работает.
Любые идеи о том, как я могу узнать, закрывается ли он, и попытаться снова подключиться?
Спасибо
Редактировать: я думаю, что моя проблема связана с предметом / наблюдаемыми, так как я не контролирую их полностью. У меня был старый подход, при котором я мог знать, когда сервер мертв, и он пытался переподключиться каждые X секунд, но, к сожалению, я не смог закрыть соединение с клиентом, поскольку у меня не было доступа к объекту websocket. Я также добавляю код:
public messages: Observable<any>;
private ws: Subject<any>;
private url: string;
public onclose = new Subject();
public connect(urlApiWebSocket: string): Observable<any> {
if (this.messages && this.url === urlApiWebSocket) {
return this.messages;
}
this.url = urlApiWebSocket;
this.ws = Observable.webSocket({
url: urlApiWebSocket,
closeObserver: this.onclose
});
return this.messages = this.ws.retryWhen(errors => errors.delay(10000)).map(msg => msg).share();
}
send(msg: any) {
this.ws.next(JSON.stringify(msg));
}
Посмотрим, сможем ли мы объединить оба решения.
2 ответа
Ну, я нашел способ. Я использую старый подход с Observable.websocket
@Injectable()
export class WSMyService {
private url: string = '';
static readonly ID = 'mytestwebsocket';
readonly reload_time = 3000;
public messages: Observable<any>;
private ws: Subject<any>;
public onclose = new Subject();
constructor(private configService: ConfigService) {
console.log('constructor ws synop service')
this.setUrl(WSActionFrontService.ID)
}
public setUrl(id:string) {
...
this.url = `ws://${host}:${port}/` + id
}
public connect(): Observable<any> {
this.ws = Observable.webSocket({
url: this.url,
closeObserver: this.onclose
});
return this.messages = this.ws.retryWhen(errors => errors.delay(this.reload_time)).map(msg => msg).share();
}
send(msg: any) {
this.ws.next(JSON.stringify(msg));
}
public close() {
console.log('on closing WS');
this.ws.complete();
}
и когда я использую это:
constructor(
private wsMyService: WSMyService,
ngOnInit():
...
this.mySocketSubscription = this.wsMyService.connect().subscribe(message => {
... }
this.wsMyService.onclose.subscribe(evt => {
// the server has closed the connection
})
ngOnDestroy() {
this.wsMyService.close();
this.mySocketSubscription.unsubscribe();
...
}
Похоже, все, что мне нужно было сделать, это вызвать функцию complete(), которая сообщает серверу, что клиент завершил работу. Я уверен, что есть лучший способ, но это единственный, который я нашел, который работает для меня.
Спасибо за помощь.
У вас нет никакого способа узнать, когда сервер закрывает соединение с клиентом.
Как вы заметили,this._ws.onclose = obs.complete.bind(obs); Будет срабатывать только тогда, когда клиент выполняет действие "закрыть".
Обычный способ тренироваться:
- На своем сервере вы отправляете специальное сообщение всем своим клиентам, чтобы уведомить об этом.
- Создайте механику пинга, чтобы узнать у сервера, жив ли он.