MENU
  1. ホーム
  2. Apache
  3. ApacheでPHPを使ったWebSocket通信を設定する方法と手順

ApacheでPHPを使ったWebSocket通信を設定する方法と手順

Apache

ApacheでWebSocket通信を実現する方法について解説します。WebSocketは、HTTP通信の制約を超え、サーバーとクライアントが双方向にリアルタイムでデータをやり取りできる技術です。これにより、チャットアプリケーションやライブ更新が必要なダッシュボードなどの開発が容易になります。

一般的にWebSocketサーバーはNode.jsなどが使用されますが、既存のApache環境でPHPを活用して実装することも可能です。これにより、新たなサーバー環境を構築せず、既存のLAMP環境にリアルタイム通信機能を追加できます。

本記事では、ApacheでWebSocket通信を行うためのモジュール設定、PHPスクリプトを使ったWebSocketサーバー構築方法、クライアント側の接続コード例など、手順を一つずつ解説します。初心者でも理解しやすいように、コード例や設定ファイルの具体例を交えながら説明します。

目次

WebSocket通信の概要とApacheの役割


WebSocketは、サーバーとクライアント間で双方向かつリアルタイムの通信を可能にするプロトコルです。HTTPはリクエスト・レスポンス型の通信が基本であり、クライアントがリクエストを送らない限りサーバーは応答しません。これに対してWebSocketは、一度コネクションが確立されるとサーバーからクライアントへデータを随時送信できる点が特徴です。

WebSocketの仕組み


WebSocketは、初回の接続時にHTTPを使って「ハンドシェイク（接続の確立）」を行います。接続が確立すると、HTTPプロトコルがWebSocketプロトコルに切り替わり、以降はTCPコネクションが保持されます。このため、リアルタイム通信が求められるチャットアプリや通知システムなどで広く活用されています。

Apacheの役割と対応


通常、WebSocketサーバーはNode.jsや独立したサーバープログラムが担当しますが、ApacheでもWebSocket通信を処理可能です。Apacheはプロキシモジュールを利用してWebSocket通信をバックエンドのPHPスクリプトへ転送します。これにより、Apacheを通じてPHPでWebSocketサーバーを構築することができます。

また、Apacheのmod_proxy_wstunnelモジュールは、WebSocketのプロキシをサポートしており、フロントエンドからのWebSocketリクエストをPHPで処理する際に重要な役割を果たします。

次のセクションでは、ApacheでWebSocketを利用するために必要なモジュールとそのインストール方法について解説します。

必要なモジュールとインストール方法


ApacheでWebSocket通信を実現するためには、いくつかのモジュールを導入する必要があります。特に重要なのは、mod_proxyとmod_proxy_wstunnelの2つです。これらは、WebSocket通信をApacheでプロキシ処理するために必要となります。

必要なモジュール

  • mod_proxy：HTTPプロキシを行うためのモジュール。
  • mod_proxy_wstunnel：WebSocket通信をプロキシするためのモジュール。
  • mod_ssl（オプション）：WebSocket通信をHTTPS経由で行う場合に必要。

モジュールのインストール手順


多くのLinuxディストリビューションでは、Apacheのインストール時にこれらのモジュールが含まれていますが、必要に応じて手動で有効化する必要があります。

1. モジュールのインストール（Ubuntu/Debian系の場合）

sudo a2enmod proxy
sudo a2enmod proxy_wstunnel
sudo a2enmod ssl  # HTTPSが必要な場合
sudo systemctl restart apache2

2. モジュールのインストール（CentOS/RHEL系の場合）

sudo yum install mod_proxy
sudo yum install mod_proxy_wstunnel
sudo systemctl restart httpd

インストール確認


以下のコマンドで、インストールされたモジュールを確認できます。

apachectl -M | grep proxy


出力例：

proxy_module (shared)  
proxy_wstunnel_module (shared)  
ssl_module (shared)

補足


モジュールが正しく読み込まれていない場合は、Apacheの設定ファイル（httpd.conf）を編集し、以下を追記してください。

