0

Grid-EYE(ROBOBA041)という温度センサの出力温度データを,ESP-WROOM-02をWebサーバとして用いて,ブラウザに表示したいと考えています.そこで以下のようなプログラムを作成しました.

#include <WiFiClient.h>
#include <ESP8266WiFi.h>
#include <ESP8266WebServer.h>
#include <Wire.h>
#include <GridEye.h>

GridEye myeye = GridEye(GridEye_DeviceAddress_1);
ESP8266WebServer server(80);

void onroot() {
    String msg ;
    int pixel[64];
    msg += "<!DOCTYPE html>";
    msg += "<html><head><meta charset=\"utf-8\">";
    msg += "<meta http-equiv=\"content-type\" content=\"text/html; 
                                                charset=UTF-8\">";
    msg += "<title>Temperature</title><body>";
    myeye.pixelOut(pixel); // Grid-EYEの温度データ読み出し
    for (int i = 0; i < 64; i++) {
      if (i && ((i % 8) == 0)) {
      msg += "<br>";
    }
    msg += "<font size='3'>" + String(pixel[i]* 0.25) + "</font>"; //温度デー 
                                                                    タを表示
    msg += "&nbsp;";
    }
    msg += "<p id=\"LED\"></p>";
    msg += "</body></html>";
    server.send(200, "text/html", msg);
}

void setup() {
    Serial.begin(115200);
    Wire.begin();
    WiFi.config(IPAddress(***, ***, ***, ***), WiFi.gatewayIP(), 
          WiFi.subnetMask());//使いたいIPアドレスを指定
    WiFi.begin("*******", "********");

    WiFi.mode(WIFI_STA);

    // Web server setting
    server.on("/", onroot);
    server.begin();
}

void loop() {
    server.handleClient();
}

そして,このプログラムを実行したところ,以下のようにブラウザ出力されました.
上記プログラム出力結果

この出力結果より,温度データを表示することはできたのですが,データの更新を行うことができません.ブラウザの更新ボタン(F5)を押下することで,データの更新を行うことはできるのですが,私としては更新を逐一自動的に行えるようにしたいのです.(ブラウザを表示させておくだけで,温度データの数値が一定周期ごとに切り替わるようにしたい)
この目的を実現させるには,どのようにプログラムを改変させればよいのでしょうか.
初めての質問ということで,拙い文章となってしまいましたが,よろしくお願いします.

補足
Grid-EYEは二次元温度データを8*8要素の数値として出力する赤外線アレイセンサです.なので出力される温度データも8*8(64)となっています.

開発環境はArduinoIDEです

1

1 件の回答 1

0

ブラウザのリロードでよいなら、<META>タグで以下の記述を行えば(プログラム中で出力すれば)指定間隔でページが再読み込みされます。

<meta http-equiv="refresh" content="秒数">
3
  • @cubick様 ご回答ありがとうございます。<META>タグの方,試させていただきました。こちらのやり方でデータの更新を行うことが確認できたのですが,実をいうとこれから温度データ以外の情報も同ブラウザ上に表示したいと考えています.ですので,欲を言うとブラウザ全体ではなく,温度データ部分のみ更新を行えるようにしたいです.そのような方法はないでしょうか.勝手なことを言って申し訳ありません. Commented 2019年2月27日 7:33
  • 回答に直接関わる前提条件はコメントではなく質問本文に追記してもらった方が回答者に伝わりやすいです (質問は後からでも [編集] 出来ます)。 / パッと思いついたのは、必要部分のみHTMLフレームで読み込んでリロードさせる、とかでしょうか。
    – cubick
    Commented 2019年2月27日 8:59
  • @cubick様 ご回答ありがとうございます。なるほど,上記プログラムで考えると,onroot関数のみ<META>タグで更新を行い続け,それ以外の情報部分は別の関数でserver.send()を行う,といった解釈でよろしいでしょうか. Commented 2019年2月27日 11:51

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。