웹 개발 소켓 통신

웹 개발에서 소켓 통신(Socket Communication)은 두 시스템 간의 양방향 통신을 가능하게 하는 네트워크 프로그래밍 방식입니다. 소켓을 이용하면 클라이언트와 서버 간의 실시간 데이터 전송이 가능해집니다. 소켓 통신은 특히 실시간 채팅, 온라인 게임, 라이브 업데이트 등 즉각적인 데이터 전송이 필요한 애플리케이션에 많이 사용됩니다.

주요 개념

1. 소켓(Socket):
   • 소켓은 네트워크를 통해 데이터를 주고받는 양 끝점을 나타냅니다.
   • 소켓은 IP 주소와 포트 번호로 구성됩니다.
2. 클라이언트(Client):
   • 서버와 연결을 요청하고 데이터를 송수신하는 측입니다.
   • 클라이언트는 특정 서버의 특정 포트로 연결을 시도합니다.
3. 서버(Server):
   • 클라이언트로부터의 연결 요청을 기다리고 요청이 오면 이를 처리하는 측입니다.
   • 서버는 특정 포트에서 연결 요청을 수신 대기합니다.

소켓 통신의 흐름

1. 서버 측:
   1. 소켓 생성: socket() 함수로 소켓을 생성합니다.
   2. 포트 바인딩: bind() 함수로 소켓을 특정 IP 주소와 포트 번호에 바인딩합니다.
   3. 연결 대기: listen() 함수로 연결 요청을 대기합니다.
   4. 연결 수락: accept() 함수로 클라이언트의 연결 요청을 수락합니다.
   5. 데이터 송수신: send()와 recv() 함수를 사용해 데이터를 주고받습니다.
   6. 연결 종료: 통신이 끝나면 close() 함수로 소켓을 닫습니다.
2. 클라이언트 측:
   1. 소켓 생성: socket() 함수로 소켓을 생성합니다.
   2. 서버에 연결: connect() 함수로 서버의 IP 주소와 포트 번호에 연결을 시도합니다.
   3. 데이터 송수신: send()와 recv() 함수를 사용해 데이터를 주고받습니다.
   4. 연결 종료: 통신이 끝나면 close() 함수로 소켓을 닫습니다.

웹 소켓(WebSocket)

웹 소켓은 HTML5에서 도입된 프로토콜로, 웹 클라이언트(브라우저)와 웹 서버 간의 양방향 통신을 가능하게 합니다. 전통적인 HTTP 통신은 요청-응답 방식으로, 클라이언트가 요청을 보내면 서버가 응답을 보내는 구조입니다. 반면, 웹 소켓은 지속적인 연결을 유지하며 양방향으로 실시간 데이터를 주고받을 수 있습니다.

웹 소켓의 특징

• 양방향 통신: 클라이언트와 서버 모두 데이터를 자유롭게 주고받을 수 있습니다.
• 지속 연결: 한 번 연결이 이루어지면 양측 모두 연결을 유지하며 데이터를 주고받습니다.
• 낮은 오버헤드: HTTP 헤더를 반복적으로 전송하지 않기 때문에 오버헤드가 적습니다.

웹 소켓 사용 예시 (JavaScript)

// 클라이언트 측
const socket = new WebSocket('ws://example.com/socket');

socket.onopen = function(event) {
    console.log('Connected to the server');
    socket.send('Hello Server!');
};

socket.onmessage = function(event) {
    console.log('Message from server:', event.data);
};

socket.onclose = function(event) {
    console.log('Disconnected from the server');
};

socket.onerror = function(error) {
    console.error('WebSocket error:', error);
};

서버 측 예시 (Node.js)

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

wss.on('connection', function connection(ws) {
    console.log('A new client connected');

    ws.on('message', function incoming(message) {
        console.log('received: %s', message);
        ws.send('Hello Client!');
    });

    ws.on('close', function() {
        console.log('Client disconnected');
    });
});

결론

소켓 통신은 네트워크 상에서 두 컴퓨터 간의 실시간 양방향 데이터 전송을 가능하게 하는 중요한 기술입니다. 웹 소켓을 통해 브라우저 기반의 애플리케이션에서도 이러한 실시간 통신을 손쉽게 구현할 수 있습니다. 소켓 통신을 이해하고 활용하면 다양한 실시간 서비스와 애플리케이션을 개발할 수 있게 됩니다.