WebSocket protocol concept in Node.js - Practice Problems & Coding Challenges

Challenge - 5 Problems

🧠 Conceptual

intermediate

What is the main advantage of WebSocket over HTTP?

WebSocket is often chosen over HTTP for certain applications. What is the main advantage of using WebSocket compared to HTTP?

A WebSocket requires no handshake, so it connects instantly without delay.

B WebSocket uses less bandwidth because it compresses all messages automatically.

C WebSocket allows full-duplex communication, enabling real-time two-way data exchange.

D WebSocket is stateless, so it does not keep any connection open between client and server.

💡 Hint

Think about how data flows between client and server in real-time apps like chat.

WebSocket enables full-duplex communication, meaning both client and server can send messages independently at any time. HTTP is request-response only.

❓ component_behavior

intermediate

What happens when a WebSocket client sends a message?

In a Node.js WebSocket server, what happens immediately after a client sends a message?

Node.js

const WebSocket = require('ws');
const wss = new WebSocket.Server({ port: 8080 });
wss.on('connection', ws => {
  ws.on('message', message => {
    // What happens here?
  });
});

A The server receives the message event and can process or respond to the client immediately.

B The server queues the message and waits for the client to send a close signal before processing.

C The server ignores the message unless the client sends a ping frame first.

D The server automatically broadcasts the message to all connected clients without code.

💡 Hint

Consider the event listeners set up on the server side.

When a client sends a message, the server's 'message' event handler runs immediately, allowing the server to handle or reply to the message.

📝 Syntax

advanced

Identify the correct way to send a message to a WebSocket client in Node.js

Which of the following code snippets correctly sends a text message 'Hello' to a connected WebSocket client?

Node.js

const WebSocket = require('ws');
const wss = new WebSocket.Server({ port: 8080 });
wss.on('connection', ws => {
  // send message here
});

A ws.send('Hello');

B ws.sendMessage('Hello');

C ws.emit('send', 'Hello');

D ws.write('Hello');

💡 Hint

Check the official WebSocket API method for sending data.

The correct method to send data to a WebSocket client is send(). Other methods do not exist or do not send messages.

🔧 Debug

advanced

Why does this WebSocket server code fail to respond to clients?

Consider this Node.js WebSocket server code. Why does it never send a response back to clients?

Node.js

const WebSocket = require('ws');
const wss = new WebSocket.Server({ port: 8080 });
wss.on('connection', ws => {
  ws.on('message', message => {
    ws.sendMessage('Received: ' + message);
  });
});

A The server needs to wait for a 'ready' event before sending messages.

B The method <code>sendMessage</code> does not exist; it should be <code>send</code>.

C The server must use <code>ws.emit('message', ...)</code> to send data.

D The server must call <code>ws.connect()</code> before sending messages.

💡 Hint

Check the WebSocket API method names carefully.

The WebSocket client object has a send() method, not sendMessage(). Using a wrong method causes no message to be sent.

❓ state_output

expert

What is the final value of 'count' after this WebSocket server handles 3 client messages?

Given the following Node.js WebSocket server code, what is the value of count after three messages are received from any clients?

Node.js

const WebSocket = require('ws');
const wss = new WebSocket.Server({ port: 8080 });
let count = 0;
wss.on('connection', ws => {
  ws.on('message', message => {
    count += 1;
    ws.send(`Message number ${count}`);
  });
});

A Depends on how many clients are connected

B 1

C 0

D 3

💡 Hint

Count increases each time any client sends a message.

The variable count is incremented every time any client sends a message. After three messages total, count is 3.

Practice

1. What is the main purpose of the WebSocket protocol in Node.js applications?

easy

A. To send HTTP requests from client to server

B. To create a live, two-way communication channel between client and server

C. To serve static files like HTML and CSS

D. To store data permanently on the server

Solution

1. Step 1: Understand WebSocket communication

   WebSocket allows a persistent connection where both client and server can send messages anytime.

2. Step 2: Compare with other options

   HTTP requests are one-way and short-lived, static files serving and data storage are unrelated to WebSocket's main role.

3. Final Answer:

   To create a live, two-way communication channel between client and server -> Option B

4. Quick Check:

   WebSocket = two-way live connection [OK]

Hint: WebSocket means live two-way chat between client and server [OK]

Common Mistakes:

• Confusing WebSocket with HTTP request-response
• Thinking WebSocket serves static files
• Assuming WebSocket stores data permanently

2. Which of the following is the correct way to create a WebSocket server using the 'ws' library in Node.js?