LoadModule proxy_module modules/mod_proxy.so
LoadModule proxy_wstunnel_module modules/mod_proxy_wstunnel.so


この設定により、ApacheでWebSocket通信を処理する準備が整います。次は、Apacheの設定ファイルを編集し、WebSocket通信を処理する具体的な方法を説明します。

Apacheの設定ファイル（httpd.conf）の編集方法


ApacheでWebSocket通信を有効にするには、httpd.conf（またはsites-available/000-default.confなど）にWebSocketのプロキシ設定を追加する必要があります。ここでは、WebSocketリクエストをPHPスクリプトに転送するための設定手順を解説します。

設定例：WebSocketプロキシの設定


以下は、WebSocketのリクエストをApacheが受け付け、バックエンドのPHPスクリプトへ転送する設定例です。

httpd.confの編集例

<VirtualHost *:80>
    ServerName example.com

    # 通常のHTTPリクエストの処理
    DocumentRoot /var/www/html
    <Directory "/var/www/html">
        AllowOverride All
        Require all granted
    </Directory>

    # WebSocketのプロキシ設定
    ProxyRequests Off
    ProxyPass /ws/ ws://localhost:8080/
    ProxyPassReverse /ws/ ws://localhost:8080/

    # WebSocket接続時のログ出力
    ErrorLog ${APACHE_LOG_DIR}/error.log
    CustomLog ${APACHE_LOG_DIR}/access.log combined
</VirtualHost>

設定の解説

  • ProxyPass /ws/ ws://localhost:8080/
    クライアントが「ws://example.com/ws/」にアクセスした際、Apacheは「ws://localhost:8080/」に転送します。ここで、PHPのWebSocketサーバーが動作している必要があります。
  • ProxyPassReverseは、サーバーからクライアントへの応答を正しく処理するための設定です。
  • VirtualHostのポートは、80（HTTP）または443（HTTPS）を指定します。HTTPS通信の場合はSSLEngine onも追記します。

HTTPS対応例（オプション）


WebSocket通信をHTTPSで行う場合は、以下のようにSSLの設定を追加します。

<VirtualHost *:443>
    ServerName example.com

    SSLEngine on
    SSLCertificateFile /etc/ssl/certs/example.com.crt
    SSLCertificateKeyFile /etc/ssl/private/example.com.key

    DocumentRoot /var/www/html
    <Directory "/var/www/html">
        AllowOverride All
        Require all granted
    </Directory>

    ProxyRequests Off
    ProxyPass /ws/ wss://localhost:8080/
    ProxyPassReverse /ws/ wss://localhost:8080/

    ErrorLog ${APACHE_LOG_DIR}/error.log
    CustomLog ${APACHE_LOG_DIR}/access.log combined
</VirtualHost>

設定の反映と再起動


設定を反映するためにApacheを再起動します。

sudo systemctl restart apache2

確認方法


ブラウザのデベロッパーツール（F12）を開き、WebSocketの接続が成功しているか確認します。問題が発生した場合は、/var/log/apache2/error.logを確認し、エラー内容を特定します。

これでApacheでのWebSocketプロキシ設定が完了です。次は、PHPでWebSocketサーバーを構築する手順を解説します。

PHPでWebSocketサーバーを構築する手順


Apacheのプロキシ設定が完了したら、次はPHPでWebSocketサーバーを構築します。PHPでWebSocketサーバーを実装するには、基本的なTCPソケットプログラミングの知識が必要ですが、WebSocket専用のライブラリを使用することで比較的簡単に実装できます。

ここでは、PHPのWebSocketライブラリ「Ratchet」を使ったWebSocketサーバーの構築手順を解説します。RatchetはPHPでリアルタイム通信を実現するためのライブラリで、シンプルにWebSocketサーバーを実装できます。

1. Ratchetライブラリのインストール


まず、Composerを使用してRatchetをインストールします。

composer require cboden/ratchet

2. PHPでWebSocketサーバーを作成


