[nodejs] socket.io

실시간으로 사용자들끼리 채팅을 주고받기 위한 기능으로 간단하고, 많이 쓰이는 라이브러리 socket.io

 

설치

npm i socket.io

 

import express from "express";
import SocketIO from "socket.io"
import http from "http";

const app = express();

app.set("view engine", "pug");
app.set("views", __dirname + "/views");
app.use('/public', express.static(__dirname + "/public"))
app.get("/", (req, res) => res.render("home"));
app.get("/*", (req, res) => res.redirect("/"));

const httpServer = http.createServer(app);
const wsServer = SocketIO(httpServer);

function publicRooms() {

    const {
        sockets: {
            adapter: {sids, rooms},
        },
    } = wsServer;
    const publicRooms = [];
    rooms.forEach((_,key) => {
        if(sids.get(key) === undefined) {
            publicRooms.push(key);
        }
    });
    return publicRooms
}

function countRoom(roomName) {
    return wsServer.sockets.adapter.rooms.get(roomName)?.size;
}

wsServer.on("connection", (socket) => {
    // wsServer.socketsJoin("free");
    socket["nickname"] = "Anon";
    socket.onAny((e) => {
        console.log(`Socket Event: ${e}`);
    })
    socket.on("room", (roomName, done) => {
        socket.join(roomName);
        done();
        socket.to(roomName).emit("welcome", socket.nickname, countRoom(roomName));
        wsServer.sockets.emit("room_change", publicRooms());
    })
    socket.on("disconnecting", () => {
        socket.rooms.forEach(room => 
            socket.to(room).emit("bye", socket.nickname, countRoom(room) - 1)
        );
    })
    socket.on("disconnect", () => {
        wsServer.sockets.emit("room_change", publicRooms());
    })
    socket.on("new_message", (msg, room, done) => {
        socket.to(room).emit("new_message", `${socket.nickname} : ${msg}`);
        done();
    })
    socket.on("nickname", (nickname) => (socket["nickname"] = nickname));
})

const handleListen = () => console.log(`Listening on http://localhost:3000`);
httpServer.listen(3000, handleListen);

 

 

 

1. 사용자가 room 입력값에 따라 채팅할 수 있는 곳으로 이동

1-1 publicRomms으로 sockets adapter을 활용하여 생성된 방 갯수를 확인하고 갯수만큼 리스트업 

 

2.  채팅룸에서 nickname을 설정할 수 있고, 모든 브라우저에서 통신이 가능

2-2 설정된 nickname, 메세지 msg 를 ui단에 출력

 

 

sockets.io document

https://socket.io/docs/v4/

Introduction | Socket.IO

github source

https://github.com/jooSpace/zoom

GitHub - jooSpace/zoom