Hiểu về WebSocket: Giao tiếp thời gian thực trở nên dễ dàng
Hãy tưởng tượng bạn đang ở một nhà hàng và gọi món. Trong một thiết lập truyền thống [như HTTP Request], bạn gọi người phục vụ đến, gọi món và sau đó đợi. Nếu bạn muốn cập nhật về món ăn của mình, bạn phải liên tục vẫy tay chào họ và hỏi, "Món ăn của tôi đã sẵn sàng chưa?"
Bây giờ, hãy tưởng tượng một cách tiếp cận khác — khi bạn gọi món, người phục vụ đưa cho bạn một máy nhắn tin nhỏ. Thay vì bạn phải hỏi nhiều lần, máy nhắn tin sẽ reo ngay khi đồ ăn của bạn đã sẵn sàng. Đây là cách WebSocket hoạt động — khi kết nối được thiết lập, máy chủ có thể đẩy các bản cập nhật đến máy khách theo thời gian thực, mà không cần máy khách phải kiểm tra lại liên tục.
WebSocket là gì?
WebSocket là một giao thức truyền thông song công toàn phần cho phép trao đổi dữ liệu thời gian thực giữa máy khách [ví dụ: trình duyệt] và máy chủ qua kết nối liên tục. Không giống như HTTP truyền thống, trong đó máy khách phải yêu cầu cập nhật, WebSocket cho phép máy chủ đẩy các bản cập nhật ngay lập tức khi có dữ liệu mới.
Các trường hợp sử dụng thực tế
Ứng dụng trò chuyện: Các nền tảng nhắn tin tức thời dựa vào WebSocket để gửi tin nhắn theo thời gian thực. [ví dụ: WhatsApp, Slack, Messenger] Thông báo trực tiếp: Các cập nhật như giá cổ phiếu, tỷ số thể thao hoặc tin tức nóng hổi tận dụng WebSocket để có cảnh báo tức thì. Trò chơi nhiều người chơi: Tương tác thời gian thực giữa những người chơi phụ thuộc vào khả năng giao tiếp có độ trễ thấp của WebSocket. Công cụ cộng tác: Các công cụ như tài liệu chia sẻ hoặc bảng trắng sử dụng WebSocket để đồng bộ hóa các thay đổi ngay lập tức giữa những người dùng. [ví dụ: Google Docs, whiteboards, trình chỉnh sửa mã trực tiếp]
Thiết lập WebSocket trong Node.js
Hãy cùng triển khai máy chủ WebSocket cơ bản bằng Node.js với gói ws
này.
Bước 1: Cài đặt các phụ thuộc
Để bắt đầu, hãy cài đặt thư viện ws
cung cấp hỗ trợ WebSocket trong Node.js.
npm install ws
Bước 2: Tạo máy chủ WebSocket
Máy chủ WebSocket đơn giản này lắng nghe các kết nối và tin nhắn đến:
const WebSocket = require('ws');
// Create a WebSocket server on port 8080
const wss = new WebSocket.Server({ port: 8080 });
wss.on('connection', (ws) => {
console.log('New client connected');
// Send a welcome message when a client connects
ws.send(JSON.stringify({ message: 'Welcome to WebSocket Server!' }));
// Listen for messages from the client
ws.on('message', (message) => {
console.log(`Received: ${message}`);
// Broadcast message to all connected clients
wss.clients.forEach(client => {
if (client.readyState === WebSocket.OPEN) {
client.send(`Echo: ${message}`);
}
});
});
// Handle client disconnection
ws.on('close', () => {
console.log('Client disconnected');
});
});
console.log('WebSocket server is running on ws://localhost:8080');
Máy chủ WebSocket đơn giản này:
- chấp nhận kết nối khách hàng mới
- gửi tin nhắn chào mừng đến từng khách hàng
- lắng nghe các thông điệp từ khách hàng và phản hồi lại
- phát tin nhắn đến tất cả các máy khách được kết nối
Tạo WebSocket Client (Trình duyệt)
Để kết nối với máy chủ WebSocket từ một trang web, bạn có thể sử dụng API tích hợp WebSockettrong JavaScript:
const socket = new WebSocket('ws://localhost:8080');
// Listen for messages from the server
socket.onmessage = (event) => {
console.log('Server says:', event.data);
};
// Send a message to the server
socket.onopen = () => {
console.log('Connected to WebSocket server');
socket.send('Hello, WebSocket Server!');
};
// Handle connection close
socket.onclose = () => {
console.log('Disconnected from WebSocket server');
};
Nâng cao WebSocket Server: Thông báo thời gian thực
Hãy sửa đổi máy chủ để gửi các bản cập nhật theo thời gian thực định kỳ [ví dụ: cập nhật giá cổ phiếu].
setInterval(() => {
const stockPrice = (Math.random() * 100).toFixed(2); // Generate a random stock price
wss.clients.forEach(client => {
if (client.readyState === WebSocket.OPEN) {
client.send(JSON.stringify({ stock: `AAPL: $${stockPrice}` }));
}
});
}, 5000); // Send updates every 5 seconds
Hiện nay, tất cả khách hàng được kết nối đều nhận được thông tin cập nhật giá cổ phiếu theo thời gian thực sau mỗi 5 giây.
Kết luận
Cho dù bạn đang phát triển ứng dụng trò chuyện, thông báo trực tiếp, trò chơi nhiều người chơi hay công cụ cộng tác, WebSocket cho phép trải nghiệm người dùng liền mạch, hiệu quả và tương tác. Bằng cách giảm độ trễ và tối ưu hóa việc sử dụng tài nguyên, nó cung cấp năng lượng cho các ứng dụng hiện đại đòi hỏi sự tương tác theo thời gian thực.
All rights reserved