WebSocket双方向通信


Webソケットとは?
  • リクエストのみに応答するhttpプロトコルは、各リクエストの接続および切断プロセスが重複するため、効率が低下する.
    ->これらの問題を解決するためにWebsocketが誕生した.接続が確立されると、サーバとクライアントは、接続が切断される前にデータを自由に転送できます.
  •   webSocketServer.on('connection', (ws, request)=>{
        // 1) 연결 클라이언트 IP 취득
        const ip = request.headers['x-forwarded-for'] || request.connection.remoteAddress;
        console.log(`새로운 클라이언트[${ip}] 접속`);
    
        // 2) 클라이언트에게 메시지 전송
        if(ws.readyState === ws.OPEN){
      // 연결 여부 체크
      ws.send(`클라이언트[${ip}] 접속을 환영합니다 from 서버`);
      // 데이터 전송
    }
       // 3) 클라이언트로부터 메시지 수신 이벤트 처리
       ws.on('message', (msg)=>{ console.log(`클라이언트[${ip}]에게 수신한 메시지 : ${msg}`);
       ws.send('서버에서 메세지 수신 완료')
     })
       // 4) 에러 처러
       ws.on('error', (error)=>{ console.log(`클라이언트[${ip}] 연결 에러발생 : ${error}`); })
       // 5) 연결 종료 이벤트 처리
       ws.on('close', ()=>{ console.log(`클라이언트[${ip}] 웹소켓 연결 종료`); })
    });
    
    const webSocket = new WebSocket("ws://localhost:4000/websocket");
    
    webSocket.onopen = ()=>{
      console.log("웹소켓서버와 연결 성공");
    };
    // 2-2) 메세지 수신 이벤트 처리
    webSocket.onmessage = function (event) {
      console.log(`서버 웹소켓에게 받은 데이터: ${event.data}`);
    }
    
    // 2-3) 연결 종료 이벤트 처리
    webSocket.onclose = function(){
      console.log("서버 웹소켓 연결 종료");
    }
    // 2-4) 에러 발생 이벤트 처리
    webSocket.onerror = function(event){
      console.log(event)
    }