PHP Websocket開発チュートリアル、リアルタイムアンケート機能の構築
PHP Websocket 開発チュートリアル、リアルタイムのアンケート機能の構築、特定のコード例が必要
Websocket テクノロジは、Web アプリケーションに組み込むことができる新しいネットワーク プロトコルです。 -時間通信機能。従来の HTTP プロトコルとは異なり、Websocket プロトコルは双方向通信を実現でき、中断することなくデータを送受信できます。この記事では、PHPとWebsocket技術を利用したリアルタイムアンケート機能の構築方法と具体的なコード例を紹介します。
- サーバーへの Ratchet のインストール
Ratchet は、Websocket アプリケーションを開発するための PHP ライブラリです。始める前に、サーバーに Ratchet をインストールする必要があります。次のコマンドを使用します。
composer require cboden/ratchet
- Websocket サーバー コードの書き込み
まず、Ratchet WebSocket サーバーを作成する必要があります。この例では、すべてのコードを PHP ファイルに配置します。このファイルでは、RatchetWebSocketWsServer クラスを拡張するクラスを作成します。コンストラクターでは、接続されたクライアントを格納するインスタンス変数 $clients を初期化します。
次はサーバー コードです:
<?php
require __DIR__ . '/vendor/autoload.php'; // 引入 ratchet
use RatchetMessageComponentInterface;
use RatchetConnectionInterface;
use RatchetWebSocketWsServer;
class PollServer implements MessageComponentInterface {
protected $clients;
public function __construct() {
$this->clients = new SplObjectStorage;
}
public function onOpen(ConnectionInterface $conn) {
$this->clients->attach($conn);
echo 'Client ' . $conn->resourceId . ' connected
';
}
public function onClose(ConnectionInterface $conn) {
$this->clients->detach($conn);
echo 'Client ' . $conn->resourceId . ' disconnected
';
}
public function onMessage(ConnectionInterface $from, $msg) {
echo 'Received message ' . $msg . ' from client ' . $from->resourceId . "
";
// 在这里处理逻辑...
}
public function onError(ConnectionInterface $conn, Exception $e) {
echo "An error has occurred: {$e->getMessage()}
";
$conn->close();
}
}
$server = new RatchetApp('localhost', 8080); // 创建一个新的 WebSocket 服务器
$server->route('/poll', new WsServer(new PollServer())); // 定义路由
$server->run(); // 启动服务器上記のコードは、RatchetMessageComponentInterface インターフェイスを実装する PollServer という名前のクラスを定義します。 MessageComponentInterface インターフェイスは非常にシンプルで、メソッドは onOpen、onClose、onMessage、onError## の 4 つだけです。 # 。これらのメソッドは、クライアントがサーバーに接続するとき、サーバーから切断するとき、新しいメッセージを受信するとき、およびエラーが発生するときに呼び出されます。上記のコードではログを出力するだけですが、実際のロジックを扱う際に必要に応じて変更してください。
PollServer クラスを RatchetWebSocketWsServer クラスのコンストラクターに渡す必要があります。これにより、WebSocket プロトコルを使用してクライアントと通信する新しい WebSocket サーバーが作成されます。
/poll という名前のルートを定義します。運用環境では、WebSocket サーバーの実際のドメイン名とポートを使用する必要があります。
- クライアント側コードの作成
<!DOCTYPE html>
<html>
<head>
<title>Real-time Poll</title>
</head>
<body>
<h1>Real-time Poll</h1>
<script>
const connection = new WebSocket('ws://localhost:8080/poll'); // 替换为真实的域名和端口
connection.addEventListener('open', () => {
console.log('Connected');
});
connection.addEventListener('message', event => {
const message = JSON.parse(event.data);
console.log('Received', message);
});
connection.addEventListener('close', () => {
console.log('Disconnected');
});
connection.addEventListener('error', error => {
console.error(error);
});
</script>
</body>
</html>connection という名前の新しい WebSocket オブジェクトを作成し、ws:/ /localhost を使用します。サーバー URL として 8080/poll を指定します。運用環境では、この URL を実際のサーバーのドメイン名とポートに置き換える必要があります。
JSON.parse を使用してメッセージを JavaScript オブジェクトに解析し、コンソールに記録します。
- リアルタイムアンケート機能の実装
public function onMessage(ConnectionInterface $from, $msg) {
echo 'Received message ' . $msg . ' from client ' . $from->resourceId . "
";
$data = json_decode($msg, true);
switch ($data['action']) {
case 'vote':
$vote = $data['vote'];
$this->broadcast([
'action' => 'update',
'votes' => [
'yes' => $this->getVoteCount('yes'),
'no' => $this->getVoteCount('no')
]
]);
break;
}
}
private function broadcast($message) {
foreach ($this->clients as $client) {
$client->send(json_encode($message));
}
}
private function getVoteCount($option) {
// 在这里查询投票选项的数量...
}onMessage メソッドで処理します。このメソッドはメッセージをデコードし、switch ステートメントを使用して action フィールドをチェックします。 action が vote と等しい場合、投票数を更新し、broadcast メソッドを使用してすべてのクライアントに更新を送信します。
broadcast メソッドでは、ループを使用してすべてのクライアントをループし、メッセージを各クライアントに送信します。このメソッドは、JSON エンコードされたメッセージをクライアントに送信します。このメッセージは、connection.addEventListener('message', ...) イベント ハンドラーに登録されたイベント ハンドラーで使用されます。
- 完全なコード例
<?php
require __DIR__ . '/vendor/autoload.php';
use RatchetMessageComponentInterface;
use RatchetConnectionInterface;
use RatchetWebSocketWsServer;
class PollServer implements MessageComponentInterface {
protected $clients;
public function __construct() {
$this->clients = new SplObjectStorage;
}
public function onOpen(ConnectionInterface $conn) {
$this->clients->attach($conn);
echo 'Client ' . $conn->resourceId . ' connected
';
}
public function onClose(ConnectionInterface $conn) {
$this->clients->detach($conn);
echo 'Client ' . $conn->resourceId . ' disconnected
';
}
public function onMessage(ConnectionInterface $from, $msg) {
echo 'Received message ' . $msg . ' from client ' . $from->resourceId . "
";
$data = json_decode($msg, true);
switch ($data['action']) {
case 'vote':
$vote = $data['vote'];
$this->broadcast([
'action' => 'update',
'votes' => [
'yes' => $this->getVoteCount('yes'),
'no' => $this->getVoteCount('no')
]
]);
break;
}
}
public function onError(ConnectionInterface $conn, Exception $e) {
echo "An error has occurred: {$e->getMessage()}
";
$conn->close();
}
private function broadcast($message) {
foreach ($this->clients as $client) {
$client->send(json_encode($message));
}
}
private function getVoteCount($option) {
// 在这里查询投票选项的数量...
}
}
$server = new RatchetApp('localhost', 8080);
$server->route('/poll', new WsServer(new PollServer()));
$server->run();<!DOCTYPE html>
<html>
<head>
<title>Real-time Poll</title>
</head>
<body>
<h1>Real-time Poll</h1>
<form>
<label><input type="radio" name="vote" value="yes"> Yes</label>
<label><input type="radio" name="vote" value="no"> No</label>
<button type="submit">Vote</button>
</form>
<ul>
<li>Yes: <span id="yes-votes">0</span></li>
<li>No: <span id="no-votes">0</span></li>
</ul>
<script>
const connection = new WebSocket('ws://localhost:8080/poll');
connection.addEventListener('open', () => {
console.log('Connected');
});
connection.addEventListener('message', event => {
const message = JSON.parse(event.data);
if (message.action === 'update') {
document.getElementById('yes-votes').textContent = message.votes.yes;
document.getElementById('no-votes').textContent = message.votes.no;
}
});
connection.addEventListener('close', () => {
console.log('Disconnected');
});
connection.addEventListener('error', error => {
console.error(error);
});
document.querySelector('form').addEventListener('submit', event => {
event.preventDefault();
const vote = document.querySelector('input[name="vote"]:checked').value;
connection.send(JSON.stringify({
action: 'vote',
vote: vote
}));
});
</script>
</body>
</html>- 概要
以上がPHP Websocket開発チュートリアル、リアルタイムアンケート機能の構築の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
ホットAIツール
Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ
AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。
Undress AI Tool
脱衣画像を無料で
Clothoff.io
AI衣類リムーバー
AI Hentai Generator
AIヘンタイを無料で生成します。
人気の記事
ホットツール
メモ帳++7.3.1
使いやすく無料のコードエディター
SublimeText3 中国語版
中国語版、とても使いやすい
ゼンドスタジオ 13.0.1
強力な PHP 統合開発環境
ドリームウィーバー CS6
ビジュアル Web 開発ツール
SublimeText3 Mac版
神レベルのコード編集ソフト（SublimeText3）
ホットトピック
7328
9
1626
14
1350
46
1262
25
1209
29
Ubuntu および Debian 用の PHP 8.4 インストールおよびアップグレード ガイド
Dec 24, 2024 pm 04:42 PM
PHP 8.4 では、いくつかの新機能、セキュリティの改善、パフォーマンスの改善が行われ、かなりの量の機能の非推奨と削除が行われています。 このガイドでは、Ubuntu、Debian、またはその派生版に PHP 8.4 をインストールする方法、または PHP 8.4 にアップグレードする方法について説明します。
CakePHP ファイルのアップロード
Sep 10, 2024 pm 05:27 PM
ファイルのアップロードを行うには、フォーム ヘルパーを使用します。ここではファイルアップロードの例を示します。
CakePHP について話し合う
Sep 10, 2024 pm 05:28 PM
CakePHP は、PHP 用のオープンソース フレームワークです。これは、アプリケーションの開発、展開、保守をより簡単にすることを目的としています。 CakePHP は、強力かつ理解しやすい MVC のようなアーキテクチャに基づいています。モデル、ビュー、コントローラー
PHP 開発用に Visual Studio Code (VS Code) をセットアップする方法
Dec 20, 2024 am 11:31 AM
Visual Studio Code (VS Code とも呼ばれる) は、すべての主要なオペレーティング システムで利用できる無料のソース コード エディター (統合開発環境 (IDE)) です。 多くのプログラミング言語の拡張機能の大規模なコレクションを備えた VS Code は、
