Systemstart "externe Ansicht"
Anbei ist der Code für die externe Ansicht der Temperaturdaten im Netzwerk zu finden.
1. #include <ESP8266WebServer.h>
2. #include <OneWire.h>
3. #include <DallasTemperature.h>
4.
5.
6. // Dateneingangspin D2 am ESP8266
7. #define ONE_WIRE_BUS D2
8.
9.
10. // oneWire-Instanz für Kommunikation mit OneWire-Geräten
11. OneWire oneWire(ONE_WIRE_BUS);
12.
13. // Verweis auf oneWire
14. DallasTemperature sensors(&oneWire);
15.
16.
17. float tempSensor1, tempSensor2, tempSensor3, tempSensor4, tempSensor5, tempSensor6;
18.
19. uint8_t sensor1[8] = { 0x28, 0x9C, 0x41, 0x53, 0x32, 0x20, 0x01, 0xA8 };
20. uint8_t sensor2[8] = { 0x28, 0xEE, 0x25, 0x67, 0x32, 0x20, 0x01, 0x16 };
21. uint8_t sensor3[8] = { 0x28, 0xD9, 0xCB, 0x70, 0x32, 0x20, 0x01, 0xB8 };
22. uint8_t sensor4[8] = { 0x28, 0xA7, 0xB1, 0x71, 0x32, 0x20, 0x01, 0x6C };
23. uint8_t sensor5[8] = { 0x28, 0x60, 0xDB, 0x97, 0x33, 0x20, 0x01, 0x31 };
24. uint8_t sensor6[8] = { 0x28, 0x64, 0x79, 0x4E, 0x32, 0x20, 0x01, 0x64 };
25. uint8_t sensor7[8] = { 0x28, 0xCD, 0x85, 0x84, 0x33, 0x20, 0x01, 0xA0 };
26.
27.
28. // Anmeldedaten Netzwerk
29. const char* ssid = "Yannick"; // Netzwerkname
30. const char* password = "c3e1439916"; // Netzwerkpasswort
31.
32. ESP8266WebServer server(80);
33.
34. void setup() {
35.
36. Serial.begin(115200);
37. delay(100);
38.
39. sensors.begin();
40.
41. Serial.println("Connecting to ");
42. Serial.println(ssid);
43.
44. // Netzwerkverbindung herstellen
45. WiFi.begin(ssid, password);
46.
47. // Netzwerkverbindung überprüfen
48. while (WiFi.status() != WL_CONNECTED) {
49. delay(1000);
50. Serial.print(".");
51. }
52.
53. Serial.println("");
54. Serial.println("WiFi connected..!");
55. Serial.print("Got IP: "); Serial.println(WiFi.localIP());
56.
57. server.on("/", handle_OnConnect);
58. server.onNotFound(handle_NotFound);
59.
60. server.begin();
61. Serial.println("HTTP server started");
62. }
63.
64.
65. void loop() {
66.
67. server.handleClient();
68. }
69.
70. void handle_OnConnect() {
71.
72. sensors.requestTemperatures();
73. tempSensor1 = sensors.getTempC(sensor1);
74. tempSensor2 = sensors.getTempC(sensor2);
75. tempSensor3 = sensors.getTempC(sensor3);
76. tempSensor4 = sensors.getTempC(sensor4);
77. tempSensor5 = sensors.getTempC(sensor5);
78. tempSensor6 = sensors.getTempC(sensor6);
79. server.send(200, "text/html", SendHTML(tempSensor1, tempSensor2, tempSensor3, tempSensor4, tempSensor5, tempSensor6));
80. }
81.
82.
83. void handle_NotFound() {
84.
85. server.send(404, "text/plain", "Not found");
86. }
87.
88. // HTML Start
89. String SendHTML(float tempSensor1, float tempSensor2, float tempSensor3, float tempSensor4, float tempSensor5, float tempSensor6 ) {
90. String ptr = "<!DOCTYPE html> <html>\n";
91. ptr += "<head><meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, user-scalable=no\">\n";
92. ptr += "<title>Temperaturanzeige Technikerarbeit</title>\n";
93. ptr += "<style>html { font-family: Helvetica; display: inline-block; margin: 0px auto; text-align: center;}\n";
94.
95. // Schriftarten, Schriftgröße, Schriftfarbe
96. ptr += "body{margin-top: 50px;} h1 {color: #F29C1F;margin: 50px auto 30px;}\n";
97. ptr += "p {font-size: 24px;color: #444444;margin-bottom: 10px;}\n";
98. ptr += "r {font-size: 24px;color: #FF0000;margin-bottom: 10px;}\n";
99. ptr += "a {font-size: 12px;color: #0000Cd;margin-bottom: 10px;}\n";
100. ptr += "</style>\n";
101.
102. // Webseitenaktualisierung
103. ptr += "<script>\n";
104. ptr += "setInterval(loadDoc,100);\n";
105. ptr += "function loadDoc() {\n";
106. ptr += "var xhttp = new XMLHttpRequest();\n";
107. ptr += "xhttp.onreadystatechange = function() {\n";
108. ptr += "if (this.readyState == 4 && this.status == 200) {\n";
109. ptr += "document.body.innerHTML =this.responseText}\n";
110. ptr += "};\n";
111. ptr += "xhttp.open(\"GET\", \"/\", true);\n";
112. ptr += "xhttp.send();\n";
113. ptr += "}\n";
114. ptr += "</script>\n";
115.
116. // Überschrift
117. ptr += "</head>\n";
118. ptr += "<body>\n";
119. ptr += "<div id=\"webpage\">\n";
120. ptr += "<h1>Temperaturanzeige</h1>\n";
121.
122. // Symbol Thermometer
123. ptr += "<svg enable-background='new 0 0 19.438 54.003'height=35.003px id=Layer_1 version=1.1 viewBox='0 0 19.438 54.003'width=19.000px x=0px xml:space=preserve xmlns=http://www.w3.org/2000/svg xmlns:xlink=http://www.w3.org/1999/xlink y=0px><g><path d='M11.976,8.82v-2h4.084V6.063C16.06,2.715,13.345,0,9.996,0H9.313C5.965,0,3.252,2.715,3.252,6.063v30.982";
124. ptr += "C1.261,38.825,0,41.403,0,44.286c0,5.367,4.351,9.718,9.719,9.718c5.368,0,9.719-4.351,9.719-9.718";
125. ptr += "c0-2.943-1.312-5.574-3.378-7.355V18.436h-3.914v-2h3.914v-2.808h-4.084v-2h4.084V8.82H11.976z M15.302,44.833";
126. ptr += "c0,3.083-2.5,5.583-5.583,5.583s-5.583-2.5-5.583-5.583c0-2.279,1.368-4.236,3.326-5.104V24.257C7.462,23.01,8.472,22,9.719,22";
127. ptr += "s2.257,1.01,2.257,2.257V39.73C13.934,40.597,15.302,42.554,15.302,44.833z'fill=#F29C21 /></g></svg>";
128.
129. // Text Liveddaten
130. ptr += "<br>";
131. ptr += "<br>";
132. ptr += "<r><strong>Livedaten!</strong>";
133.
134. // Zeile Sensor 1
135. ptr += "<p>Sensor 1: ";
136. ptr += tempSensor1;
137. ptr += "°C</p>";
138.
139. // Zeile Sensor 2
140. ptr += "<p>Sensor 2: ";
141. ptr += tempSensor2;
142. ptr += "°C</p>";
143.
144. // Zeile Sensor 3
145. ptr += "<p>Sensor 3: ";
146. ptr += tempSensor3;
147. ptr += "°C</p>";
148.
149. // Zeile Sensor 4
150. ptr += "<p>Sensor 4: ";
151. ptr += tempSensor4;
152. ptr += "°C</p>";
153.
154. // Zeile Sensor 5
155. ptr += "<p>Sensor 5: ";
156. ptr += tempSensor5;
157. ptr += "°C</p>";
158.
159. // Zeile Sensor 6
160. ptr += "<p>Sensor 6: ";
161. ptr += tempSensor6;
162. ptr += "°C</p>";
163.
164. // Absatz
165. ptr += "<br>";
166. ptr += "<br>";
167.
168. // Text
169. ptr += "<a>Technikerarbeit von";
170. ptr += "<a> Yannick Bodemer";
171.
172. ptr += "</div>\n";
173. ptr += "</body>\n";
174. ptr += "</html>
2. #include <OneWire.h>
3. #include <DallasTemperature.h>
4.
5.
6. // Dateneingangspin D2 am ESP8266
7. #define ONE_WIRE_BUS D2
8.
9.
10. // oneWire-Instanz für Kommunikation mit OneWire-Geräten
11. OneWire oneWire(ONE_WIRE_BUS);
12.
13. // Verweis auf oneWire
14. DallasTemperature sensors(&oneWire);
15.
16.
17. float tempSensor1, tempSensor2, tempSensor3, tempSensor4, tempSensor5, tempSensor6;
18.
19. uint8_t sensor1[8] = { 0x28, 0x9C, 0x41, 0x53, 0x32, 0x20, 0x01, 0xA8 };
20. uint8_t sensor2[8] = { 0x28, 0xEE, 0x25, 0x67, 0x32, 0x20, 0x01, 0x16 };
21. uint8_t sensor3[8] = { 0x28, 0xD9, 0xCB, 0x70, 0x32, 0x20, 0x01, 0xB8 };
22. uint8_t sensor4[8] = { 0x28, 0xA7, 0xB1, 0x71, 0x32, 0x20, 0x01, 0x6C };
23. uint8_t sensor5[8] = { 0x28, 0x60, 0xDB, 0x97, 0x33, 0x20, 0x01, 0x31 };
24. uint8_t sensor6[8] = { 0x28, 0x64, 0x79, 0x4E, 0x32, 0x20, 0x01, 0x64 };
25. uint8_t sensor7[8] = { 0x28, 0xCD, 0x85, 0x84, 0x33, 0x20, 0x01, 0xA0 };
26.
27.
28. // Anmeldedaten Netzwerk
29. const char* ssid = "Yannick"; // Netzwerkname
30. const char* password = "c3e1439916"; // Netzwerkpasswort
31.
32. ESP8266WebServer server(80);
33.
34. void setup() {
35.
36. Serial.begin(115200);
37. delay(100);
38.
39. sensors.begin();
40.
41. Serial.println("Connecting to ");
42. Serial.println(ssid);
43.
44. // Netzwerkverbindung herstellen
45. WiFi.begin(ssid, password);
46.
47. // Netzwerkverbindung überprüfen
48. while (WiFi.status() != WL_CONNECTED) {
49. delay(1000);
50. Serial.print(".");
51. }
52.
53. Serial.println("");
54. Serial.println("WiFi connected..!");
55. Serial.print("Got IP: "); Serial.println(WiFi.localIP());
56.
57. server.on("/", handle_OnConnect);
58. server.onNotFound(handle_NotFound);
59.
60. server.begin();
61. Serial.println("HTTP server started");
62. }
63.
64.
65. void loop() {
66.
67. server.handleClient();
68. }
69.
70. void handle_OnConnect() {
71.
72. sensors.requestTemperatures();
73. tempSensor1 = sensors.getTempC(sensor1);
74. tempSensor2 = sensors.getTempC(sensor2);
75. tempSensor3 = sensors.getTempC(sensor3);
76. tempSensor4 = sensors.getTempC(sensor4);
77. tempSensor5 = sensors.getTempC(sensor5);
78. tempSensor6 = sensors.getTempC(sensor6);
79. server.send(200, "text/html", SendHTML(tempSensor1, tempSensor2, tempSensor3, tempSensor4, tempSensor5, tempSensor6));
80. }
81.
82.
83. void handle_NotFound() {
84.
85. server.send(404, "text/plain", "Not found");
86. }
87.
88. // HTML Start
89. String SendHTML(float tempSensor1, float tempSensor2, float tempSensor3, float tempSensor4, float tempSensor5, float tempSensor6 ) {
90. String ptr = "<!DOCTYPE html> <html>\n";
91. ptr += "<head><meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, user-scalable=no\">\n";
92. ptr += "<title>Temperaturanzeige Technikerarbeit</title>\n";
93. ptr += "<style>html { font-family: Helvetica; display: inline-block; margin: 0px auto; text-align: center;}\n";
94.
95. // Schriftarten, Schriftgröße, Schriftfarbe
96. ptr += "body{margin-top: 50px;} h1 {color: #F29C1F;margin: 50px auto 30px;}\n";
97. ptr += "p {font-size: 24px;color: #444444;margin-bottom: 10px;}\n";
98. ptr += "r {font-size: 24px;color: #FF0000;margin-bottom: 10px;}\n";
99. ptr += "a {font-size: 12px;color: #0000Cd;margin-bottom: 10px;}\n";
100. ptr += "</style>\n";
101.
102. // Webseitenaktualisierung
103. ptr += "<script>\n";
104. ptr += "setInterval(loadDoc,100);\n";
105. ptr += "function loadDoc() {\n";
106. ptr += "var xhttp = new XMLHttpRequest();\n";
107. ptr += "xhttp.onreadystatechange = function() {\n";
108. ptr += "if (this.readyState == 4 && this.status == 200) {\n";
109. ptr += "document.body.innerHTML =this.responseText}\n";
110. ptr += "};\n";
111. ptr += "xhttp.open(\"GET\", \"/\", true);\n";
112. ptr += "xhttp.send();\n";
113. ptr += "}\n";
114. ptr += "</script>\n";
115.
116. // Überschrift
117. ptr += "</head>\n";
118. ptr += "<body>\n";
119. ptr += "<div id=\"webpage\">\n";
120. ptr += "<h1>Temperaturanzeige</h1>\n";
121.
122. // Symbol Thermometer
123. ptr += "<svg enable-background='new 0 0 19.438 54.003'height=35.003px id=Layer_1 version=1.1 viewBox='0 0 19.438 54.003'width=19.000px x=0px xml:space=preserve xmlns=http://www.w3.org/2000/svg xmlns:xlink=http://www.w3.org/1999/xlink y=0px><g><path d='M11.976,8.82v-2h4.084V6.063C16.06,2.715,13.345,0,9.996,0H9.313C5.965,0,3.252,2.715,3.252,6.063v30.982";
124. ptr += "C1.261,38.825,0,41.403,0,44.286c0,5.367,4.351,9.718,9.719,9.718c5.368,0,9.719-4.351,9.719-9.718";
125. ptr += "c0-2.943-1.312-5.574-3.378-7.355V18.436h-3.914v-2h3.914v-2.808h-4.084v-2h4.084V8.82H11.976z M15.302,44.833";
126. ptr += "c0,3.083-2.5,5.583-5.583,5.583s-5.583-2.5-5.583-5.583c0-2.279,1.368-4.236,3.326-5.104V24.257C7.462,23.01,8.472,22,9.719,22";
127. ptr += "s2.257,1.01,2.257,2.257V39.73C13.934,40.597,15.302,42.554,15.302,44.833z'fill=#F29C21 /></g></svg>";
128.
129. // Text Liveddaten
130. ptr += "<br>";
131. ptr += "<br>";
132. ptr += "<r><strong>Livedaten!</strong>";
133.
134. // Zeile Sensor 1
135. ptr += "<p>Sensor 1: ";
136. ptr += tempSensor1;
137. ptr += "°C</p>";
138.
139. // Zeile Sensor 2
140. ptr += "<p>Sensor 2: ";
141. ptr += tempSensor2;
142. ptr += "°C</p>";
143.
144. // Zeile Sensor 3
145. ptr += "<p>Sensor 3: ";
146. ptr += tempSensor3;
147. ptr += "°C</p>";
148.
149. // Zeile Sensor 4
150. ptr += "<p>Sensor 4: ";
151. ptr += tempSensor4;
152. ptr += "°C</p>";
153.
154. // Zeile Sensor 5
155. ptr += "<p>Sensor 5: ";
156. ptr += tempSensor5;
157. ptr += "°C</p>";
158.
159. // Zeile Sensor 6
160. ptr += "<p>Sensor 6: ";
161. ptr += tempSensor6;
162. ptr += "°C</p>";
163.
164. // Absatz
165. ptr += "<br>";
166. ptr += "<br>";
167.
168. // Text
169. ptr += "<a>Technikerarbeit von";
170. ptr += "<a> Yannick Bodemer";
171.
172. ptr += "</div>\n";
173. ptr += "</body>\n";
174. ptr += "</html>
175. return ptr;
176. }
176. }