以下のコードは、簡単なWebSocketサーバーのサンプルです。クライアントからのメッセージを受け取り、すべての接続中のクライアントに送信するシンプルなエコーサーバーです。

websocket_server.php

<?php
use Ratchet\MessageComponentInterface;
use Ratchet\ConnectionInterface;

// WebSocketサーバークラス
class WebSocketServer implements MessageComponentInterface {
    protected $clients;

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

    public function onOpen(ConnectionInterface $conn) {
        $this->clients->attach($conn);
        echo "新しい接続: ({$conn->resourceId})\n";
    }

    public function onMessage(ConnectionInterface $from, $msg) {
        foreach ($this->clients as $client) {
            if ($from !== $client) {
                $client->send($msg);
            }
        }
        echo "メッセージ受信: {$msg}\n";
    }

    public function onClose(ConnectionInterface $conn) {
        $this->clients->detach($conn);
        echo "接続終了: ({$conn->resourceId})\n";
    }

    public function onError(ConnectionInterface $conn, \Exception $e) {
        echo "エラー: {$e->getMessage()}\n";
        $conn->close();
    }
}

3. WebSocketサーバーの起動スクリプト


次に、WebSocketサーバーを起動するスクリプトを作成します。

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

use Ratchet\App;

$app = new App('localhost', 8080, '0.0.0.0');
$app->route('/ws', new WebSocketServer, array('*'));
$app->run();

4. WebSocketサーバーの起動


以下のコマンドでWebSocketサーバーを起動します。

php websocket_server.php


サーバーが起動すると、WebSocketリクエストをws://localhost:8080/wsで受け付けるようになります。

確認とデバッグ

  1. ブラウザからWebSocketクライアント（後述）を作成し、ws://example.com/wsに接続します。
  2. 接続が成功すると、サーバー側のログに「新しい接続」と表示されます。
  3. メッセージを送信して、他の接続クライアントにも配信されることを確認してください。

次は、クライアント側でWebSocket接続を行うHTMLとJavaScriptの例を解説します。

WebSocket通信のハンドリング（PHPスクリプト）


WebSocketサーバーがPHPで起動したら、サーバー側でクライアントからのメッセージを受け取り、処理するコードを追加します。ここでは、クライアントからのメッセージを処理し、必要に応じて接続中の全クライアントに配信する方法を解説します。

1. クライアントからのメッセージ処理


WebSocket通信では、クライアントがサーバーにメッセージを送信し、サーバーがそのメッセージを他のクライアントにブロードキャストするのが基本の流れです。以下のコードは、接続されたクライアントすべてにメッセージを送信するシンプルなブロードキャストロジックを示しています。

websocket_server.php（追加部分）

public function onMessage(ConnectionInterface $from, $msg) {
    $numRecv = count($this->clients) - 1;
    echo sprintf("クライアント %d からメッセージ受信: %s\n", $from->resourceId, $msg);

    foreach ($this->clients as $client) {
        if ($from !== $client) {
            $client->send("ユーザー{$from->resourceId}: {$msg}");
        } else {
            $client->send("あなた: {$msg}");
        }
    }
}

2. メッセージの解析と処理


クライアントから受け取るメッセージがJSON形式などの構造化データの場合は、PHPでデータを解析して必要な処理を行います。以下は、JSON形式で送られてくるデータを処理する例です。

JSONメッセージの処理例

public function onMessage(ConnectionInterface $from, $msg) {
    $data = json_decode($msg, true);

    if (isset($data['action']) && $data['action'] === 'chat') {
        foreach ($this->clients as $client) {
            $client->send(json_encode([
                'user' => $from->resourceId,
                'message' => $data['message']
            ]));
        }
    } else {
        $from->send(json_encode(['error' => '不正なリクエストです。']));
    }
}

3. エラーハンドリング


エラーが発生した場合、接続中のクライアントにエラーメッセージを送信して通信を終了する処理も追加します。

エラー処理の追加

public function onError(ConnectionInterface $conn, \Exception $e) {
    echo "エラー発生: {$e->getMessage()}\n";
    $conn->send(json_encode(['error' => 'サーバーエラーが発生しました。']));
    $conn->close();
}

