Socket.IO — ไลบรารีสำหรับการโต้ตอบแบบเรียลไทม์คืออะไร

Socket.IO คืออะไร?

Socket.IO เป็นไลบรารี JavaScript แบบโอเพนซอร์สสำหรับการสื่อสารสองทางที่ขับเคลื่อนด้วยเหตุการณ์ระหว่างไคลเอ็นต์และเซิร์ฟเวอร์ มันถูกสร้างขึ้นในปี 2010 โดยผู้พัฒนา Guillermo Rauch และตั้งแต่นั้นมาก็กลายเป็นมาตรฐานโดยพฤตินัยสำหรับแอปพลิเคชันแบบเรียลไทม์บน Node.js

แตกต่างจาก WebSocket API ดั้งเดิม Socket.IO มีนามธรรมเพิ่มเติม: ห้อง เนมสเปซ การเชื่อมต่อใหม่อัตโนมัติ และประเภทข้อมูลไบนารี ไลบรารีนี้ไม่ใช่การใช้งาน WebSocket แยกต่างหาก — มันใช้ Engine.IO เป็นเลเยอร์การส่ง ซึ่งเริ่มต้นด้วยการสร้างการเชื่อมต่อ HTTP long-polling จากนั้นลองอัปเกรดเป็น WebSocket

ตาม สถิติ npm (2025) มีการดาวน์โหลดแพ็คเกจ socket.io มากกว่า 12 ล้านชุดต่อสัปดาห์ ทำให้มันเป็นหนึ่งในไลบรารียอดนิยมที่สุดในระบบนิเวศ Node.js Socket.IO รองรับบนทุกแพลตฟอร์มสมัยใหม่: เบราว์เซอร์, iOS, Android, React Native และแอปพลิเคชันเดสก์ท็อป

ประวัติและเวอร์ชัน

Socket.IO เวอร์ชัน 1.0 เปิดตัวในปี 2014 และแนะนำแนวคิดของ เนมสเปซ ซึ่งช่วยให้สามารถมัลติเพล็กซ์หลายช่องทางตรรกะผ่านการเชื่อมต่อ TCP เดียว เวอร์ชัน 2.0 (2017) เพิ่มการรองรับข้อมูลไบนารีและปรับปรุงประสิทธิภาพการแยกวิเคราะห์ เวอร์ชันปัจจุบัน 4.x (2020–2025) รวมถึงการรองรับ TypeScript อย่างสมบูรณ์ โหมดอะแดปเตอร์หลักสำหรับการปรับขนาด และความเข้ากันได้ย้อนหลังที่ดีขึ้น

แต่ละรุ่นหลักรักษา ความเข้ากันได้ย้อนหลังของ API — ไคลเอ็นต์ socket.io@2 สามารถเชื่อมต่อกับเซิร์ฟเวอร์ socket.io@4 ผ่านโหมดความเข้ากันได้พิเศษ นี่เป็นสิ่งสำคัญสำหรับโปรเจกต์ระยะยาวที่การอัปเกรดฝั่งไคลเอ็นต์เกิดขึ้นแบบค่อยเป็นค่อยไป

Socket.IO ทำงานอย่างไร

สถาปัตยกรรม Socket.IO ประกอบด้วยสององค์ประกอบ: โมดูลเซิร์ฟเวอร์ (แพ็คเกจ npm socket.io) และโมดูลไคลเอ็นต์ (แพ็คเกจ npm socket.io-client) เซิร์ฟเวอร์ทำงานบนเซิร์ฟเวอร์ HTTP(S) ของ Node.js และใช้ Engine.IO เพื่อจัดการเลเยอร์การส่ง

ในการเชื่อมต่อครั้งแรก ไคลเอ็นต์จะส่งคำขอ HTTP ไปยังเซิร์ฟเวอร์ Engine.IO ตอบสนองและสร้าง การเชื่อมต่อ long-polling หลังจากนั้น ไคลเอ็นต์จะส่งคำขอเพื่ออัปเกรดโปรโตคอลการส่งเป็น WebSocket หากเซิร์ฟเวอร์รองรับ WebSocket การอัปเกรดจะเกิดขึ้นภายในเซสชัน TCP เดียว หากไม่ การเชื่อมต่อจะยังคงเป็น long-polling และโค้ดแอปพลิเคชันไม่จำเป็นต้องเปลี่ยนแปลง

