Blog

Kết hợp Node.js và Công nghệ WebSockets cho Ứng dụng Web tiếp theo của bạn

Node.js WebSocket là một cặp đôi phổ biến trong ngành web, được biết đến là hữu ích cho kết nối thời gian thực. Chúng hỗ trợ nhiều ứng dụng phổ biến ngày nay, như phòng chat trực tiếp và phát trực tuyến, mang đến cho mọi người hình thức giao tiếp trực tiếp!

Minh Triết

Minh Triết

5 tháng 6 2025

Kết hợp Node.js và Công nghệ WebSockets cho Ứng dụng Web tiếp theo của bạn

Node.js Websockets, khi kết hợp lại, là sự kết hợp của hai công nghệ phổ biến mà các nhà phát triển web có thể sử dụng để xây dựng ứng dụng web thời gian thực.

💡
Apidog là một công cụ phát triển API tập trung vào việc tạo ra API nhanh hơn trong khi cung cấp yếu tố hợp tác cho các nhóm phát triển API. Với Apidog, bạn có thể mong đợi các chức năng đặc tả và sửa đổi cho toàn bộ vòng đời API.

Ngoài ra, nếu bạn cần một nền tảng API có thể xử lý việc nhập khẩu tệp dưới nhiều hình thức khác nhau, hãy cân nhắc tải xuống Apidog! 👇 👇 👇
button

Rất quan trọng để hiểu rằng "Node.js WebSockets" đề cập đến hai công nghệ khác nhau được sử dụng phối hợp để tạo ra các ứng dụng web thời gian thực. Chúng không nên được coi là một thực thể duy nhất. Không cần phải dài dòng, hãy hiểu trước tiên Node.js và WebSockets là gì về bản chất.

Node.js là gì?

Node.js là một môi trường chạy JavaScript mã nguồn mở, đa nền tảng cho phép người dùng chạy mã JavaScript bên ngoài trình duyệt web. Do đó, Node.js không giới hạn các ứng dụng phần mềm và hệ thống khác nhau có thể sử dụng mã hóa JavaScript!

nodejs website ai tool javascript
Nhấp vào hình ảnh nếu bạn quan tâm đến việc thử Node.js!

Các tính năng chính khiến Node.js hấp dẫn các nhà phát triển

Khi nào bạn nên cân nhắc sử dụng Node.js cho các dự án của mình

Node.js chủ yếu được biết đến để xây dựng phần mềm ngoài các trang web truyền thống. Do đó, bạn có thể xem xét mạnh mẽ việc sử dụng Node.js trong một phần của phần mềm của mình nếu bạn có kế hoạch có những trường hợp sử dụng như vậy:

Lợi ích của việc sử dụng Node.js như một phần của phần mềm của bạn

WebSockets là gì?

WebSockets là một giao thức truyền thông cho phép giao tiếp thời gian thực, hai chiều giữa một khách hàng (như một trình duyệt web) và một máy chủ. Chúng cũng cho phép cả khách hàng và máy chủ gửi và nhận tin nhắn đồng thời, cho phép một trải nghiệm tương tác và phản hồi hơn cho phần mềm.

Xin lưu ý rằng WebSockets là một giao thức, có nghĩa là chúng không thuộc về bất kỳ loại tệp nào. Tuy nhiên, bạn vẫn phải chú ý đến bảo mật WebSocket!

Các tính năng chính phân biệt WebSockets với các giao thức khác

Các lợi ích tiềm năng bạn có thể nhận được từ việc sử dụng WebSockets

Cách kết hợp Node.js và WebSockets để tạo các ứng dụng web?

Dưới đây là hướng dẫn từng bước về cách xây dựng các ứng dụng web thời gian thực với Node.js và WebSockets!

  1. Chọn một thư viện:

Có một vài thư viện phổ biến mà bạn có thể chọn để giúp bạn triển khai WebSockets trong Node.js:

2. Thiết lập máy chủ Node.js của bạn:

Tạo một máy chủ Node.js sử dụng các mô-đun như http hoặc express. Máy chủ này sẽ lắng nghe các kết nối đến và xử lý định tuyến và các logic phía máy chủ khác.

3. Triển khai WebSocket:

Trong bước này, bạn cũng nên định nghĩa các trình xử lý sự kiện cho các kịch bản khác nhau:

4. Tích hợp phía khách hàng:

Ở phía khách hàng (thường là trong một trình duyệt web), bạn có thể sử dụng các thư viện JavaScript như ws hoặc socket.io-client để kết nối đến máy chủ WebSocket của bạn.

Mẫu mã của Node.js và WebSockets (Ví dụ về ứng dụng chat cơ bản)

Hầu hết các ứng dụng web mà bạn có thể tìm thấy ngày nay đều có các phần front-end và back-end tương ứng. Dưới đây là các mẫu của cả công nghệ Node.js và WebSockets hoạt động cùng nhau trong một mẫu ứng dụng chat đơn giản.

Máy chủ phía (Back-end) Mã [Node.js]

const WebSocket = require('ws');

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

wss.on('connection', (ws) => {
  console.log('Khách hàng đã kết nối');

  ws.on('message', (message) => {
    console.log(`Tin nhắn từ khách hàng: ${message}`);
    wss.clients.forEach((client) => {
      if (client.readyState === WebSocket.OPEN) {
        client.send(message);
      }
    });
  });

  ws.on('close', () => {
    console.log('Khách hàng đã ngắt kết nối');
  });
});

console.log('Máy chủ WebSocket đang lắng nghe trên cổng 8080');

Giải thích mã:

