WebSocket 양방향 통신

구잉·2021년 10월 25일
0

웹소켓이란?

  • 요청에 대해 응답만 하던 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)
}
profile
시작을 두려워하지말자

0개의 댓글