ตาม การทดสอบประสิทธิภาพ Socket.IO (2024) เมื่อใช้ WebSocket เวลาแฝงอยู่ที่ 2–5 มิลลิวินาทีต่อการส่งข้อความ ในขณะที่ long-polling เพิ่ม 150–300 มิลลิวินาทีเนื่องจากค่าใช้จ่าย HTTP การเลือกวิธีการส่งโปร่งใสสำหรับผู้พัฒนา

โปรโตคอล Engine.IO

Engine.IO เป็นเลเยอร์การส่งระดับต่ำที่สร้าง Socket.IO ขึ้นมา มันจัดการการสร้างการเชื่อมต่อ การเลือกวิธีการส่ง การเต้นของหัวใจ (ping/pong) และการสิ้นสุดการเชื่อมต่อ ประเภทแพ็คเก็ตหลักของ Engine.IO คือ: open (การเริ่มต้น), close (การปิด), ping/pong (การรักษาการเชื่อมต่อ), upgrade (การเปลี่ยนวิธีการส่ง) และ message (ข้อมูล)

Socket.IO สร้างโมเดลที่ขับเคลื่อนด้วยเหตุการณ์ของตนบน Engine.IO — นี่คือสิ่งที่ผู้พัฒนาทำงานด้วย ข้อความ Socket.IO แต่ละข้อความจะถูกห่อหุ้มในแพ็คเก็ต Engine.IO ชนิด message พร้อมตัวระบุที่ไม่ซ้ำกันสำหรับการยืนยันการจัดส่ง

คุณสมบัติหลักของ Socket.IO

Socket.IO มีชุดคุณสมบัติที่ไม่มีใน WebSocket API ดั้งเดิมและทำให้การพัฒนาแอปพลิเคชันแบบเรียลไทม์ง่ายขึ้นอย่างมาก มาดูคุณสมบัติหลักกัน

การเชื่อมต่อใหม่อัตโนมัติ — ไคลเอ็นต์จะคืนค่าการเชื่อมต่อโดยอัตโนมัติเมื่อขาดการเชื่อมต่อด้วยการหน่วงเวลาแบบเอกซ์โพเนนเชียล (100 มิลลิวินาที, 200 มิลลิวินาที, 400 มิลลิวินาที... จนถึงสูงสุด) ตาม เอกสาร Socket.IO (2024) การตั้งค่าการลองใหม่สามารถเข้าถึงได้ผ่านพารามิเตอร์ reconnectionDelay และ reconnectionAttempts ตัวเลือกนี้สำคัญสำหรับแอปพลิเคชันมือถือที่การเชื่อมต่ออาจถูกขัดจังหวะระหว่างการเปลี่ยนเครือข่าย

การรองรับห้อง — เซิร์ฟเวอร์สามารถจัดกลุ่มซ็อกเก็ตเป็นห้องและส่งข้อความเฉพาะผู้เข้าร่วมในห้องที่กำหนดเท่านั้น ห้องไม่ต้องการการสร้างอย่างชัดเจน — ห้องจะถูกสร้างขึ้นเมื่อซ็อกเก็ตแรกเข้าร่วม ห้องถูกใช้งานในระดับกระบวนการและไม่ได้แชร์ระหว่างเซิร์ฟเวอร์ต่างๆ หากไม่มีอะแดปเตอร์พิเศษ

เนมสเปซ — การแยกช่องทางการสื่อสารเชิงตรรกะบนการเชื่อมต่อเดียว ตัวอย่างเช่น เนมสเปซ /chat สำหรับข้อความแชท และ /notifications สำหรับการแจ้งเตือน แต่ละเนมสเปซมีห้อง มิดเดิลแวร์ และตัวจัดการของตัวเอง เนมสเปซถูกมัลติเพล็กซ์ผ่านการเชื่อมต่อ TCP เดียว ซึ่งช่วยประหยัดทรัพยากร

