Javascript，异步问题所需的解决方案

Question

目前正在使用 Angular、socket.io 和 express 创建一个应用程序。但是，我遇到了一个异步问题，我很难找到解决方案。这是代码:

  export class WebsocketService {

  this.socket;

  public connect() {
    const token = sessionStorage.getItem('token');
    this.socket = io('http://localhost:3000', { query: { token: token } });
  }

  public getSocket () {

      // this function should only return this.socket when it is available

      return this.socket;

  }

这个想法是，首先在应用程序的某处某处与 websocket 连接一次，因此调用 io 函数一次:

    this.socket = io('http://localhost:3000', { query: { token: token } });

然后在应用程序的其余部分，应该传递 this.socket 属性。但是，this.socket 应该始终返回该对象，如果它不存在则应该等待它。

实现还应处理应用程序的其他部分，这些部分尝试调用 getSocket 并返回未定义。基本上，getSocket 不应该返回 undefined 它应该等待连接然后返回 this.socket。

我试着玩弄了一些 promises，但我似乎找不到一个优雅的解决方案。

Answer 1

我不知道你为什么需要 connect 方法，但这是一种方法

export class WebsocketService {

  getSocket() {

    // this function should only return this.socket when it is available

    if (!this.socket || (this.socket && this.socket.disconnected)) {

      this.socket = new Promise((resolve, reject) => {

        const token = sessionStorage.getItem('token');
        const s = io('http://localhost:3000', { query: { token: token } });

        s.on('connect', () => {
          console.log(socket.connected); // true
          resolve(s);
        });

        s.on('disconnect', () => {
          console.log(socket.disconnect); // true
          reject(s);
        });
      });
    }

    return this.socket;
  }
}

那么，用法是:

service.getSocket().then(socket => {
    // Use the socket
});

或者使用异步/等待:

const socket = await service.getSocket();
// Use the socket