こんばんは。
今回は、なかなかできないので、ぼやきます。
Arduino からリアルタイムでデータを送信して、ブラウザで受けるということをやっていますが、なかなかうまくできません。
→ついにできました。最新記事をご覧ください。 スゴイです。
Arduino のサンプルプログラムでWebServerでAnalogInのデータを数秒ごとにブラウザ画面を更新して表示するのはできます。
しかし、今やりたいのは、ページ更新ではなく、リアルタイムでデータをストリーミング更新したいんです。
とりあえず、Server-Sent Events というものを使えば、ブラウザ上でHTTPハンドシェイクなしにストリーミング受信できるそうなんです。
ただ、ネット上でArduinoでやったという情報はまったくなし。
仕方ないので、独自で実験しています。
分かったことは、ブラウザ側で
<script>>
var stream=new EventSource(“URL”);
stream.addEventListener(‘message’,function(event){
console.log(event.data);
});
</script>
というJava Script を入れたHTMLファイルを作り、Arduino側で、
client.println(“HTTP/1.1 200 OK”);
client.println(“Content-Type: text/event-stream”);
client.println(“Cache-Control: no-cache”);
client.println(“Connection: close”);
client.println();
というレスポンスを返せば、それ以降はHTTPのリクエスト、レスポンスというハンドシェイク応答無しに常時接続となって通信できるのですが、
なぜか
client.println(“data: Hello!”);
のところで、data:も表示されてしまうんです。
いろいろ実験したら、不思議なことにブラウザ側でJavaScriptを組まないで、ただ単にブラウザ側のアドレス入力欄にArduinoのURLを入力しても同じ結果が出てしまうんです。
とりあえず、ストリーミング受信はできているようですが、なんか思ったような動作しません。
データを改行せずに上書きしたいんですが・・・
何が間違えているのか、さっぱり分かりません。
ちなみに、ブラウザは Android 4.4.2 のChrome
iOS 8.4 のSafari 両方で試しました。
これは無理なんだろうか・・・
ということで、ぼやいてみました。
また、分かったらご報告したいと思います。
では、また・・・
コメント