ESPertで用意されているクラウドサービスを利用することにより、温度・湿度の送信を行うことができます。しかし、クラウドサービスを利用すると全世界に温度・湿度を公開することになり、プライバシーの侵害になってしまいます。プライバシーの問題は別として、LAN内で使う分には、インターネットに公開する必要もないでしょう。
そこで、ESPertのサンプルスケッチを見ると、
_0090_Ajax
というのがありました。
これは、
ESPresso Lite V2がHTTPサーバー(Webサーバー)になり、ブラウザーソフトに対して、Ajaxでデータを送信します。
IPアドレスは、ルーターのDHCPにより、取得し、設定されます。しかし、電源を入れ直すたびにIPアドレスが変わってしまう可能性があり、不便ですので、IPアドレスを固定にしたほうが使い勝手がいいでしょう。ESPertのライブラリーには、IPアドレスを固定にする関数が用意されていませんので、Arduinoのwifiライブラリーに含まれている関数を利用します。
下記のサイトを参考にしました。
https://github.com/esp8266/Arduino/issues/1959
このサイトでは、ESP8266の例ですが、ESPresso もESP8266を使用しているため同様です。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 |
#include <ESPert.h> String indexPage = "<!DOCTYPE HTML>\n" "<html>\n" "<head>\n" "<meta charset=\"utf-8\">\n" "<title>ESP-DHT By IOXhop</title>\n" "<script>\n" "function loadXMLDoc() {\n" " var xmlhttp;\n" " if (window.XMLHttpRequest) { \n" " xmlhttp=new XMLHttpRequest();\n" " } else { \n" " xmlhttp=new ActiveXObject(\"Microsoft.XMLHTTP\");\n" " }\n" " \n" " xmlhttp.onreadystatechange = function() {\n" " if (xmlhttp.readyState==4 && xmlhttp.status==200) {\n" " var d = new Date();\n" " document.getElementById(\"update\").innerHTML = d.getHours() + \":\" + d.getMinutes() + \":\" + d.getSeconds();\n" " document.getElementsByTagName(\"output\")[0].innerHTML=xmlhttp.responseText;\n" " setTimeout(function(){ loadXMLDoc() }, 1000);\n" " }\n" " }\n" " xmlhttp.open(\"GET\", \"./temperature\", true);\n" " xmlhttp.send();\n" "}\n" "\n" "setTimeout(function(){ loadXMLDoc() }, 1000);\n" "</script>\n" "</head>\n" "\n" "<body style=\"font-family: Arial, Helvetica, sans-serif;\">\n" "<h1 style=\"text-align: center;\">ESP-DHT By IOXhop</h1>\n" "<h2 style=\"text-align: center;\">Temperature Humidity</h2>\n" "<output style=\"text-align: center; font-size: 110px; display: block;\">0</output>\n" "<p style=\"text-align: center;\">Update: <span id=\"update\">00:00</span></p>\n" "</body>\n" "</html>\n"; ESPert espert; ESP8266WebServer* server = NULL; float temperature = 0.0f; float humidity = 0.0f; const char* ssid = "SSID"; //ルーターのSSID const char* password = "1234567890123"; //ルーターのパスワード void init_server() { server = new ESP8266WebServer(80); //ポート番号 server->on("/temperature", []() { float t = espert.dht.getTemperature(); float h = espert.dht.getHumidity(); if (!isnan(t)) { temperature = t; } if (!isnan(h)) { humidity = h; } server->send(200, "text/html", (String)(temperature) + "C " + (String)humidity + "%"); }); server->on("/", []() { server->send(200, "text/html", indexPage); }); server->begin(); } void setup() { espert.init(); espert.dht.init(); espert.oled.init(); delay(2000); espert.oled.clear(); espert.oled.println(espert.info.getId()); espert.oled.println(); //int mode = espert.wifi.init(); // NETWORK: Static IP details... IPAddress ip(192, 168, 1, 190); //任意のIPアドレス IPAddress gateway(192, 168, 1, 1); //ルーターのIPアドレス IPAddress subnet(255, 255, 255, 0); WiFi.config(ip, gateway, subnet); WiFi.begin(ssid, password); espert.oled.print("IP..: "); espert.oled.println(WiFi.localIP()); espert.oled.println(); init_server(); } void loop() { espert.loop(); if (server) { server->handleClient(); } } |
下記の部分で無線LANルーター(アクセスポイント)のSSID、パスワードを設定します。
const char* ssid = “SSID”;
const char* password = “1234567890123”;
下記の部分でIPアドレスを設定します。ルーターが割り当てるIPアドレスと同じ体系にします。若いアドレスは、ルーターがDHCPで割り当てるアドレスに使用することが多いので200前後の大きい値にしたほうがいいでしょう。gateway にルーターのIPアドレスを設定します。
IPAddress ip(192, 168, 1, 190); //任意のIPアドレス
IPAddress gateway(192, 168, 1, 1); //ルーターのIPアドレス
IPAddress subnet(255, 255, 255, 0);
ポート番号は、下記のところで設定しています。通常、HTTPサーバーは、80ですが、変更することもできます。一つのグローバル固定IPアドレスで複数のESPresso Lite (Webサーバー)をインターネットに公開したい場合は、これを変えることにより対応できます。
server = new ESP8266WebServer(80); //ポート番号
パソコンのブラウザーソフトを使って、設定したIPアドレス、上記の例で
http://192.168.1.190
にアクセスすると、下記のように表示されます。
もとのサンプルスケッチでは、温度のみの表示でしたので湿度も追加しました。単位の℃がうまく表示されないので、C のみに変更しました。
初めの
String indexPage =
に代入する部分でページに表示される内容を変更することができます。