minstudio

실시간 통신 (Socket.io)

기존 HTTP 통신은 클라이언트가 "요청"해야만 서버가 "응답"하고 전화가 끊어지는 단방향 구조입니다. 웹소켓(Socket.io)은 서버와 클라이언트가 계속 통화 상태를 유지하며, 서버가 원할 때 언제든 클라이언트에게 카톡 알림이나 주식 호가처럼 데이터를 실시간으로 밀어 넣어줄 수 있는 강력한 기술입니다.

전통적인 HTTP

클라이언트 ➡ (요청) ➡ 서버

클라이언트 ⬅ (응답) ⬅ 서버

(연결 끊어짐 ✂️)

웹소켓 (Socket.io)

클라이언트 ↔ (터널 연결 지속) ↔ 서버

(언제든 양방향 전송 🚀)

const http = require("http");
const { Server } = require("socket.io");

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

// 누군가 웹소켓으로 접속했을 때
io.on("connection", (socket) => {
    console.log("유저가 접속했습니다:", socket.id);
    
    // 특정 유저가 "채팅" 이벤트를 보냄
    socket.on("chat message", (msg) => {
        // 접속한 "모든" 유저에게 메시지 뿌리기! (방송)
        io.emit("chat message", msg);
    });
});

server.listen(3000);
실행 결과
실시간 통신 (Socket.io) | Minstudio