シェア:
){kind=small}
Chris is an engineer with an interest in DIY, electronics, embedded software and web applications. He lives in England, enjoys building wacky creations and attending hacker camps.
Vonage SMS APIとPHPでEMF Roamerのキューを構築する
もしご存知なければ 電磁場（EMF）キャンプ光ファイバーインターネット、無線マスト、ロボットバーテンダー、空を照らすレーザー、見渡す限りのワイルドで奇抜な発明品......。
このような奇抜な発明のひとつがEMF Roamerで、1/4スケールの木製テスラ・サイバートラックで、インターネットを通じて誰でもコントロールできるように、横を歩き回るように配置されている！
The Roamer, photographed at dusk with RGB underglow lighting.
画像クレジット ヴィックハークネス.
ただ、見通しで運転できるようにするだけでは十分ではなかった！特にモノのインターネットの世界では。カメラからのライブ・ビデオと地図上の位置は、ユーザーがローマーを操作している間にストリーミングされる。
自由なコントロールは混乱を招くので、私たちはキュー・システムを考案した。人々はウェブブラウザでキューに入り、順番を待ったり、携帯電話番号を伝えて順番が来たらSMSを受け取ったりすることができる（Vonageに感謝！）。このキュー・システムは「サーバーレス」であり、専用サーバーを必要としない。PHPがオンデマンドでキューを調整し、MySQLデータベースに保存される。
この記事では、必要なライブラリとデータベースのセットアップ方法を説明し、EMF Roamerを駆動するために使用されるような簡単なキューの例を作成します。ユーザーが電話番号を入力し、キューに入った後にページを閉じると、順番が来たときにVonageを使ってSMSが送られます。システムはPHPとMySQLのバックエンドで書かれており、共有ホスティングで動作するように設計されている。すでにウェブホストを持っていない場合は、次のようなソフトウェアを使って自分のコンピュータでフォローすることができる。 WAMP.
Flowchart illustrating the queueing process (Start > Wait until at the front > Control until time is up > Leave
SMS配信をフル活用するには Vonageデベロッパーアカウント.今すぐサインアップして、無料クレジットを使ってこのチュートリアルに従ってください。APIキー/シークレットは Vonage API ダッシュボード.
をクローンする必要があります。 PHPウェブユーザキューをクローンする必要があります。
また、Vonage PHP クライアントライブラリをインストールする必要があります。これは コンポーザー.
composer require vonage/client初めてComposerをお使いになる方は、Composerの 入門ページが役に立つだろう。
PHP Web User Queue ライブラリをプロジェクトにインストールするには、 PHPWebUserQueue をサーバーにコピーし、名前を settings.template.phpにリネームします。 settings.phpにリネームし、それを編集します：
$selfdrive = TRUE; //Allow user page requests to self drive the worker in order to keep things running faster
$timeout =3*60; //Time in seconds, how long a session lasts
$noshowtimeout = 2*60; //Time in seconds their place at the front of the queue will be held
$sqlserver = "localhost";
$sql_db = "queuetest";
$sql_user = "queuetest";
$sql_pass = "abab";
$vonagekey = "abab";
$vonagesecret = "abab";
$composerpath = __DIR__ . "/../vendor/autoload.php";
$sitepath = "https://your.site";MySQLサーバーを使用して、デフォルト設定で空のデータベースを作成し、以下の権限を持つユーザーを関連付ける：
Minimum required MySQL permissions are SELECT, INSERT, UPDATE, DELETE, CREATE, ALTER, INDEX.
その後、セットアップスクリプトを実行して必要なテーブルを作成する：
http://[your site]/PHPWebUserQueue/setup.phpMySQL を初めて使用する場合は、ホスティングプロバイダのドキュメントを確認するか、次のようなツールを使用してください。 phpMyAdmin.
ワーカースクリプトを cron ジョブとして定期的に実行するようにサーバーを設定することをお勧めします。これにより、たとえすべてのユーザーがページを閉じたとしても、テキストメッセージは送信され続けます。あなたのウェブホストがこれをサポートしていなくても、心配はいりません。また、Web User Queueライブラリを呼び出すページにアクセスするたびに、キューは "自己駆動 "します。wp-cron "から拝借したテクニックで、WordPressがタスクを処理する方法です。あなたのサイトが特にトラフィックが多い場合、サーバークーロンだけを実行し、各ページ実行時のオーバーヘッドを取り除きたいかもしれません。これは $selfdriveフラグ FALSE.
スクリプトが cronworker.phpスクリプトが実行可能であることを確認する：
crontab を使って毎分 Worker を実行する実装例：
cronを初めて使用する場合は、ホスティングプロバイダのドキュメントを確認するか、以下のようなツールを使用してください。 cron-job.org.
これから簡単なキューの例を作ります。あなたはキューに入り、自分の順番を待ちます。 index.phpで順番を待ち、最後に control.phpに到達します。以下のチュートリアルに沿ってゼロから始めるか、GitHub の "Example" フォルダにある完全なサンプルにアクセスしてください。 GitHub の "Example" フォルダにある完全なサンプルにアクセスしてください。.
ファイルを作成し index.phpライブラリファイルをインクルードし、最初のキューを作成する：
<?php
include '../PHPWebUserQueue/WebUserQueue.php';
$q = new WebUserQueue();私たちのキューでは、SMSからのリンクをたどってポジションを再開することもできる：
if (isset($_GET["i"]) and isset($_GET["s"]))
{
$_SESSION["i"] = $_GET["i"];
$_SESSION["s"] = $_GET["s"];
}ユーザーがすでにセッションを持っているかどうか、あるいはキューに参加するためにフォームを送信したかどうかをチェックします。もしそうでなければ、フォームを表示します：
if (!isset($_SESSION["i"])){
//User is not already in the queue.
if(!isset($_POST['name'])){
//User has not posted the form, so show them the form.
echo "<form method=\"post\"><input type=\"text\" name=\"name\" placeholder=\"Name\"> (optional)<br />";
echo "<input type=\"text\" name=\"phone\" placeholder=\"Phone # e.g. 07712345678\"> (optional)<br />";
echo "We can send you an SMS when it's your turn.<br /><button>Put me in the queue</button></form>";
}
The form before joining the queue.ユーザーがフォームを投稿した場合、そのユーザーをキューに追加します：
else{
//user has posted the form, add them to the queue.
if($q->join($_POST["name"],$_POST["phone"])){
echo "<head><meta http-equiv=\"refresh\" content=\"2\" ></head>";
echo "Welcome to the queue, your ID is: " . $_SESSION["i"] . " <br />";
}
}
}もしユーザーがセッションを持っていて、キューに入っていれば、その詳細をチェックし、どのくらい待てばいいかを知らせます。順番が来たら、コントロールページに送ります：
else{//User is in the queue
if($q->checkValid($_SESSION["i"],$_SESSION["s"])) { //Their session matches the database
if(isset($_GET["end"])){ //Request to end their session
if($q->kick($_SESSION["i"],$_SESSION["s"])){
echo "Thank you for queueing.<br /><a href='index.php'>Click here to enter the queue again</a>";
}
}
else{
list($queuePos,$waitTime) = $q->checkWait($_SESSION["i"],$_SESSION["s"]);
if ($queuePos == 0){ //It's their turn
header("Location: control.php");
}
else{ //They're waiting
echo "<head><meta http-equiv=\"refresh\" content=\"5\" ></head>";
echo "There are " . $queuePos . " people in front of you. This will take about ". $waitTime . " seconds.<br />";
}
}
} else { //Session is not valid
echo "Your session has expired. Please refresh the page to queue again!";
unset($_SESSION['i']);
unset($_SESSION['s']);
}
}
?>
Waiting in the queue
ファイルを作成する。 control.phpファイルを作成し、ライブラリ・ファイルとキューを含める：
<?php
include '../PHPWebUserQueue/WebUserQueue.php';
$q = new WebUserQueue();ユーザーのセッションが有効であり、ユーザーの番であることを確認する：
//User already has a session. Check it's not already used, all their details are valid, and they are first in the queue.
if (isset($_SESSION["i"]))
{
if($q->checkFirst($_SESSION["i"],$_SESSION["s"])){
} else {
echo "<a href='index.php'>Your session is not valid or has expired. Please click here to join the queue</a>";
die();
}
} else {
header("Location: index.php");
echo "<a href='index.php'>Your session is not valid. Please go back to the home page</a>";
die();
}
?>そして、彼らに良い知らせを伝えよう！
<html>
<head>
<title>Front of queue</title>
<script>
var secondsleft = <?php echo $q->checkRemaining($_SESSION["i"],$_SESSION["s"]);?>;
var countdowncaller = setInterval(function(){countdown()}, 1000);//Update the countdown every second.
function countdown() {
secondsleft = secondsleft - 1;
document.getElementById('timeleft').innerHTML = secondsleft + " seconds remaining.";
if (secondsleft < 10) {
document.body.style.backgroundColor = "red";//warn them
}
if (secondsleft <= 0) {
window.location.replace("index.php?end");//kick them
}
}
</script>
</head>
<body>
You are at the front of the queue! <br />
<div id="timeleft">Loading...</div>
<button onclick="window.location.href='index.php?end'">End session</button>
</body>
</html>
At the front of the queue
初めてのオンラインキューの設定、おめでとうございます。これで、あなた自身のインターネット制御ロボットを構築する準備が整ったことになる（電子工作も少し必要だが）！このコンセプトは、複数のユーザーが同時にさまざまなコマンドを送信するフリーフォーオールではなく、一度に一人のユーザーによって操作されることに適したさまざまなアプリケーションに適用できるだろう。参照 Twitchがポケモンをプレイを参照のこと！
キューを管理するための管理ツールを使ってこの例をさらに発展させたい場合は、GitHubの GitHub リポジトリ.
The queue bouncer (queue admin tool)
2024年のEMFキャンプでEMF Roamerに再会できることを願っています！