Broadcasting messages in NestJS - Step-by-Step Execution

Concept Flow - Broadcasting messages

Client connects

↓

Server receives connection

↓

Server listens for message

↓

Server receives message

↓

Server broadcasts message to all clients

↓

Clients receive broadcasted message

This flow shows how a NestJS server receives a message from one client and broadcasts it to all connected clients.

Execution Sample

NestJS

import { WebSocketGateway, SubscribeMessage, WebSocketServer } from '@nestjs/websockets';
import { Server } from 'socket.io';

@WebSocketGateway()
export class ChatGateway {
  @WebSocketServer() server: Server;

  @SubscribeMessage('message')
  handleMessage(client: any, payload: string) {
    this.server.emit('message', payload);
  }
}

This code defines a WebSocket gateway in NestJS that listens for 'message' events and broadcasts the received message to all clients.

Execution Table

Step	Action	Input/Condition	Result	Broadcasted Message
1	Client connects	Client A connects	Connection established	None
2	Client sends message	Client A sends 'Hello!'	Server receives 'Hello!'	None
3	Server broadcasts	Server emits 'Hello!'	All clients receive 'Hello!'	'Hello!'
4	Client B receives	Client B connected	Client B gets 'Hello!'	'Hello!'
5	Client C receives	Client C connected	Client C gets 'Hello!'	'Hello!'
6	No more messages	No new input	Waiting for next message	None

💡 No new messages sent, server waits for next input

Variable Tracker

Variable	Start	After Step 2	After Step 3	Final
server	Server instance created	Server ready to emit	Server emitted 'Hello!'	Server ready for next
payload	undefined	'Hello!'	'Hello!'	undefined or next message

Key Moments - 2 Insights

Why does the server use this.server.emit instead of client.emit?

Using this.server.emit sends the message to all connected clients, not just the sender. See execution_table step 3 where the server broadcasts to all.

What happens if no clients are connected when the server emits?

The message is sent but no clients receive it. The server stays ready for future connections, as shown in execution_table step 6.

Visual Quiz - 3 Questions

Look at the execution table, what message does the server broadcast at step 3?

A 'Goodbye!'

B No message

C 'Hello!'

D 'Welcome!'

💡 Hint

Check the 'Broadcasted Message' column at step 3 in the execution_table.

At which step does Client B receive the broadcasted message?

A Step 2

B Step 4

C Step 3

D Step 5

💡 Hint

Look at the 'Action' and 'Result' columns for Client B in the execution_table.

If the server used client.emit instead of this.server.emit, what would change?

A Only the sending client receives the message

B All clients receive the message

C No clients receive the message

D The server crashes

💡 Hint

Refer to key_moments explanation about server.emit vs client.emit.

Concept Snapshot

NestJS broadcasting messages:
- Use @WebSocketGateway() to create gateway
- Use @SubscribeMessage('event') to listen
- Use this.server.emit('event', data) to broadcast
- Emits send to all connected clients
- Clients receive broadcasted messages automatically

Full Transcript

In NestJS, broadcasting messages means sending a message from one client to all connected clients through the server. The server listens for a message event using @SubscribeMessage. When a message arrives, the server uses this.server.emit to send it to everyone. This way, all clients get the message, not just the sender. If no clients are connected, the server waits for new connections. This process helps create real-time chat or notification systems easily.

Practice

1. What does broadcasting messages in a NestJS WebSocket gateway do?

easy

A. Sends a message to only one client

B. Saves messages to a database

C. Sends a message to all connected clients at once

D. Blocks messages from being sent

Solution

1. Step 1: Understand broadcasting meaning

   Broadcasting means sending the same message to everyone connected.

2. Step 2: Apply to NestJS WebSocket gateway

   In NestJS, broadcasting sends messages to all clients, not just one.

3. Final Answer:

   Sends a message to all connected clients at once -> Option C

4. Quick Check:

   Broadcasting = send to all clients [OK]

Hint: Broadcast means send to everyone connected [OK]

Common Mistakes:

• Thinking broadcasting sends to one client only
• Confusing broadcasting with saving messages
• Assuming broadcasting blocks messages

2. Which is the correct way to broadcast a message named 'update' with data in a NestJS WebSocket gateway?

easy

A. this.emit.server('update', data);

B. this.server.emit('update', data);

C. server.this.emit('update', data);

D. emit.this.server('update', data);

Solution

1. Step 1: Recall NestJS WebSocket broadcast syntax

   The correct syntax is calling emit on this.server with event and data.

2. Step 2: Check each option's syntax

   Only this.server.emit('update', data); matches the correct method call: this.server.emit('update', data); others have wrong order or method names.

3. Final Answer:

   this.server.emit('update', data); -> Option B

4. Quick Check:

   Correct emit call = this.server.emit(event, data) [OK]

Hint: Use this.server.emit(event, data) to broadcast [OK]

Common Mistakes:

• Swapping order of 'this' and 'server'
• Using emit as a property instead of a method
• Incorrect method call syntax

3. Given this code inside a NestJS WebSocket gateway:

this.server.emit('notify', { message: 'Hello' });

What will happen when this line runs?

medium

A. The server logs the message but does not send it

B. Only the client who sent the last message receives the event

C. An error occurs because emit needs a callback

D. All connected clients receive the 'notify' event with the message

Solution

1. Step 1: Understand this.server.emit behavior

   This method broadcasts the event to all connected clients.

2. Step 2: Analyze the code effect

   The 'notify' event with the message object is sent to everyone connected.

3. Final Answer:

   All connected clients receive the 'notify' event with the message -> Option D

4. Quick Check:

   this.server.emit sends to all clients [OK]

Hint: Emit on server sends to all clients, not just one [OK]

Common Mistakes:

• Thinking only one client receives the event
• Assuming emit logs instead of sending
• Believing emit requires a callback

4. Identify the error in this NestJS WebSocket gateway code snippet:

this.server.emit('chat', message)

where message is undefined.

medium

A. No error; undefined message is sent as is

B. Runtime error because message must be a string

C. Syntax error due to missing semicolon

D. Emit method requires a callback function

Solution

1. Step 1: Check if undefined data causes error

   Emitting undefined data does not cause syntax or runtime errors in NestJS.

2. Step 2: Confirm emit method requirements

   Emit accepts any data type; no callback is required.

3. Final Answer:

   No error; undefined message is sent as is -> Option A

4. Quick Check:

   Emit accepts undefined data without error [OK]

Hint: Undefined data can be emitted without error [OK]

Common Mistakes:

• Assuming undefined causes runtime error
• Thinking emit needs a callback
• Confusing missing semicolon as error

5. You want to broadcast a message only to clients in a specific room named 'chat-room' in NestJS. Which code correctly does this?

hard

A. this.server.to('chat-room').emit('message', data);

B. this.server.emit('chat-room', 'message', data);

C. this.server.broadcast('chat-room').emit('message', data);

D. this.server.emit('message', data).to('chat-room');

Solution

1. Step 1: Understand broadcasting to rooms in NestJS

   To send to a specific room, use this.server.to(roomName).emit(event, data).

2. Step 2: Check each option for correct syntax

   this.server.to('chat-room').emit('message', data); uses correct chaining: to('chat-room').emit('message', data). Others misuse emit or method order.

3. Final Answer:

   this.server.to('chat-room').emit('message', data); -> Option A

4. Quick Check:

   Broadcast to room = this.server.to(room).emit(event, data) [OK]

Hint: Use this.server.to(room).emit(event, data) for room broadcast [OK]

Common Mistakes:

• Calling emit before to()
• Using broadcast() method which doesn't exist
• Passing room name as event name