การยืนยันการจัดส่ง — เมื่อส่งข้อความ สามารถส่งฟังก์ชันเรียกกลับที่จะถูกเรียกเมื่อเซิร์ฟเวอร์ยืนยันการรับ สิ่งนี้ใช้งานผ่านตัวระบุที่ไม่ซ้ำกันสำหรับแต่ละแพ็คเก็ต กลไกการยืนยันช่วยให้แน่ใจว่าข้อความที่สำคัญอย่างยิ่ง (เช่น ธุรกรรมการชำระเงิน) ถูกส่งถึงผู้รับ

Socket.IO กับ WebSocket: การเปรียบเทียบ

การเลือกระหว่าง Socket.IO และ WebSocket ดั้งเดิม ขึ้นอยู่กับข้อกำหนดของโปรเจกต์ WebSocket เป็นโปรโตคอลที่ได้มาตรฐาน (RFC 6455) ที่รองรับโดยเบราว์เซอร์สมัยใหม่ทั้งหมด Socket.IO เป็นไลบรารีที่ใช้ WebSocket เป็นวิธีการส่งแต่เพิ่มคุณสมบัติเพิ่มเติม

หากโปรเจกต์ของคุณต้องการ ประสิทธิภาพสูงสุด และขนาดไคลเอ็นต์ที่เล็กที่สุด — เลือก WebSocket ดั้งเดิม หากคุณต้องการการจัดส่งที่เชื่อถือได้ การจัดกลุ่ม และโมเดลที่ขับเคลื่อนด้วยเหตุการณ์ — Socket.IO จะลดเวลาในการพัฒนา 2–3 เท่าด้วยนามธรรมพร้อมใช้

ตาม แบบสำรวจ State of JS 2024 67% ของผู้พัฒนาแอปพลิเคชันแบบเรียลไทม์ชอบ Socket.IO เนื่องจาก API ที่สะดวกและการจัดการในตัวสำหรับกรณีขอบ (การขาดการเชื่อมต่อเครือข่าย การเชื่อมต่อใหม่ ข้อมูลไบนารี)

วิธีเชื่อมต่อ Socket.IO ในโปรเจกต์

การติดตั้ง Socket.IO ต้องใช้สองแพ็คเกจ: ฝั่งเซิร์ฟเวอร์และฝั่งไคลเอ็นต์ มาดูการตั้งค่าพื้นฐานสำหรับโปรเจกต์ Node.js กัน เซิร์ฟเวอร์สร้างเซิร์ฟเวอร์ HTTP เริ่มต้น Socket.IO และจัดการเหตุการณ์การเชื่อมต่อและการตัดการเชื่อมต่อของไคลเอ็นต์

ตาม เอกสาร Socket.IO (2024) เซิร์ฟเวอร์สามารถเริ่มได้โดยไม่ต้องใช้ Express โดยใช้โมดูล http ในตัว แต่ในโปรเจกต์จริงมักใช้ Express หรือ Fastify สำหรับการกำหนดเส้นทางคำขอ HTTP

โค้ดฝั่งเซิร์ฟเวอร์ใน Node.js

const express = require('express');
const http = require('http');
const Server = require('socket.io');

const app = express();
const server = http.createServer(app);
const io = new Server(server, {
    cors: { origin: '*' }
});

io.on('connection', (socket) => {
    console.log('ไคลเอ็นต์เชื่อมต่อ:', socket.id);

    socket.emit('welcome', { message: 'Hello from server' });

    socket.on('disconnect', () => {
        console.log('ไคลเอ็นต์ตัดการเชื่อมต่อ');
    });
});

server.listen(3000, () => {
    console.log('เซิร์ฟเวอร์กำลังทำงานบนพอร์ต 3000');
});

โค้ดฝั่งไคลเอ็นต์ในเบราว์เซอร์

import { io } from 'socket.io-client';

const socket = io('http://localhost:3000', {
    transports: ['websocket', 'polling'],
    reconnectionDelay: 1000
});

socket.on('welcome', (data) => {
    console.log(data.message);
});

socket.emit('chat message', {
    user: 'Alice',
    text: 'Hello everyone!'
});

