§Comet ソケット
§Comet ソケットを作成するためにチャンクレスポンスを利用する
チャンクレスポンス を応用すると、Comet ソケットを作成することができます。 Comet ソケットは、 <script>
のみを含むチャンク分割された単なる text/html
レスポンスです。それぞれのチャンクに、 web ブラウザによって実行される JavaScript を含んだ <script>
タグを書き込みます。これを利用することで、サーバから web ブラウザへ、イベントをリアルタイムに送信することができます: それぞれのメッセージ毎に、JavaScript のコールバック関数を呼び出す <script>
タグでイベントをラップして、それをチャンクレスポンスに書き込みます。
それでは、これを確かめるデモを作成してみましょう。まず、ブラウザの console.log
関数を呼び出す <script>
タグを生成するような Enumerator を作成します。
- Java
-
public static Result index() { // Prepare a chunked text stream Chunks<String> chunks = new StringChunks() { // Called when the stream is ready public void onReady(Chunks.Out<String> out) { out.write("<script>console.log('kiki')</script>"); out.write("<script>console.log('foo')</script>"); out.write("<script>console.log('bar')</script>"); out.close(); } }; response().setContentType("text/html"); return ok(chunks); }
- Java 8
-
public static Result index() { // Prepare a chunked text stream Chunks<String> chunks = StringChunks.whenReady(out -> { out.write("<script>console.log('kiki')</script>"); out.write("<script>console.log('foo')</script>"); out.write("<script>console.log('bar')</script>"); out.close(); }); response().setContentType("text/html"); return ok(chunks); }
このアクションを web ブラウザから実行すると、ブラウザのコンソールに3つのイベントログが出力されるでしょう。
§play.libs.Comet
ヘルパーを使う
チャンク分割された comet ストリームを扱うために、上で書いた内容とほぼ同じことを行う Comet ヘルパーを用意しています。
ノート: 実際のところ Comet ヘルパは、ブラウザの互換性のため最初に空のバッファデータを送信したり、メッセージとして String と JSON の両方をサポートするなど、上で書いた内容以上のことを行います。
これを使って前述の例を書き直してみましょう:
- Java
-
public static Result index() { Comet comet = new Comet("console.log") { public void onConnected() { sendMessage("kiki"); sendMessage("foo"); sendMessage("bar"); close(); } }; return ok(comet); }
- Java 8
-
public static Result index() { return ok(Comet.whenConnected("console.log", comet -> { comet.sendMessage("kiki"); comet.sendMessage("foo"); comet.sendMessage("bar"); comet.close(); })); }
§Forever iframe テクニック
Comet ソケットを書く標準的なテクニックとして、 iframe 内でチャンク分割された Comet レスポンスを無限にロードし、親フレームを呼び出すコールバック関数を特定するというものがあります:
- Java
-
public static Result index() { Comet comet = new Comet("parent.cometMessage") { public void onConnected() { sendMessage("kiki"); sendMessage("foo"); sendMessage("bar"); close(); } }; return ok(comet); }
- Java 8
-
public static Result index() { return ok(Comet.whenConnected("parent.cometMessage", comet -> { comet.sendMessage("kiki"); comet.sendMessage("foo"); comet.sendMessage("bar"); comet.close(); })); }
これを、次のような HTML ページと共に使用します:
<script type="text/javascript">
var cometMessage = function(event) {
console.log('Received event: ' + event)
}
</script>
<iframe src="/comet"></iframe>
次ページ: WebSocket
このドキュメントの翻訳は Play チームによってメンテナンスされているものではありません。 間違いを見つけた場合、このページのソースコードを ここ で確認することができます。 ドキュメントガイドライン を読んで、お気軽にプルリクエストを送ってください。