4. 接続終了時の処理


クライアントが接続を終了した際に、クライアントリストから削除する処理も重要です。

public function onClose(ConnectionInterface $conn) {
    $this->clients->detach($conn);
    echo "クライアント {$conn->resourceId} が切断されました。\n";
}

動作確認

  1. サーバーを起動して複数のWebSocketクライアントを接続します。
  2. メッセージを送信し、すべてのクライアントがメッセージを受け取ることを確認します。
  3. クライアントが切断された際にログが出力されるか確認します。

次は、クライアント側でWebSocketを使ってPHPサーバーに接続する方法を解説します。

クライアント側のWebSocket接続コード例


サーバー側でWebSocketが動作するようになったら、次はクライアント側でWebSocketを使ってPHPのWebSocketサーバーに接続し、メッセージを送受信するコードを作成します。ここでは、HTMLとJavaScriptを使ったシンプルなWebSocketクライアントの例を紹介します。

1. 基本的なHTMLとJavaScriptのセットアップ


以下のHTMLコードは、ユーザーがメッセージを入力し、それをWebSocketを通じてPHPサーバーに送信するシンプルなチャットアプリの例です。

index.html

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>WebSocketチャット</title>
    <style>
        #chat {
            width: 300px;
            height: 400px;
            border: 1px solid #ccc;
            overflow-y: scroll;
            margin-bottom: 10px;
        }
        #message {
            width: 80%;
        }
    </style>
</head>
<body>
    <h1>WebSocketチャット</h1>
    <div id="chat"></div>
    <input type="text" id="message" placeholder="メッセージを入力...">
    <button onclick="sendMessage()">送信</button>

    <script>
        let socket = new WebSocket("ws://example.com/ws");

        socket.onopen = function() {
            console.log("WebSocket接続が確立しました。");
            document.getElementById('chat').innerHTML += "<div>サーバーに接続しました。</div>";
        };

        socket.onmessage = function(event) {
            let chat = document.getElementById('chat');
            chat.innerHTML += `<div>${event.data}</div>`;
            chat.scrollTop = chat.scrollHeight;
        };

        socket.onclose = function() {
            console.log("WebSocket接続が切断されました。");
            document.getElementById('chat').innerHTML += "<div>サーバーから切断されました。</div>";
        };

        socket.onerror = function(error) {
            console.error("エラーが発生しました: ", error);
        };

        function sendMessage() {
            let message = document.getElementById('message').value;
            if (message) {
                socket.send(message);
                document.getElementById('message').value = "";
            }
        }
    </script>
</body>
</html>

2. コードの解説

  • WebSocket接続は、ws://example.com/wsに対して行われます。このURLはApacheのプロキシ設定を通じてPHPのWebSocketサーバーに転送されます。
  • onopenで接続が確立された際にメッセージを表示します。
  • onmessageでサーバーから受信したメッセージをチャットウィンドウに追加します。
  • oncloseで接続が切断された場合に通知を表示します。
  • sendMessage関数は、入力フォームの内容をWebSocket経由でサーバーに送信します。

3. 動作確認

  1. ApacheサーバーとPHPのWebSocketサーバーを起動します。
  2. ブラウザでindex.htmlを開き、メッセージを送信して他の接続クライアントにもメッセージが反映されることを確認します。
  3. ブラウザのデベロッパーツール（F12）でWebSocketの接続状況やエラーを確認できます。

次は、WebSocket接続の確認方法やデバッグ手順について解説します。

接続の確認とデバッグ方法


WebSocketサーバーを構築した後は、クライアントが正しく接続できるかを確認し、必要に応じてデバッグを行う必要があります。ここでは、ApacheサーバーやPHPで構築したWebSocketサーバーが正常に動作しているかを確認する手順と、接続に失敗した場合のデバッグ方法を解説します。

1. 接続確認の基本手順


1. WebSocketサーバーを起動

php websocket_server.php