Mã phía khách hàng (Front-end) [Javascript]

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>WebSocket Chat</title>
</head>
<body>
  <input type="text" id="message" placeholder="Nhập tin nhắn của bạn..." />
  <button id="send">Gửi</button>
  <div id="messages"></div>

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

    ws.onopen = () => {
      console.log('Kết nối tới máy chủ');
    };

    ws.onmessage = (event) => {
      const message = event.data;
      console.log(`Nhận tin nhắn: ${message}`);
      const messagesDiv = document.getElementById('messages');
      messagesDiv.innerHTML += `<p>${message}</p>`;
    };

    const sendButton = document.getElementById('send');
    sendButton.addEventListener('click', () => {
      const messageInput = document.getElementById('message');
      const message = messageInput.value;
      ws.send(message);
      messageInput.value = '';
    });
  </script>
</body>
</html>

Giải thích mã:

Xây dựng APIs với Node.js và WebSockets (Được hiển thị bằng các đoạn mã)

Bạn cũng có thể tạo ra các API riêng của mình để sử dụng trong ứng dụng web mà bạn đã tạo gần đây! (Xin lưu ý rằng mã code được cung cấp trong bài viết này chỉ dành cho mục đích minh họa.)

1. Thiết lập môi trường Node.js:

2. Cài đặt các thư viện cần thiết:

Bạn sẽ cần cài đặt thư viện ws cho WebSockets bằng cách chạy dòng mã này: npm install ws. Bạn cũng sẽ phải cài đặt một framework web để định tuyến và xử lý yêu cầu HTTP, chẳng hạn như sử dụng Express qua dòng mã này: npm install express.

3. Tạo máy chủ WebSocket (JavaScript):

const WebSocket = require('ws');
const express = require('express'); // Nếu sử dụng Express

const app = express(); // Nếu sử dụng Express
const wss = new WebSocket.Server({ port: 8080 });

// Xử lý yêu cầu HTTP (nếu sử dụng Express)
app.get('/', (req, res) => {
  res.send('Xin chào, thế giới!');
});

// Xử lý kết nối WebSocket
wss.on('connection', (ws) => {
  console.log('Khách hàng đã kết nối');

  ws.on('message', (message) => {
    console.log(`Tin nhắn nhận được: ${message}`);
    // Xử lý tin nhắn và có thể gửi phản hồi
  });

  ws.on('close', () => {
    console.log('Khách hàng đã ngắt kết nối');
  });
});

// Bắt đầu máy chủ
app.listen(8080, () => {
  console.log('Máy chủ đang lắng nghe trên cổng 8080');
});

Sau bước này, bạn có thể truy cập máy chủ WebSocket qua URL WebSocket, như ws://localhost:8080.

4. Định nghĩa các điểm cuối API (JavaScript):

ws.on('message', (message) => {
  const data = JSON.parse(message);
  const action = data.action;

  if (action === 'getData') {
    ws.send(JSON.stringify({ data: 'Một số dữ liệu' }));
  } else if (action === 'sendMessage') {
    // Xử lý logic gửi tin nhắn
  }
});

5. Tạo tương tác phía khách hàng (JavaScript):

const ws = new WebSocket('ws://localhost:8080');

ws.onopen = () => {
  console.log('Kết nối tới máy chủ');
  ws.send(JSON.stringify({ action: 'getData' }));
};

ws.onmessage = (event) => {
  const response = JSON.parse(event.data);
  console.log(response);
};

Apidog - Nền tảng thử nghiệm API lý tưởng

Một khi bạn đã tạo ứng dụng web Node.js WebSocket của mình, bạn sẽ cần thử nghiệm nó để đảm bảo rằng nó hoạt động như mong muốn.

Apidog là giải pháp tất cả trong một hoàn hảo cho tất cả các vấn đề API của bạn. Bạn không chỉ có thể thử nghiệm các điểm cuối duy nhất của một API, mà bạn còn có thể tạo một kịch bản thử nghiệm nhiều bước để đảm bảo rằng API của bạn sẵn sàng cho việc công bố!

apidog api design first development platform
Apidog - Nền tảng phát triển thiết kế đầu tiên

Khi bạn đã có máy chủ WebSocket của mình hoạt động trên URL (như bài viết này sử dụng URL ws://localhost:8080), chúng ta có thể bắt đầu tạo một yêu cầu WebSocket!

Tạo một yêu cầu WebSocket sử dụng Apidog

create new api request apidog
Tạo một yêu cầu WebSocket mới bằng cách sử dụng Apidog

Đầu tiên, hãy tạo một yêu cầu API mới chỉ để thử nghiệm API hoặc ứng dụng WebSocket Node.js của bạn. Bạn cũng có thể sử dụng phím tắt Ctrl + T để ngay lập tức tạo một yêu cầu mới.

insert details api request apidog
Điền vào thông tin chi tiết của Yêu cầu WebSocket Mới của bạn

Bạn sẽ thấy một yêu cầu trống, không có tên. Tại đây, bạn có thể tạo một URL API cụ thể, đặt phương thức HTTP mong muốn, và bao gồm các tham số truy vấn mà bạn dự định thử nghiệm API hoặc ứng dụng WebSocket Node.js của mình với.

Kết luận

Sự kết hợp của các công nghệ Node.js và WebSocket có thể cho phép các nhà phát triển tạo ra các ứng dụng thú vị và hữu ích. Chúng đặc biệt mạnh mẽ trong việc cho phép các chức năng như phòng chat thời gian thực và phát trực tiếp!

Apidog cũng có thể đáp ứng việc tạo ra và sửa đổi các yêu cầu WebSocket bất cứ khi nào cần thiết. Ngoài các yêu cầu, người dùng cũng có thể xây dựng, thử nghiệm, gỡ lỗi, và mô phỏng các API với Apidog.

Thực hành thiết kế API trong Apidog

Khám phá cách dễ dàng hơn để xây dựng và sử dụng API

Đăng ký miễn phíTải xuống