PHP

PHP에서 WebSocket 구현하기

thebasics 2024. 10. 3. 10:00

목차
1. WebSocket이란 무엇인가?
   - WebSocket의 개념
   - WebSocket과 HTTP의 차이점
   - WebSocket의 장점
2. Ratchet 라이브러리 사용 예제
   - Ratchet 라이브러리 설치
   - Ratchet을 사용한 WebSocket 서버 구현
   - 클라이언트와의 실시간 통신 예제
3. 코드 예제
4. 결론 및 추가 학습 자료


1. WebSocket이란 무엇인가?

WebSocket의 개념

WebSocket은 클라이언트와 서버 간의 상시 연결을 유지하여, 양방향 실시간 통신을 가능하게 하는 프로토콜입니다. HTTP는 요청-응답 방식으로 동작하는 반면, WebSocket은 연결이 한번 성립되면 클라이언트와 서버가 서로 데이터를 자유롭게 주고받을 수 있습니다. 이는 실시간 애플리케이션(예: 채팅, 주식 거래 시스템 등)에서 매우 유용합니다.

WebSocket과 HTTP의 차이점

- 연결 유지: HTTP는 요청이 완료되면 연결이 종료되지만, WebSocket은 연결이 유지되며, 양방향 데이터 전송이 가능합니다.
- 양방향 통신: HTTP는 클라이언트가 요청을 보내면 서버가 응답하는 구조지만, WebSocket은 클라이언트와 서버가 서로 데이터를 자유롭게 주고받을 수 있습니다.
- 낮은 오버헤드: WebSocket은 헤더 크기가 작아, 데이터 전송의 오버헤드가 적습니다.

WebSocket의 장점

- 실시간 데이터 전송: WebSocket은 실시간으로 데이터를 주고받을 수 있어, 지연이 적고 빠른 응답이 필요할 때 유용합니다.
- 네트워크 효율성: 연결을 유지하면서 데이터를 주고받으므로, 빈번한 연결/해제 과정에서 발생하는 오버헤드를 줄일 수 있습니다.
- 양방향 통신: 서버에서 클라이언트로의 푸시 메시지를 쉽게 구현할 수 있습니다.


2. Ratchet 라이브러리 사용 예제

Ratchet 라이브러리 설치

Ratchet은 PHP로 WebSocket 서버를 구현하기 위한 라이브러리입니다. 비동기 I/O를 지원하는 ReactPHP를 기반으로 하여, 실시간 WebSocket 애플리케이션을 쉽게 구축할 수 있습니다.

Composer를 사용한 Ratchet 설치:

composer require cboden/ratchet

설치가 완료되면, Ratchet을 사용하여 WebSocket 서버를 구현할 수 있습니다.

Ratchet을 사용한 WebSocket 서버 구현

Ratchet을 사용해 간단한 WebSocket 서버를 구현해 보겠습니다. 이 서버는 클라이언트가 연결되면 메시지를 받고, 이를 다른 모든 클라이언트에게 전송하는 역할을 합니다.

WebSocket 서버 코드:

// src/Chat.php
<?php

use Ratchet\MessageComponentInterface;
use Ratchet\ConnectionInterface;

class Chat implements MessageComponentInterface
{
    protected $clients;

    public function __construct()
    {
        $this->clients = new \SplObjectStorage;
    }

    public function onOpen(ConnectionInterface $conn)
    {
        // 새 클라이언트 연결
        $this->clients->attach($conn);
        echo "New connection! ({$conn->resourceId})\n";
    }

    public function onMessage(ConnectionInterface $from, $msg)
    {
        // 모든 클라이언트에게 메시지 전송
        foreach ($this->clients as $client) {
            if ($from !== $client) {
                $client->send($msg);
            }
        }
    }

    public function onClose(ConnectionInterface $conn)
    {
        // 클라이언트 연결 종료
        $this->clients->detach($conn);
        echo "Connection {$conn->resourceId} has disconnected\n";
    }

    public function onError(ConnectionInterface $conn, \Exception $e)
    {
        // 에러 발생 시 처리
        echo "An error has occurred: {$e->getMessage()}\n";
        $conn->close();
    }
}

?>

이 코드는 간단한 채팅 서버를 구현한 예제입니다. 새로운 클라이언트가 연결되면 'onOpen()' 메서드가 호출되고, 클라이언트가 메시지를 보내면 'onMessage()' 메서드에서 이를 다른 클라이언트에게 전송합니다.

클라이언트와의 실시간 통신 예제

WebSocket 서버가 준비되었으니, 이를 클라이언트에서 사용해 보겠습니다. 브라우저에서 JavaScript를 사용하여 WebSocket 서버와 연결하고, 메시지를 주고받을 수 있습니다.

클라이언트 코드 (JavaScript):

<!DOCTYPE html>
<html>
<head>
    <title>WebSocket Chat</title>
