差分

このページの2つのバージョン間の差分を表示します。

--- ratchet:0.4:push [2020/12/01 17:09]
y2sunlight [クライアントサイド]
+++ ratchet:0.4:push [2020/12/01 17:32] (現在)
y2sunlight [ブログ投稿ページ]
@@ 行 431: / 行 431: @@
 \\
-==== ブログポスト ====
+==== ブログ投稿ページ ====
 新しいブログ投稿を処理する為のコードは、新規に作成し直しました。このコードは ''{Project-Folder}/blog'' に配置します。
@@ 行 467: / 行 467: @@
     <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
     <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
-    <!-- stylesheet -->
-    <link href="css/main.css?v=<?php echo getenv('app-version')?>" rel="stylesheet">
     <!-- javascript -->
     <script src="js/autobahn.js"></script>
@@ 行 500: / 行 498: @@
 ==== クライアントサイド ====
-クライアントサイドのメインのソースコードは上に掲載した [[#entry.php]] 内のHTMLです。メインで使っている他のソースコードは以下の通りです。
+クライアントサイドのメインのソースコードは上に掲載した [[#ブログ投稿ページ|entry.php]] 内のHTMLです。メインで使っている他のソースコードは以下の通りです。
   * template/entry.template.php --- ブログ投稿画面のHTML
@@ 行 509: / 行 507: @@
 {{fa>folder-open-o}} ** {Project-Folder}/blog/template/entry.template.php **
-<code php entry.template.php>
+<code html entry.template.php>
 <h1>Blog Entry</h1>
 <form method="POST" name="fm">
@@ 行 548: / 行 546: @@
 {{fa>folder-open-o}} ** {Project-Folder}/blog/js/main.js **
-<code php main.js>
+<code javascript main.js>
 /*
  * Subscribe Session
@@ 行 569: / 行 567: @@
   * 他のユーザが「kittensCategory」のブログを投稿した時、''#new-articles'' のIDを持つHTML要素に対して、定義リスト(DL)を追加します。
-=== WAMP(V1)のJavaScriptライブラリー ===
+=== WAMP(V1)について ===
 WAMP(V1)のJavaScriptライブラリーは、以下に設置します：
@@ 行 583: / 行 581: @@
 </code>
-autobahn.js は、WAMP のバージョン1のライブラリです。Ratchet は WAMP のバージョン2をサポートしていないので、敢えて [[https://github.com/crossbario/autobahn-js|AutobahnJS]]の古いライブラリーを使用しています。
+この autobahn.js は、WAMP のバージョン1対応のライブラリです。Ratchet は WAMP のバージョン2をサポートしていないので、敢えて [[https://github.com/crossbario/autobahn-js|AutobahnJS]] の古いライブラリーを使用しています。
-> ''補足''
+''補足''
-> WAMPとは WebSocket Application Messaging Protocol の略で、次の機能を提供するWebSocketのサブプロトコルです。
->   ・ ルーティングされたリモートプロシージャコール
+WAMPとは WebSocket Application Messaging Protocol の略で、次の機能を提供するWebSocketのサブプロトコルです。
->   ・ パブリッシュ & サブスクライブ
+  * ルーティングされたリモートプロシージャコール
-> 詳しくは以下を参照：
+  * パブリッシュ & サブスクライブ
->   ・ https://wamp-proto.org/
+詳しくは以下を参照：
+  * https://wamp-proto.org/
 \\
+==== プログラムの実行 ====
+コマンドプロンプトでプロジェクトフォルダに移動してWebSocketサーバーを起動します。
+<code>
+php bin/push-server.php
+</code>
+ブラウザで ''entry.php'' を２つのブラウザーからアクセスします。一方のブラウザでプログを投稿すると、その内容は他方のブラウザに表示されます。
+[{{:ratchet:0.4:rachet-push02.png?nolink&400}}]
+[{{:ratchet:0.4:rachet-push03.png?nolink&400}}]
+\\

Ground Sunlight

ユーザ用ツール

サイト用ツール

差分

ページ用ツール