我正在尝试在NestJs服务器和我的angular应用程序之间实现一个WebSocket。
我在这里引用了NestJs的官方文档：https://docs.nestjs.com/websockets/gateways
我可以打开两个实体之间的通信，但我无法发送事件。

服务器网关

@WebSocketGateway()
export class SsgGateway implements OnGatewayInit, OnGatewayConnection {

    private logger: Logger = new Logger('SsgGateway');

    @WebSocketServer() wss: Server

    afterInit(server: any) {
        this.logger.log('Websocket gateway initialized')
    }

    handleConnection(client: any, ...args: any[]) {
        this.logger.log("Client connected")
    }

    @SubscribeMessage('msgToServer')
    handleMessage(client: Socket, payload: string): WsResponse<string> {
        this.wss.emit('msgToClient', payload)
    }
}

字符串

• 我自然地将我的SsgGateway导入到app.module和enableCors中
• afterInit在服务器启动期间触发（npm run：start）
• handleConnection在启动时获取客户端连接（“客户端已连接”）

现在，我的客户端无法通过我的套接字发送任何消息。我尝试了两个不同的包，但不幸的是，它不工作。
安装的软件包包括：

• socket.io-client
• ngx-socket-io

下面是使用socket.io-client实现的客户端解决方案：

服务项目

export class WebsocketService {

  constructor() {
    this.socket = io('ws://localhost:3000')
  }

  socket: any;

  listen(eventName: string) {
    return new Observable((subscriber) => {
      this.socket.on(eventName, (data) => {
        subscriber.next(data);
      })
    });
  }

  emit(eventName: string, data: any) {
    this.socket.emit(eventName, data);
  }

}

型

组件

export class AppComponent {
  title = 'websocket';

  constructor(private ws: WebsocketService) { }

  ngOnInit() {
    // Listen to websocket event
    this.ws.listen('msgToClient').subscribe((data) => {
      console.log(data);
    })
  }

  send() {
    this.ws.emit('msgToServer', "test");
  }

}

型
我绑定了一个触发“send”事件的htlm按钮，但是我从来没有从我的WebSocket中获得任何数据。
下面是ngx-socket-io包尝试的解决方案：

模块

const config: SocketIoConfig = { url: 'http://localhost:3000', options: {  } };

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    SocketIoModule.forRoot(config)
  ],
  providers: [AppService, WebsocketService],
  bootstrap: [AppComponent]
})
export class AppModule { }

型

服务项目

constructor(private socket: Socket) { }

  sendMessage(msg: string) {
    this.socket.emit('msgToServer', msg);
  }

  getMessage() {
    return this.socket.fromEvent('msgToClient').pipe(map((data: {}) => data));
  }

型

组件

constructor(private appService: AppService) { }

  ngOnInit() {
    this.appService.getMessage().subscribe((data) => {
      console.log(data);
     })
  }

  send() {
    this.appService.sendMessage("test")
  }

型
我甚至没有谈论名称空间的使用，这似乎相当复杂的使用。
一个使用Angular和NestJs的WebSocket的工作示例将非常棒！
非常感谢你们！