サーバー起動時に「新しい接続: (ID)」などのログが表示されることを確認します。

2. クライアントから接続
ブラウザでindex.htmlを開き、コンソールに「WebSocket接続が確立しました。」と表示されることを確認します。

3. メッセージ送信の確認
クライアントからメッセージを送信し、サーバー側で以下のようなログが出力されることを確認します。

クライアント 1 からメッセージ受信: こんにちは


クライアント側でも、他の接続クライアントにメッセージが反映されることを確認します。

2. ブラウザでのWebSocket接続確認


ブラウザのデベロッパーツールを使って、WebSocket接続を確認します。

確認方法

  1. ブラウザでF12を押してデベロッパーツールを開きます。
  2. 「ネットワーク」タブを選択し、「WS」（WebSocket）フィルタを適用します。
  3. ws://example.com/wsへの接続が「101 Switching Protocols」と表示されていることを確認します。

WebSocketメッセージの確認
「メッセージ」タブでクライアントとサーバー間のメッセージがリアルタイムで表示されます。送受信のデータが正しく表示されているか確認してください。

3. エラーが発生した場合の対処法


1. 接続エラー

WebSocket connection to 'ws://example.com/ws' failed: Error during WebSocket handshake
  • 原因：Apacheのmod_proxy_wstunnelが有効になっていない可能性があります。
  • 解決策：Apacheの設定を見直し、以下のコマンドでモジュールを有効化してください。
sudo a2enmod proxy
sudo a2enmod proxy_wstunnel
sudo systemctl restart apache2

2. クライアント接続が切断される場合

WebSocket接続が切断されました。
  • 原因：WebSocketサーバーがクラッシュしている可能性があります。
  • 解決策：PHPのエラーログ（error.log）を確認し、例外が発生していないかを確認します。

3. メッセージが届かない場合

  • 原因：クライアントが接続されていない、またはメッセージのブロードキャスト処理が正しく動作していません。
  • 解決策：サーバーログに「メッセージ受信」のログが出力されているか確認します。出力されていない場合、onMessageのロジックを確認してください。

4. Apacheのログを確認する


ApacheでWebSocketのプロキシ処理が正しく動作しているかを確認するには、以下のコマンドでApacheのログを確認します。

tail -f /var/log/apache2/error.log
tail -f /var/log/apache2/access.log

ログに以下のような出力があるか確認します。

AH00860: Connection to child 0 established (server example.com)


この出力があれば、ApacheがWebSocketリクエストを正しく処理している証拠です。

5. クライアント側のデバッグ方法


クライアント側でWebSocket通信をデバッグするには、以下の手順を行います。

  • JavaScriptのconsole.logを活用して接続状況を確認します。
  • socket.onerrorでエラーが発生した場合、詳細なエラー情報を取得して原因を特定します。

次は、よくあるトラブルとその解決策について詳しく解説します。

よくあるトラブルとその解決策


WebSocketの設定や運用時には、接続エラーや通信の問題が発生することがあります。ここでは、ApacheやPHPのWebSocketサーバーで発生しやすいトラブルの原因とその解決方法について解説します。

1. WebSocket接続が失敗する


症状:
ブラウザのコンソールに以下のエラーが表示される。

WebSocket connection to 'ws://example.com/ws' failed: Error during WebSocket handshake


原因と対処法:

  • mod_proxy_wstunnelが有効でない
    ApacheでWebSocketプロキシを処理するために必要なmod_proxy_wstunnelが無効になっている可能性があります。
    対処法:
  sudo a2enmod proxy
  sudo a2enmod proxy_wstunnel
  sudo systemctl restart apache2
  • ポートが閉じている
    WebSocketサーバーがリッスンしているポートがファイアウォールでブロックされている可能性があります。
    対処法:
  sudo ufw allow 8080
  sudo systemctl restart apache2

2. WebSocket接続後すぐに切断される


