1

I am fairly new to websockets, I am developing a NestJS api which would poll the database and update the frontend at realtime so for that I am trying to use Websockets. I have many other routes that do not require a socket connection, so only to implement the socket connection in one route I followed this answer

So I setup my socket.module and socket.service like the following:

socket.module

import { Module, Global } from '@nestjs/common';
import { SocketService } from './socket.service';

@Global()
@Module({
  controllers: [],
  providers: [SocketService],
  exports: [SocketService],
})
export class SocketModule {}

socket.service

import { Injectable } from '@nestjs/common';
import { Server } from 'socket.io';

@Injectable()
export class SocketService {
  public socket: Server = null;
}

Set up app.gateway.ts and added it as a provider to my app.module,also imported the Socketmodule into app.module.

app.gateway.ts

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

@WebSocketGateway()
export class AppGateway
  implements OnGatewayInit, OnGatewayConnection, OnGatewayDisconnect
{
  constructor(private socketService: SocketService) {}
  @WebSocketServer() public 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.socketService.socket = server;
  }

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

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

app.module.ts

import { Module } from '@nestjs/common';
import { AppController } from './app.controller';
import { AppService } from './app.service';
import { TypeOrmModule } from '@nestjs/typeorm';
import { ConfigModule } from '@nestjs/config';
import { AuthModule } from './auth/auth.module';
import { UserModule } from './user/user.module';
import { HomeModule } from './home/home.module';
import { SocketModule } from './socket/socket.module';
import { AppGateway } from './app.gateway';
@Module({
  imports: [
    ConfigModule.forRoot({ isGlobal: true }),
    TypeOrmModule.forRoot({
      type: 'mysql',
      host: 'localhost',
      port: 3306,
      username: process.env.DB_USER,
      password: process.env.DB_PASSWORD,
      database: process.env.DB_NAME,
      entities: ['dist/**/*.entity{.ts,.js}'],
      synchronize: true,
    }),
    AuthModule,
    UserModule,
    HomeModule,
    SocketModule,
  ],
  controllers: [AppController],
  providers: [AppService, AppGateway],
})
export class AppModule {}

Now in my home module, I injected the Socket.service as a dependency, with postman I can also establish a connection at localhost:3000 but it does not make any response. I have added an event listener at postman name msgToServer and sent messages, but neither a response nor any console.log shows up. home.controller.ts

import { Controller, Get, UseGuards } from '@nestjs/common';
import { AuthGuard } from '@nestjs/passport';
import { SocketService } from 'src/socket/socket.service';
@Controller('/home')
@UseGuards(AuthGuard())
export class HomeController {
  // eslint-disable-next-line @typescript-eslint/no-empty-function
  constructor(private readonly socketService: SocketService) {}
  @Get()
  getHello(client): boolean {
    console.group('HomeController');
    return this.socketService.socket.emit('msgToServer', 'Hello World');
  }
}

What am I doing wrong here?If not a concise answer but pointing me to the right direction would also be helpful.

0 Answers0