Notice
Recent Posts
Recent Comments
Link
«   2024/12   »
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31
Archives
Today
Total
관리 메뉴

Code Habit

WebSocket 본문

카테고리 없음

WebSocket

코드베어 2022. 12. 7. 17:25

- HTTP

인터넷으로 데이터를 주고 받는 일종의 규약으로 주로 HTML 문서를 주고 받는 데에 쓰인다. 요청/응답 프로토콜로 서버는 클라이언트의 요청에 대한 응답을 처리하지만 연결을 유지하지는 않는다. TCP를 사용하고 80번 포트를 사용한다.

 

- WebSocket 

WebSocket은 HTTP 통신과 다르게 한번 연결을 하면 연결을 유지하는 특징을 지닌다. 하여 서버는 단순 요청에 대한 응답만 제공하는 것이 아니라 필요하면 직접 연결된 클라이언트와 통신할 수 있다. 클라이언트 구분이 가능하며 실시간 양방향 통신에 사용할 수 있다.

 

- WebSocket 설치

npm i ws

 

- WebSocket 사용 : server.js

const WebSocket = require('ws');
const ws = new WebSocket.Server({port:3000}) 

ws.on('connection', (socket)=>{
    console.log("someone joined !");

    socket.on('close', ()=>{
        console.log("Disconnected from client..");
    })

    socket.on('message', (message)=>{
        console.log("message 수신 : %s", message);
        socket.send(message);
    })
})

3000번 포트로 서버를 연다. client가 접속하면 'connection' 이벤트가 발생하고 접속한 socket이 연결을 끊으면 'close'이벤트가 발생한다. client에서 message를 send 하면 'message'이벤트가 발생하면서 서버에서 client로 받은 메시지를 다시 send한다.

 

- client.js

const WebSocket = require('ws');
const ws = new WebSocket('ws://localhost:3000');

ws.on('open', ()=>{
    console.log("connect 완료");
    ws.send("hi !");
})

ws.on('message', (message)=>{
    console.log("message 수신 : %s", message);
})

ws.on('close', () => {
    console.log("Disconnected from server..");
})

 

로컬에 3000번 포트로 접속하고 접속이 성공하면 'open' 이벤트가 발생한다. 동시에 message를 send하고 서버에서 message를 send하면 이를 'message' 이벤트에서 처리한다. 혹 서버가 연결을 끊으면 'close'이벤트가 발생한다.