สร้าง Pretty URL สำหรับเว็บไซต์ บน Nginx
06 ก.ค. 2025
ในโลกที่ทุกอย่างเคลื่อนไหวอย่างรวดเร็ว ระบบสื่อสารแบบ Realtime กลายเป็นหัวใจสำคัญของแอปพลิเคชันยุคใหม่ ไม่ว่าจะเป็นการแชท, แจ้งเตือนทันที, การแสดงข้อมูลสด เช่นราคาหุ้น หรือระบบติดตามสถานะต่าง ๆ เทคโนโลยีที่ทำให้สิ่งเหล่านี้เป็นไปได้ คือ Socket.IO
Socket.IO คือไลบรารี JavaScript แบบ Realtime bidirectional event-based communication ที่ทำงานบนพื้นฐานของ WebSocket โดยสามารถทำงานได้ทั้งฝั่ง Client (Frontend) และ Server (Backend)
Socket.IO ทำให้ Client และ Server สื่อสารกันได้แบบสองทาง (duplex communication) ตลอดเวลา ไม่ต้อง Refresh หน้าเว็บ ไม่ต้องดึงข้อมูลซ้ำๆ
npm install socket.io
ติดตั้งฝั่ง Client:
<script src="/socket.io/socket.io.js"></script>
โค้ดตัวอย่าง (Node.js + Express):
const app = require('express')();
const server = require('http').createServer(app);
const io = require('socket.io')(server);
io.on('connection', (socket) => {
console.log('ผู้ใช้ใหม่เชื่อมต่อแล้ว');
socket.on('send_message', (msg) => {
io.emit('receive_message', msg); // ส่งถึงทุกคน
});
});
server.listen(3000, () => {
console.log('Server เริ่มต้นที่พอร์ต 3000');
});
ฝั่ง Client:
<script>
const socket = io();
socket.on('receive_message', (msg) => {
console.log('ข้อความที่ได้รับ:', msg);
});
socket.emit('send_message', 'สวัสดีทุกคน!');
</script>
⚙️ WebSocket กับ Socket.IO ต่างกันอย่างไร?
หัวข้อ | WebSocket | Socket.IO |
---|---|---|
Protocol | Native WebSocket Protocol | Custom protocol บน WebSocket หรือ HTTP Long Polling |
ฟีเจอร์เสริม | ไม่มีในตัว | Reconnection, Room, Namespace, Middleware |
ความง่ายในการใช้งาน | ยากกว่า | ง่ายและมีฟีเจอร์พร้อมใช้งาน |
รองรับ Fallback | ไม่รองรับ | รองรับ fallback เช่น polling หาก browser ไม่รองรับ WebSocket |