</head>
<body>
    <h1>WebSocket Chat</h1>
    <input type="text" id="message" placeholder="Type a message..." />
    <button onclick="sendMessage()">Send</button>
    <ul id="chat"></ul>

    <script>
        var ws = new WebSocket('ws://localhost:8080');

        ws.onmessage = function(event) {
            var li = document.createElement('li');
            li.textContent = event.data;
            document.getElementById('chat').appendChild(li);
        };

        function sendMessage() {
            var input = document.getElementById('message');
            ws.send(input.value);
            input.value = '';
        }
    </script>
</body>
</html>

이 클라이언트 코드는 'ws://localhost:8080' WebSocket 서버에 연결하여 메시지를 주고받습니다. 사용자가 입력한 메시지를 서버로 보내고, 서버로부터 받은 메시지를 화면에 표시합니다.


3. 코드 예제

다음은 Ratchet 라이브러리를 사용하여 PHP에서 WebSocket 서버를 구현하고, 클라이언트와 실시간 통신을 하는 종합적인 예제입니다.

1. WebSocket 서버 코드 (PHP

// src/Chat.php
<?php

use Ratchet\MessageComponentInterface;
use Ratchet\ConnectionInterface;

class Chat implements MessageComponentInterface
{
    protected $clients;

    public function __construct()
    {
        $this->clients = new \SplObjectStorage;
    }

    public function onOpen(ConnectionInterface $conn)
    {
        $this->clients->attach($conn);
        echo "New connection! ({$conn->resourceId})\n";
    }

    public function onMessage(ConnectionInterface $from, $msg)
    {
        foreach ($this->clients as $client) {
            if ($from !== $client) {
                $client->send($msg);
            }
        }
    }

    public function onClose(ConnectionInterface $conn)
    {
        $this->clients->detach($conn);
        echo "Connection {$conn->resourceId} has disconnected\n";
    }

    public function onError(ConnectionInterface $conn, \Exception $e)
    {
        echo "An error has occurred: {$e->getMessage()}\n";
        $conn->close();
    }
}

?>

2. 서버 실행 코드 (PHP):

// public/server.php
<?php

require '../vendor/autoload.php';

use Ratchet\Http\HttpServer;
use Ratchet\Server\IoServer;
use Ratchet\WebSocket\WsServer;

$chatServer = new Chat();

$server = IoServer::factory(
    new HttpServer(
        new WsServer($chatServer)
    ),
    8080
);

$server->run();

?>

3. 클라이언트 코드 (HTML/JavaScript):

<!DOCTYPE html>
<html>
<head>
    <title>WebSocket Chat</title>
</head>
<body>
    <h1>WebSocket Chat</h1>
    <input type="text" id="message" placeholder="Type a message..." />
    <button onclick="sendMessage()">Send</button>
    <ul id="chat"></ul>

    <script>
        var ws = new WebSocket('ws://localhost:8080');

        ws.onmessage = function(event) {
            var li = document.createElement('li');
            li.textContent = event.data;
            document.getElementById('chat').appendChild(li);
        };

        function sendMessage() {
            var input = document.getElementById('message');
            ws.send(input.value);
            input.value = '';
        }
    </script>
</body>
</html>

코드 분석:
- 첫 번째 예제는 Ratchet을 사용하여 간단한 WebSocket 채팅 서버

를 구현합니다. 서버는 연결된 모든 클라이언트에게 메시지를 브로드캐스트합니다.
- 두 번째 예제는 WebSocket 서버를 실행하기 위한 코드로, PHP 내장 서버 또는 다른 웹 서버에서 실행할 수 있습니다.
- 세 번째 예제는 HTML과 JavaScript를 사용하여 클라이언트 측에서 WebSocket 서버와 실시간으로 통신하는 방법을 보여줍니다.


4. 결론 및 추가 학습 자료

이번 글에서는 PHP에서 WebSocket을 구현하는 방법에 대해 알아보았습니다. WebSocket은 실시간 양방향 통신을 가능하게 하여, 채팅, 실시간 데이터 피드 등 다양한 애플리케이션에 유용하게 사용됩니다. Ratchet 라이브러리를 사용하여 간단하게 WebSocket 서버를 구현하고, 클라이언트와 실시간 통신을 처리하는 방법을 배웠습니다.

추가 학습 자료:
- [Ratchet 공식 문서](http://socketo.me/ Ratchet 라이브러리의 설치 및 사용법에 대한 공식 문서입니다.
- [WebSocket 개요](https://developer.mozilla.org/ko/docs/Web/API/WebSockets_API WebSocket의 개념과 브라우저에서의 사용 방법에 대한 설명입니다.


이제 PHP에서 WebSocket을 활용하여 실시간 애플리케이션을 개발하고, 다양한 프로젝트에 적용할 수 있습니다. 실습을 통해 WebSocket의 강력한 기능을 익히고, 실제 프로젝트에 활용해보세요!

반응형