WebSocket Use Cases: Real-time Applications and Beyond

1// Client-side JavaScript
2const socket = new WebSocket('ws://localhost:3000');
3
4socket.onopen = () => {
5  console.log('Connected to WebSocket server');
6};
7
8socket.onmessage = (event) => {
9  const message = event.data;
10  console.log('Received message:', message);
11  // Display the message in the chat window
12};
13
14socket.onclose = () => {
15  console.log('Disconnected from WebSocket server');
16};
17
18function sendMessage(message) {
19  socket.send(message);
20}
21

1// Example of sending document changes
2socket.send(JSON.stringify({ type: 'text-update', position: 10, text: 'new text' }));
3
4// Example of handling document changes received from the server
5socket.onmessage = (event) => {
6    const data = JSON.parse(event.data);
7    if (data.type === 'text-update') {
8        // Update the document content based on the received changes
9        updateDocument(data.position, data.text);
10    }
11};
12
13function updateDocument(position, text) {
14  // Implementation to update the document content at the specified position
15  console.log(`Updating document at position ${position} with text: ${text}`);
16}
17

1// Setting up a basic WebSocket server using Node.js and Socket.IO
2const io = require('socket.io')(3000, {
3  cors: {
4    origin: "*",
5    methods: ["GET", "POST"]
6  }
7});
8
9io.on('connection', socket => {
10  console.log('A user connected');
11
12  socket.on('disconnect', () => {
13    console.log('A user disconnected');
14  });
15
16  socket.on('message', message => {
17    console.log(`Received message: ${message}`);
18    io.emit('message', message); // Broadcast the message to all connected clients
19  });
20});
21

1// Connecting to a WebSocket server and handling messages in JavaScript
2const socket = new WebSocket('ws://localhost:3000');
3
4socket.onopen = () => {
5  console.log('Connected to WebSocket server');
6};
7
8socket.onmessage = (event) => {
9  const message = event.data;
10  console.log('Received message:', message);
11  // Handle the received message
12};
13
14socket.onclose = () => {
15  console.log('Disconnected from WebSocket server');
16};
17
18function sendMessage(message) {
19  socket.send(message);
20}
21