症状:
接続後、数秒でWebSocketが切断される。
原因と対処法:

  • PHPサーバースクリプトがクラッシュしている
    PHPスクリプトにエラーが発生し、サーバーが停止している可能性があります。
    対処法:
  tail -f /var/log/apache2/error.log
  tail -f /var/log/apache2/access.log


エラーログを確認し、例外や致命的エラーが出力されている場合は、スクリプトの該当箇所を修正してください。

  • タイムアウト設定が短い
    Apacheのプロキシ設定でWebSocket接続のタイムアウトが短く設定されている可能性があります。
    対処法:
  ProxyTimeout 600


httpd.confやVirtualHostの設定にProxyTimeoutを追加し、タイムアウト時間を延長します。

3. メッセージがクライアントに届かない


症状:
クライアントからメッセージを送信しても、他のクライアントに配信されない。
原因と対処法:

  • onMessageのロジックが間違っている
    PHPサーバーでメッセージを受信しているが、適切にクライアントに送信していない可能性があります。
    対処法:
  foreach ($this->clients as $client) {
      $client->send($msg);
  }


onMessage内のループで全クライアントにメッセージを送信する処理が正しいか確認してください。

4. WebSocketのプロトコルエラー


症状:
ブラウザで以下のエラーが表示される。

Error during WebSocket handshake: Unexpected response code: 404


原因と対処法:

  • プロキシのルーティングミス
    ApacheでWebSocketへのルーティングが正しく行われていない可能性があります。
    対処法:
    httpd.confに以下の設定があることを確認します。
  ProxyPass /ws/ ws://localhost:8080/
  ProxyPassReverse /ws/ ws://localhost:8080/


/ws/が正しくPHPのWebSocketサーバーにルーティングされていることを確認してください。

5. WebSocketがhttpsで動作しない


症状:
https接続でWebSocketが動作しないが、httpでは動作する。
原因と対処法:

  • wss://で接続していない
    WebSocketはhttps環境ではwss://を使用する必要があります。
    対処法:
    クライアント側の接続コードで、以下のようにwss://に変更します。
  let socket = new WebSocket("wss://example.com/ws");
  • SSL証明書の問題
    証明書が正しく設定されていない場合、WebSocket接続が失敗します。
    対処法:
    ApacheでSSL証明書の設定が正しいことを確認してください。
  SSLEngine on
  SSLCertificateFile /etc/ssl/certs/example.com.crt
  SSLCertificateKeyFile /etc/ssl/private/example.com.key

6. PHPのメモリ不足エラー


症状:
PHPのWebSocketサーバーが大量のクライアント接続でクラッシュする。
原因と対処法:

  • メモリ制限が低い
    大量のクライアントを処理する際にメモリ不足が発生している可能性があります。
    対処法:
    php.iniでメモリ制限を増やします。
  memory_limit = 512M


WebSocketサーバーを再起動して変更を適用します。

これで主要なトラブルシューティングは完了です。次は、本記事のまとめを解説します。

まとめ


本記事では、ApacheでPHPを利用してWebSocket通信を構築する方法について解説しました。WebSocketはリアルタイム通信を可能にする強力な技術であり、ApacheとPHPを活用することで、既存のLAMP環境にスムーズに組み込むことができます。

以下の流れで解説しました：

  1. WebSocket通信の概要とApacheの役割
  2. 必要なモジュールのインストールと設定
  3. Apacheのhttpd.confファイルの編集方法
  4. PHPでのWebSocketサーバー構築手順
  5. クライアント側のWebSocket接続コード例
  6. 接続確認とデバッグの方法
  7. よくあるトラブルとその解決策

Apacheのmod_proxy_wstunnelモジュールを利用することで、PHPで構築したWebSocketサーバーにスムーズにリクエストを転送できるようになります。また、Ratchetライブラリを活用することで、複雑なWebSocket通信の実装がシンプルになります。

WebSocketを活用することで、チャットアプリやリアルタイム通知システムなど、多くのシナリオに対応可能です。この記事を参考に、Apache環境でのWebSocket通信をスムーズに構築してください。

Apache
設定 Apache WebSocket PHP サーバー構築

コメント

コメントする

目次