easy

A. const ws = new WebSocket(8080);

B. const ws = WebSocket.createServer(8080);

C. const ws = new WebSocket.Server({ port: 8080 });

D. const ws = WebSocket.listen(8080);

Solution

1. Step 1: Recall 'ws' library syntax

   The 'ws' library creates a server with new WebSocket.Server and a config object with port.

2. Step 2: Check each option

   Only const ws = new WebSocket.Server({ port: 8080 }); uses correct constructor and port option. Others use invalid methods or constructors.

3. Final Answer:

   const ws = new WebSocket.Server({ port: 8080 }); -> Option C

4. Quick Check:

   WebSocket.Server + port config = correct [OK]

Hint: Use new WebSocket.Server({ port }) to create server [OK]

Common Mistakes:

• Using WebSocket constructor instead of WebSocket.Server
• Calling non-existent methods like createServer or listen
• Passing port as a direct argument instead of in an object

3. Given this Node.js WebSocket server code snippet, what will be logged when a client sends the message 'hello'?

const WebSocket = require('ws');
const wss = new WebSocket.Server({ port: 8080 });
wss.on('connection', ws => {
  ws.on('message', message => {
    console.log(`Received: ${message}`);
    ws.send('pong');
  });
});

medium

A. Received: hello

B. pong

C. Received: pong

D. hello

Solution

1. Step 1: Analyze message event handler

   When the server receives a message, it logs 'Received: ' plus the message content.

2. Step 2: Identify logged output

   Client sends 'hello', so console logs 'Received: hello'. The server sends back 'pong' but that is not logged.

3. Final Answer:

   Received: hello -> Option A

4. Quick Check:

   Server logs received message text [OK]

Hint: Server logs 'Received: message' on message event [OK]

Common Mistakes:

• Confusing sent message with logged message
• Thinking server logs the reply it sends
• Mixing up client and server console outputs

4. Identify the error in this WebSocket server code snippet:

const WebSocket = require('ws');
const wss = new WebSocket.Server({ port: 8080 });
wss.on('connection', ws => {
  ws.on('message', (msg) => {
    ws.send(msg.toUpperCase);
  });
});

medium

A. The port number must be a string, not a number

B. WebSocket.Server should be WebSocket.createServer

C. The 'message' event handler should be 'onMessage'

D. msg.toUpperCase should be called as a function: msg.toUpperCase()

Solution

1. Step 1: Check usage of toUpperCase

   toUpperCase is a function and must be called with parentheses to get the uppercase string.

2. Step 2: Verify other parts

   WebSocket.Server is correct, 'message' event is correct, port can be a number.

3. Final Answer:

   msg.toUpperCase should be called as a function: msg.toUpperCase() -> Option D

4. Quick Check:

   Call string methods with () [OK]

Hint: String methods need () to execute, not just reference [OK]

Common Mistakes:

• Forgetting parentheses on string methods
• Using wrong event names like 'onMessage'
• Confusing WebSocket server creation syntax

5. You want to build a Node.js WebSocket server that broadcasts any message received from one client to all connected clients except the sender. Which code snippet correctly implements this behavior?

hard

A. wss.on('connection', ws => {
ws.on('message', message => {
wss.clients.forEach(client => {
if (client !== ws && client.readyState === WebSocket.OPEN) {
client.send(message);
}
});
});
});

B. wss.on('connection', ws => {
ws.on('message', message => {
ws.send(message);
});
});

C. wss.on('connection', ws => {
ws.on('message', message => {
wss.send(message);
});
});

D. wss.on('message', message => {
wss.clients.forEach(client => client.send(message));
});

Solution

1. Step 1: Understand broadcasting logic

   Broadcast means sending message to all clients except the sender, checking if client connection is open.

2. Step 2: Analyze each option

   wss.on('connection', ws => { ws.on('message', message => { wss.clients.forEach(client => { if (client !== ws && client.readyState === WebSocket.OPEN) { client.send(message); } }); }); }); loops over all clients, skips sender, checks readyState, and sends message correctly. Others either send only to sender, call invalid methods, or listen on wrong event.

3. Final Answer:

   Option A code snippet correctly broadcasts to all except sender -> Option A

4. Quick Check:

   Broadcast = send to all except sender with readyState check [OK]

Hint: Use wss.clients.forEach and skip sender to broadcast [OK]

Common Mistakes:

• Sending message only back to sender
• Calling send on wss object instead of clients
• Not checking client.readyState before sending