เหตุการณ์และห้องใน Socket.IO

โมเดลเหตุการณ์ของ Socket.IO ขึ้นอยู่กับเหตุการณ์ที่มีชื่อ เซิร์ฟเวอร์และไคลเอ็นต์ส่งและรับข้อความที่ผูกกับชื่อเหตุการณ์เฉพาะ เพย์โหลดสามารถเป็นสตริง อ็อบเจกต์ JSON หรือข้อมูลไบนารี (Buffer, ArrayBuffer, Blob)

แต่ละเหตุการณ์รองรับ ACK (การยืนยัน) — การส่งฟังก์ชันเรียกกลับที่ทำงานบนฝั่งผู้ส่งหลังจากเหตุการณ์ถูกประมวลผลโดยผู้รับ สิ่งนี้ช่วยให้ใช้รูปแบบคำขอ-ตอบกลับบนโมเดลเหตุการณ์ ACK ทำงานก็ต่อเมื่อผู้รับเรียกการเรียกกลับอย่างชัดเจน

ตาม เอกสาร Socket.IO (2024) ขนาดสูงสุดของข้อความเดียวไม่ควรเกิน 1 MB เพื่อประสิทธิภาพสูงสุด ข้อความที่ใหญ่กว่าควรแบ่งเป็นส่วนๆ หรือส่งผ่านช่องทางแยก

การทำงานกับห้อง

io.on('connection', (socket) => {
    socket.join('room-1');

    socket.to('room-1').emit('user joined', {
        userId: socket.id
    });

    io.to('room-1').emit('message', {
        text: 'Broadcast to room'
    });

    socket.leave('room-1');
});

การปรับขนาด Socket.IO

การปรับขนาดแนวนอน ของ Socket.IO ต้องแก้ปัญหาการแชร์สถานะระหว่างกระบวนการเซิร์ฟเวอร์หลายตัว ห้อง เนมสเปซ และรายการซ็อกเก็ตที่เชื่อมต่อถูกเก็บในหน่วยความจำของกระบวนการเดียวและไม่ปรากฏแก่กระบวนการอื่นหากไม่มีอะแดปเตอร์

อะแดปเตอร์ทางการของ Socket.IO: redis (ผ่าน Redis Pub/Sub), mongodb (ผ่าน MongoDB change streams), cluster (สำหรับโหมดหลายกระบวนการของ Node.js cluster) อะแดปเตอร์ทำหน้าที่เป็นนายหน้าข้อความระหว่างอินสแตนซ์ Socket.IO เมื่อส่งเหตุการณ์ไปยังห้อง อะแดปเตอร์จะเผยแพร่ไปยัง Redis และเซิร์ฟเวอร์ทั้งหมดได้รับการแจ้งเตือน

ตาม การทดสอบโหลด Socket.IO (2024) คลัสเตอร์ของ 4 เซิร์ฟเวอร์กับอะแดปเตอร์ Redis จัดการการเชื่อมต่อพร้อมกันสูงถึง 400,000 รายการโดยมีเวลาแฝงน้อยกว่า 10 มิลลิวินาที หากไม่มีอะแดปเตอร์ ความจุสูงสุดของกระบวนการ Node.js เดียวคือประมาณ 100,000 การเชื่อมต่อกับหน่วยความจำ 1 GB

การกำหนดค่าอะแดปเตอร์ Redis

const Server = require('socket.io');
const RedisAdapter = require('@socket.io/redis-adapter');
const Redis = require('ioredis');

const pubClient = new Redis({ host: 'localhost', port: 6379 });
const subClient = pubClient.duplicate();
const io = new Server(server);
io.adapter(RedisAdapter(pubClient, subClient));

เมื่อใช้ Kubernetes หรือ Docker Swarm แนะนำให้กำหนดค่าเซสชัน affinity (sticky sessions) เพิ่มเติม เพื่อให้คำขอจากไคลเอ็นต์เดียวกันไปยังเซิร์ฟเวอร์เดียวกัน มิฉะนั้นการกำหนดอาจเปลี่ยนแปลงทุกครั้งที่มีการเชื่อมต่อใหม่