首页 > 解决方案 > Websocket onmessage 事件仅触发一次

问题描述

我在 Angular 6 应用程序中使用了一个基本的 WebSocket 客户端。

除了出于某种原因,一切都有效,socket.onmessage或者socket.addEventListener('message'只被解雇一次。控制台上没有错误。并且消息被明确地发送到客户端(正确的消息显示在浏览器控制台的 websocket 连接框架中)。所有其他事件都正常工作。

这是我使用 websockets 的课程:

export class WebsocketService  implements OnDestroy {
  socket: WebSocket;

  constructor(@Inject(APP_CONFIG) private config: IAppConfig, private authService: AuthService) { }

  initConnection(): void {
    this.socket = new WebSocket(
      this.config.apiEndpoint.replace(/^https?:\/\//i, 'ws://') + 'ws/');
    this.watchEvent(WSEvent.ERROR).subscribe(data => {
      console.log(data);
    });
  }

  watchEvent(wsevent: WSEvent): Observable<any> {
    return new Observable(observer => {
      this.socket.addEventListener(wsevent, function (event) {
        observer.next(event);
      });
    });
  }

  onMessage(): Observable<any> {
    return new Observable(observer => {
      this.socket.onmessage = function (event) {
        observer.next(event);
      };
    });
  }

  ngOnDestroy() {
    // this.socket.close();
  }
}

事件:

export enum WSEvent {
  CLOSE = 'close',
  OPEN = 'open',
  MESSAGE = 'message',
  ERROR = 'error'
}

用法:

this.wsService.watchEvent('message').subscribe((data) => {
   console.log(data);
});


this.wsService.onMessage().subscribe((data) => {
  console.log(data);
});

在这两种情况下console.log(data);,我只显示发送给客户端的第一条消息。消息发送多少次以及消息的内容onmessage(参考这两个选项)只触发一次并不重要。

更新: 更新了这篇文章以包含实际工作的解决方案(问题是我打电话observer.complete();observer.next(event);做了它应该做的事情)

标签: angulartypescriptwebsocket

解决方案


必须observer.complete();从观察者中删除。


推荐阅读