Room ใน Socket.IO
- Room คือคอนเซปต์ของการจัดกลุ่มไคลเอนต์ที่เชื่อมต่ออยู่ในเซิร์ฟเวอร์ ซึ่งสามารถส่งข้อมูลไปยังไคลเอนต์ในห้องนั้นได้โดยเฉพาะ
- แต่ละไคลเอนต์สามารถเข้าร่วมหลายห้องได้ และแต่ละห้องจะมีชื่อเฉพาะที่ใช้ระบุกลุ่มนั้น
การใช้งาน Room ใน Socket.IO สามารถทำได้ง่ายๆ โดยใช้ฟังก์ชัน join() เพื่อให้ไคลเอนต์เข้าร่วมห้อง และฟังก์ชัน to() หรือ in() เพื่อส่งข้อมูลไปยังห้องนั้นๆ
ตัวอย่างโค้ดการใช้ Room
Server: Python + Flask-SocketIO
โค้ด: เลือกทั้งหมด
from flask import Flask, render_template
from flask_socketio import SocketIO, emit, join_room
app = Flask(__name__)
socketio = SocketIO(app)
@app.route('/')
def index():
return render_template('chat.html')
@socketio.on('connect')
def handle_connect():
print("Client connected")
@socketio.on('join')
def on_join(data):
room = data['room']
join_room(room)
emit('response', {'message': f'Joined room {room}'}, room=room)
@socketio.on('send_message')
def handle_message(data):
room = data['room']
message = data['message']
emit('response', {'message': message}, room=room)
@socketio.on('disconnect')
def handle_disconnect():
print("Client disconnected")
if __name__ == '__main__':
socketio.run(app, debug=True)
- เมื่อไคลเอนต์เชื่อมต่อเข้ามา, เซิร์ฟเวอร์จะรับคำขอให้เข้าร่วมห้อง (โดยใช้ฟังก์ชัน join_room(room))
- หลังจากนั้น, ไคลเอนต์จะได้รับข้อความตอบกลับจากเซิร์ฟเวอร์ว่าเข้าร่วมห้องแล้ว
- เมื่อได้รับข้อความจากไคลเอนต์ (ที่ระบุห้องและข้อความ), เซิร์ฟเวอร์จะส่งข้อความนั้นไปยังห้องที่ระบุ (โดยใช้ฟังก์ชัน emit() และพารามิเตอร์ room=room)
โค้ด: เลือกทั้งหมด
<!DOCTYPE html>
<html>
<head>
<title>Room Example</title>
<script src="https://cdn.socket.io/4.0.0/socket.io.min.js"></script>
</head>
<body>
<h1>Room Example</h1>
<button id="joinRoom">Join Room A</button>
<button id="sendMessage">Send Message to Room A</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('joinRoom').onclick = function() {
socket.emit('join', { room: 'Room A' });
};
document.getElementById('sendMessage').onclick = function() {
const message = 'Hello Room A!';
socket.emit('send_message', { room: 'Room A', message: message });
};
</script>
</body>
</html>
- เมื่อกดปุ่ม "Join Room A" ไคลเอนต์จะส่งคำขอให้เข้าร่วมห้อง "Room A"
- เมื่อกดปุ่ม "Send Message to Room A", ข้อความจะถูกส่งไปยังห้อง "Room A" และทุกไคลเอนต์ที่เข้าร่วมห้องนั้นจะได้รับข้อความ
ตัวอย่างหน้าจอ หลังจากกกดปุ่ม Send Message to Room A
- การเข้าร่วมห้อง (Join Room)
- เมื่อไคลเอนต์ต้องการเข้าร่วมห้องเฉพาะ, เซิร์ฟเวอร์จะใช้คำสั่ง join_room(room) เพื่อให้ไคลเอนต์เข้าร่วมห้องที่ต้องการ
- ไคลเอนต์สามารถเข้าร่วมหลายๆ ห้องได้
- การส่งข้อความไปยังห้อง (Emit to Room)
- เมื่อไคลเอนต์ส่งข้อความไปยังเซิร์ฟเวอร์พร้อมกับข้อมูลห้อง, เซิร์ฟเวอร์จะใช้คำสั่ง emit() โดยกำหนด room=room เพื่อส่งข้อความไปยังห้องที่ไคลเอนต์เข้าร่วมอยู่
- การออกจากห้อง (Leave Room)
- การออกจากห้องทำได้โดยใช้ leave_room(room) ซึ่งจะยกเลิกการเชื่อมต่อกับห้องที่ระบุ
- แยกกลุ่มไคลเอนต์
- ช่วยให้สามารถแยกกลุ่มไคลเอนต์ที่เชื่อมต่อออกเป็นกลุ่มๆ เพื่อการสื่อสารที่มีประสิทธิภาพมากขึ้น เช่น แชทในห้องต่างๆ หรือการจัดกลุ่มผู้เล่นในเกม
- การส่งข้อมูลเฉพาะกลุ่ม
- สามารถส่งข้อมูลไปยังกลุ่มไคลเอนต์ที่เกี่ยวข้องได้ โดยไม่ต้องส่งไปยังทุกไคลเอนต์ในเซิร์ฟเวอร์
- ง่ายต่อการจัดการ
- การใช้ห้องช่วยให้การจัดการไคลเอนต์ที่เชื่อมต่ออยู่มีความสะดวกสบายมากขึ้น เช่น การส่งข้อความไปยังกลุ่มผู้ใช้ที่เกี่ยวข้อง
อ้างอิง
viewtopic.php?f=144&t=91128
https://medium.com/@themaxaboy/@themaxaboy/สร้างระบบ-live-chat-ผ่าน-socket-io-พร้อมเก็บข้อความย้อนหลัง-ด้วย-strapi-headless-cms-efbc83daab15
https://kittisak-tos.medium.com/node-js-express-js-with-socket-io-b5cd5d904f8e