このページの2つのバージョン間の差分を表示します。
両方とも前のリビジョン 前のリビジョン 次のリビジョン | 前のリビジョン 最新のリビジョン 両方とも次のリビジョン | ||
ratchet:0.4:tutorial [2020/11/16 16:55] y2sunlight [チャットアプリの外観] |
ratchet:0.4:tutorial [2020/11/19 11:09] y2sunlight [Ratchet チュートリアル] |
||
---|---|---|---|
行 1: | 行 1: | ||
- | > 編集中 | ||
- | |||
====== Ratchet チュートリアル ====== | ====== Ratchet チュートリアル ====== | ||
Version 0.4.3 | Version 0.4.3 | ||
行 11: | 行 9: | ||
関連記事 | 関連記事 | ||
* Ratchet チュートリアル | * Ratchet チュートリアル | ||
+ | * [[Ratchet: | ||
* [[Ratchet: | * [[Ratchet: | ||
行 110: | 行 109: | ||
=== インスタンス化 === | === インスタンス化 === | ||
- | '' | + | '' |
{{fa> | {{fa> | ||
行 128: | 行 127: | ||
</ | </ | ||
- | 上のチャットサーバは、[[http:// | + | ここでは、[[http:// |
'' | '' | ||
行 156: | 行 155: | ||
\\ | \\ | ||
- | ===== ロジックの実装 ===== | + | ===== チャットロジックの実装 ===== |
- | Chatクラスにロジックを追加します。 | + | |
- | メッセージを送信するために着信の接続を追跡します。 | + | |
- | 通常、これらのコレクションを配列に格納しますが、 | + | |
- | ここでは [[https:// | + | |
- | このストレージコンテナは、オブジェクトを格納するように構築されています。 | + | |
- | ※SplObjectStorage は, PHP 5.2 以降に搭載された便利なコンテナクラスです。 | + | |
+ | 先に作成した Chat クラスのスケルトンにロジックを追加します。 | ||
- | [{Project-Folder}/ | + | メッセージを送信するために着信の接続を追跡し、ここでは |
- | <code php> | + | |
+ | > [[https:// | ||
+ | |||
+ | {{fa> | ||
+ | < | ||
<?php | <?php | ||
namespace MyApp; | namespace MyApp; | ||
行 214: | 行 212: | ||
</ | </ | ||
- | ・onOpen | + | * < |
- | ・onMessage - TODO: 説明... | + | * onOpen |
- | ・onClose | + | |
- | ・onError | + | |
+ | | ||
+ | |||
+ | 非常にシンプルなロジックですが、Ratchet の '' | ||
\\ | \\ | ||
===== チャットアプリの実行 ===== | ===== チャットアプリの実行 ===== | ||
+ | |||
アプリケーションが完成したので、実行してみましょう。 | アプリケーションが完成したので、実行してみましょう。 | ||
- | まず、コマンドプロンプトからチャットサーバ(chat-server.php) を起動します。 | + | まず、コマンドプロンプトでチャットサーバ ('' |
< | < | ||
行 231: | 行 233: | ||
別のコマンドプロンプトから以下のようにTelnetを起動します。 | 別のコマンドプロンプトから以下のようにTelnetを起動します。 | ||
+ | |||
+ | > Telnet が有効になっていない場合は、[[http:// | ||
< | < | ||
行 236: | 行 240: | ||
</ | </ | ||
- | この時チャットサーバから以下が出力されます。 | + | この時、チャットサーバから以下のメッセージが出力されます。 |
< | < | ||
New connection! (37) | New connection! (37) | ||
</ | </ | ||
- | さらに、別のコマンドプロンプトから以下のようにTelnetを起動します。 | + | さらに、別のコマンドプロンプトからもTelnetを起動します。 |
< | < | ||
行 247: | 行 252: | ||
</ | </ | ||
- | この時チャットサーバから以下が出力されます。 | + | 上と同じように、チャットサーバから2番目のメッセージが出力されます。 |
< | < | ||
New connection! (37) | New connection! (37) | ||
行 253: | 行 259: | ||
</ | </ | ||
+ | Telnetを起動した一方のコマンドプロンプトから、メッセージ('' | ||
- | Telnetを起動したコマンドプロンプトから、メッセージ( "Hello World!" | + | ここまではTCPレベルのアプローチです。主な機能は MessageComponentInterface に集約されており、イベントハンドリングが主体で、WebSocketAPI はまだ機能していません。 |
- | 他のウィンドウに表示されます。 | + | |
- | ctrl+] でコマンドモードに移行し、quitで終了できます。 | + | |
- | + | ||
- | ここまではTCPレベルのアプローチです。主な機能はMessageComponentInterfaceに集約されており、 | + | |
- | イベントハンドリングが主体で、WebSocketAPIはまだ機能していません。 | + | |
\\ | \\ | ||
===== WebSocketへの対応 ===== | ===== WebSocketへの対応 ===== | ||
- | 基本的なチャットアプリケーションが機能するようになったので、 | ||
- | それをWebブラウザでそれが機能するようにチャットサーバを変更します。 | ||
- | [{Project-Folder}/ | + | 基本的なチャットアプリケーションが機能するようになったので、今度はWebブラウザでそれが機能するようにチャットサーバを変更します。 |
+ | |||
+ | {{fa> | ||
<code php chat-server-ws.php> | <code php chat-server-ws.php> | ||
<?php | <?php | ||
行 287: | 行 289: | ||
</ | </ | ||
- | WsServerを使用すると[[https:// | + | [[http:// |
- | HttpServerは、着信HTTPリクエストの解析を担当します。このクラスの目的は、完全なHTTPヘッダー要求を受信して渡すまでデータをバッファリングすることで、 | + | WebSocket リクエストをアップグレードするためのものです。 |
- | WebSocketリクエストをアップグレードするためのものです。 | + | |
+ | このチャットをテストするために、次のファイルを作ります。(HTMLファイルでも問題ありません) | ||
- | このサーバをテストするために、次のファイルを作ります。(HTMLファイルでも問題ありません) | + | {{fa> |
- | + | ||
- | [{Project-Folder}/ | + | |
<code html client-ws.html> | <code html client-ws.html> | ||
<script type=" | <script type=" | ||
行 309: | 行 309: | ||
- | コマンドプロンプトでチャットサーバ(chat-server-ws.php)を実行します。 | + | コマンドプロンプトでチャットサーバ('' |
< | < | ||
行 315: | 行 315: | ||
</ | </ | ||
- | 2つのブラウザウィンドウを開いて、test-ws.php にアクセスします。 | + | 次に、2つのブラウザウィンドウを開いて |
- | そして、ブラウザの開発ツールを開きデバックコンソールへの次のメッセージを確認して下さい。 | + | |
< | < | ||
行 322: | 行 321: | ||
</ | </ | ||
- | このメッセージが出ていたら、一方のデバックコンソールから次のコードを実行します: | + | このメッセージが出ていたら、一方のブラウザのデバックコンソールから次のコードを実行します: |
< | < | ||
- | conn.send(こんにちは'); | + | conn.send('Hello World!'); |
</ | </ | ||
この時、他方のデバックコンソールに "Hello World!" | この時、他方のデバックコンソールに "Hello World!" | ||
+ | |||
+ | これで Ratchet のチュートリアル「Hello World!」を終わります。 | ||
+ | |||
\\ | \\ | ||