Broadcast คืออะไร?
Broadcast คือการส่งข้อมูลจากเซิร์ฟเวอร์ไปยังไคลเอนต์หลายๆ ตัวพร้อมกัน โดยที่เราไม่ต้องส่งข้อมูลให้แต่ละไคลเอนต์แยกกัน ในกรณีของ Socket.IO การ broadcast หมายถึงการส่งข้อความจากเซิร์ฟเวอร์ไปยังทุกๆ ไคลเอนต์ที่เชื่อมต่อกับเซิร์ฟเวอร์ ในบางกรณี อาจจะยกเว้นไคลเอนต์ที่ส่งข้อความนั้นเอง
การใช้ Broadcast ใน Socket.IO
การส่งข้อมูลไปยังหลายไคลเอนต์สามารถทำได้โดยการใช้ฟังก์ชัน emit() โดยกำหนดพารามิเตอร์ broadcast=True ซึ่งหมายความว่า ข้อความนั้นจะถูกส่งไปยังทุกไคลเอนต์ที่เชื่อมต่ออยู่ในเซิร์ฟเวอร์
ตัวอย่างโค้ด
Server: Python + Flask-SocketIO
โค้ด: เลือกทั้งหมด
from flask import Flask
from flask_socketio import SocketIO, emit
app = Flask(__name__)
socketio = SocketIO(app)
@socketio.on('connect')
def handle_connect():
print("Client connected")
emit('response', {'message': 'Welcome!'}, broadcast=False)
@socketio.on('message')
def handle_message(data):
print(f"Received message: {data}")
emit('response', {'message': f"Broadcast message: {data}"}, broadcast=True)
@socketio.on('disconnect')
def handle_disconnect():
print("Client disconnected")
if __name__ == '__main__':
socketio.run(app, debug=True)
- เมื่อมีการเชื่อมต่อเข้ามาที่เซิร์ฟเวอร์ เซิร์ฟเวอร์จะส่งข้อความไปยังไคลเอนต์นั้นๆ ด้วย broadcast=False ซึ่งหมายความว่า ข้อความนี้จะถูกส่งแค่ไปยังไคลเอนต์ที่เชื่อมต่อเท่านั้น
- เมื่อไคลเอนต์ส่งข้อความไปยังเซิร์ฟเวอร์, เซิร์ฟเวอร์จะส่งข้อความนั้นไปยังทุกไคลเอนต์ที่เชื่อมต่ออยู่ (รวมถึงไคลเอนต์ที่ส่งข้อความ) ด้วย broadcast=True
โค้ด: เลือกทั้งหมด
<!DOCTYPE html>
<html>
<head>
<title>Broadcast Example</title>
<script src="https://cdn.socket.io/4.0.0/socket.io.min.js"></script>
</head>
<body>
<h1>Broadcast Example</h1>
<button id="sendMessage">Send Message</button>
<div id="response"></div>
<script>
const socket = io.connect();
socket.on('connect', function() {
console.log('Connected to the server');
});
socket.on('response', function(data) {
document.getElementById('response').innerText = data.message;
});
document.getElementById('sendMessage').onclick = function() {
const message = 'Hello Server!';
console.log('Sending message:', message);
document.getElementById('response').innerText = message
socket.send(message);
};
</script>
</body>
</html>
- ไคลเอนต์จะทำการเชื่อมต่อกับเซิร์ฟเวอร์ และเมื่อไคลเอนต์กดปุ่ม "Send Message" ข้อความที่ส่งจะถูกส่งไปยังเซิร์ฟเวอร์ และเซิร์ฟเวอร์จะทำการ broadcast ข้อความนั้นไปยังไคลเอนต์ทุกตัวที่เชื่อมต่อ
ตัวอย่างหลังจากกด Send Message จะแสดงข้อความ Hello Server! ดังภาพ- Broadcast.png (14.87 KiB) Viewed 65 times
- แอปแชท
- ทุกครั้งที่ผู้ใช้ส่งข้อความใหม่ เซิร์ฟเวอร์สามารถ broadcast ข้อความนั้นไปยังทุกๆ ผู้ใช้อื่นๆ ในห้องแชทเดียวกัน
- เกมออนไลน์
- เซิร์ฟเวอร์สามารถส่งข้อมูลการอัปเดตของเกมไปยังผู้เล่นทุกคนที่เชื่อมต่ออยู่ เช่น คะแนนเกม, สถานะของตัวละคร, หรือการเคลื่อนไหวของผู้เล่น
- การติดตามสถานะ
- ใช้ในแอปที่ต้องการส่งสถานะหรือข้อมูลใหม่ๆ ไปยังผู้ใช้งานทุกคนในเวลาเดียวกัน เช่น การแสดงผลตลาดหุ้น, การแจ้งเตือนจากระบบ
broadcast=True: ส่งข้อความไปยังทุกไคลเอนต์ที่เชื่อมต่อ (ยกเว้นไคลเอนต์ที่ส่งข้อความ)
broadcast=False: ส่งข้อความไปยังไคลเอนต์ที่เรียกคำสั่งนั้นเท่านั้น (ไม่ส่งไปยังไคลเอนต์อื่นๆ)
ข้อดีของ Broadcast
- การอัปเดตแบบ real-time ช่วยให้ทุกไคลเอนต์ที่เชื่อมต่อได้รับข้อมูลหรืออัปเดตในเวลาเดียวกัน
- ประหยัดทรัพยากร ไม่จำเป็นต้องส่งข้อมูลให้แต่ละไคลเอนต์แยกกัน ช่วยลดภาระและเวลาในการส่งข้อมูล
- ใช้ในหลายแอปพลิเคชัน เช่น ระบบแชท, ระบบติดตามการกระทำของผู้ใช้ หรือการแสดงผลสถานะต่างๆ ในเวลาเดียวกัน
- การใช้ Bandwidth: ถ้ามีจำนวนไคลเอนต์ที่เชื่อมต่อจำนวนมาก การใช้ broadcast อาจจะส่งผลต่อการใช้แบนด์วิดท์และความเร็วของแอปพลิเคชัน
- การจัดการห้อง (Rooms): การใช้ broadcast บนห้องที่มีหลายๆ คนอาจจะทำให้ข้อมูลที่ไม่จำเป็นส่งไปยังไคลเอนต์อื่นๆที่ไม่เกี่ยวข้อง ซึ่งในกรณีนี้การใช้ Room ใน Socket.IO จะเหมาะสมกว่า
การใช้ broadcast ใน Socket.IO เป็นเครื่องมือที่มีประสิทธิภาพในการส่งข้อมูลไปยังหลายไคลเอนต์พร้อมกันในระบบ real-time โดยไม่ต้องเปิดการเชื่อมต่อใหม่ซ้ำซ้อน ช่วยให้แอปพลิเคชันที่ต้องการการสื่อสารแบบทันทีทันใดมีประสิทธิภาพสูงขึ้น เช่น การใช้ในเกมออนไลน์, การทำงานร่วมกันในแอปพลิเคชัน, การใช้ในแอปแชท และการแจ้งเตือนแบบเรียลไทม์ เป็นต้น
อ้างอิง
viewtopic.php?t=92353
https://computer2know.blogspot.com/2018/01/nodejs-tips-socketio-emit-broadcast.html
https://hyperpad.zendesk.com//hc/th/articles/360031646791-การตั-งค-าเกมผู-เล-นหลายคนด-วย-Socket-io