главная/Node JS: мгновенные сообщения при помощи WebSocket
Node js websocket

Node JS: мгновенные сообщения при помощи WebSocket

WebSocket — это протокол связи, который обеспечивает двунаправленную связь в режиме реального времени между клиентом и сервером.

В этой статье мы рассмотрим, как использовать WebSocket в Node.js для создания мгновенных сообщений и приложений в реальном времени.

Установка необходимых пакетов:

Для начала установите пакет «ws» — это библиотека WebSocket для Node.js. Выполните следующую команду:

npm install ws

Создание сервера WebSocket:

Создайте файл server.js и импортируйте библиотеку «ws». Затем создайте новый экземпляр сервера WebSocket и укажите порт для прослушивания:

const WebSocket = require('ws');
const server = new WebSocket.Server({ port: 8080 });

Обработка событий сервера WebSocket:

Добавьте обработчик событий connection для обработки новых подключений. Внутри обработчика вы сможете получить доступ к сокету, который представляет клиента:

server.on('connection', (socket) => {
  console.log('Client connected');

  // Обработка полученных сообщений
  socket.on('message', (message) => {
    console.log(`Received: ${message}`);

    // Рассылка сообщений всем подключенным клиентам
    server.clients.forEach((client) => {
      if (client.readyState === WebSocket.OPEN) {
        client.send(message);
      }
    });
  });

  // Обработка закрытия соединения
  socket.on('close', () => {
    console.log('Client disconnected');
  });
});

Создание клиентской части:

Создайте HTML-файл с полем ввода и кнопкой отправки. Добавьте скрипт для подключения к серверу WebSocket и обработки событий:

<!DOCTYPE html>
<html>
<head>
  <title>WebSocket Chat</title>
</head>
<body>
  <input type="text" id="message" placeholder="Type a message...">
  <button onclick="sendMessage()">Send</button>

  <script>
    const socket = new WebSocket('ws://localhost:8080');

    // Обработка полученных сообщений
    socket.addEventListener('message', (event) => {
      console.log(event.data);
    });

    // Отправка сообщения
    function sendMessage() {
      const message = document.getElementById('message').value;
      socket.send(message);
    }
  </script>
</body>
</html>

Запуск сервера и тестирование:

Запустите сервер, выполнив команду:

node server.js

Откройте HTML-файл в браузере и начните обмен сообщениями.

Вы увидите мгновенную передачу сообщений между клиентами в режиме реального времени в консоли браузера и в терминале.

Откройте файл в двух браузерах, для очевидного тестирования.