Веб-сокеты не подключаются к почтальону с помощью nestjs

Question

Я пытаюсь установить соединение с веб-сокетами. Если мне нужно подключиться к почтальону, мне нужно включить app.useWebSocketAdapter(new WsAdapter(app));чтобы заставить его работать. Но как только я включаю эту строку, она перестает подключаться к моему собственному коду реакции. Когда я удаляю эту строку, она начинает соединяться с собственным кодом реакции, а не с почтальоном. Как я могу заставить его работать как со стороны клиента, так и с почтальоном.

Ниже мой код шлюза

      import { Logger } from '@nestjs/common';
import {
  OnGatewayConnection,
  OnGatewayDisconnect,
  OnGatewayInit,
  SubscribeMessage,
  WebSocketGateway,
  WebSocketServer,
} from '@nestjs/websockets';
import { Server, Socket } from 'socket.io';

@WebSocketGateway()
export class AppGateway implements OnGatewayInit, OnGatewayConnection, OnGatewayDisconnect {
  @WebSocketServer()
  server!: Server;

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

  @SubscribeMessage('msgToServer')
  handleMessage(client: Socket, payload: string): void {
    this.server.emit('msgToClient', payload);
  }

  afterInit(server: Server) {
    this.logger.log('Init');
  }

  handleDisconnect(client: Socket) {
    this.logger.log(`Client disconnected: ${client.id}`);
  }

  handleConnection(client: Socket, ...args: any[]) {
    this.logger.log(`Client connected: ${client.id}`);
  }
}

main.ts

      import { AppModule } from 'app.module';
import { WsAdapter } from '@nestjs/platform-ws';

async function setupApplication(): Promise<INestApplication> {
  app.useWebSocketAdapter(new WsAdapter(app));
  await app.listen(port);
  return app;
}

В приведенном выше файле main.ts. Если я удалю app.useWebSocketAdapter(новый WsAdapter(app)); тогда я могу подключиться к моему собственному клиентскому коду реакции, но не к почтальону.

реагировать на собственный код

      import React, {useEffect} from 'react';
import {Button, SafeAreaView} from 'react-native';
import io  from 'socket.io-client';

const socket = io('http://localhost:3000');


export default function App() {
  const receiveMessage = () => {
    socket.on('msgToClient', msg => {
      console.log('msg', msg);
    });
  };

  const sendMessage = () => {
    socket.emit('msgToServer','test message');
  };

  useEffect(() => {

    receiveMessage()

  }, []);

  return (
    <SafeAreaView>
      <Button title="Message" onPress={sendMessage} />
    </SafeAreaView>
  );
}

Answer 1

Postman теперь поддерживает серверы Socket.io (это в бета-версии):

Пошагово по предоставленной ссылке:

1. На левой боковой панели нажмитеNew.
2. ВыбиратьWebSocket Request.
3. В заголовке новой вкладки щелкните раскрывающийся список с надписьюRawи выберитеSocket.IOвместо.
4. Введите адрес вашего сервера Socket.IO в адресную строку.
5. НажмитеConnect.

Поскольку вы не указываете конкретнуюnamespaceна@WebSocketGateway()декоратор и предполагая, что вы используете порт NestJS по умолчанию3000, Шаг4адрес будет:

      http://localhost:3000

Кроме того, если вы используете NestJS в WSL, вы можете увидеть этот ответ.

Answer 2

Почтальон использует ws: протокол, который WsAdapterдля. По умолчанию Nest использует де-факто адаптер WebSocket, который не подключается через wsчисто, но через двигатель. Ваш код реакции использует, поэтому ваш серверный код должен использовать socket.ioслишком. Это означает, что вы не сможете использовать почтальон для тестирования своих веб-узлов, если только вы не будете постоянно переключаться между ними.