How to read Buttonevent from Browser (Webserver)
Posted: Thu Mar 24, 2016 10:19 amHello,
first i wanna say, that I'm new with the Esp8266 and my english is not so well. Usually i program with C and the arduino, so i'm not very comfortable with html and css.
I want to automate my room so i notice the Esp8266. So far i really like it. So my problem is, i dont know how to get a request from the Webserver when i press a button. I try a lot of thinks but i dont get it. If a button is pushed i want to send to my Webserver "buttonname is pressed". I hope anyone can help me and here is my code ( some comments are german and some functions or commands are unnecessary):
greeting Nassim
first i wanna say, that I'm new with the Esp8266 and my english is not so well. Usually i program with C and the arduino, so i'm not very comfortable with html and css.
I want to automate my room so i notice the Esp8266. So far i really like it. So my problem is, i dont know how to get a request from the Webserver when i press a button. I try a lot of thinks but i dont get it. If a button is pushed i want to send to my Webserver "buttonname is pressed". I hope anyone can help me and here is my code ( some comments are german and some functions or commands are unnecessary):
Code: Select all
/*
*
* Style umwandlen mit dem Link http://www.ladyada.net/library/arduino/copyforhtml.html von dort aus in die Funktion gibStyle()
*
*
*
*/
#include <ESP8266WiFi.h>
#include <WiFiClient.h>
#include <ESP8266WebServer.h>
#include <Wire.h>
#include <ESP8266mDNS.h>
bool is_authentified();
void handleLogin();
void handleNotFound();
String gibStyle();// Sendet das Layout zu dem Webserver
int sendeOberflaeche(); // Erstellt die Oberfläche, return ist die gedrückte Taste
//void sendeBefehl(int wahl); //sendet den Ausgewählten Befehl über I2C an Das Gerät Nr.1
//int login(WiFiClient client,const char* nutzer,const char* pw); // Sucht nach den Angegebenen Nutzerdaten in der Loginsendung
void lichtAn();
const char* ssid = "";
const char* password = "";
int wahl; // Gedrueckte Taste speichern
String content="";
//Zugangsdaten
const char* nutzer = "Nassim";
const char* pw = "Nodemcu";
//Geräteadressen
int licht = 1;
int motorRechts = 1;
int motorLinks = 1;
ESP8266WebServer server(80);
void setup(void){
//I2c Bus beitreten als Master
Wire.begin();
// Serieller Monitor
Serial.begin(115200);
WiFi.begin(ssid, password);
// Ins WIFI einwählen
Serial.print("\n\nVerbinden mit dem Netzwerk: ");
Serial.println(ssid);
WiFi.begin(ssid, password);// mit angegebenen Daten einloggen
while (WiFi.status() != WL_CONNECTED) { // während des Verbindens Punkte zum Warten anzeigen
delay(500);
Serial.print(".");
}
Serial.println("\nVerbunden"); // Zeichen für Einwahl
// Signalstärke
long rssi = WiFi.RSSI();
Serial.print("Signalstaerke (RSSI):");
Serial.print(rssi);
Serial.println(" dBm");
// IP für Verbindung ausgeben
Serial.print("Adresse zum Einwaehlen: ");
Serial.print("http://");
Serial.print(WiFi.localIP());
Serial.println("/");
//Logging aufruf Über html beziehung
server.on("/login", handleLogin);
server.on("/datenAnzeigen", [](){
String content;
if (server.hasHeader("User-Agent")){
content += "Userdaten: " + server.header("User-Agent");
}
server.send(200, "text/plain", content);});
server.onNotFound(handleNotFound);//
//here the list of headers to be recorded
const char * headerkeys[] = {"User-Agent","Cookie"} ;
size_t headerkeyssize = sizeof(headerkeys)/sizeof(char*);
//ask server to track these headers
server.collectHeaders(headerkeys, headerkeyssize );
server.begin();
Serial.println("Server Bereit");
//Page Aufruf über ...
server.on("/", sendeOberflaeche);
server.on ("/Licht An",lichtAn);
server.on("/",lichtAn);
}// Ende Setup
void loop(void){
server.handleClient();
}
void lichtAn(){
Serial.println("Licht An");}
int sendeOberflaeche(){
Serial.println("Seite wird geladen");
String header;
if (!is_authentified()){
String header = "HTTP/1.1 301 OK\r\nLocation: /login\r\nCache-Control: no-cache\r\n\r\n";
server.sendContent(header);
return -1;
}
int i=0;
content ="<!DOCTYPE HTML>";
content += "<HEAD>";
content += "<meta name='apple-mobile-web-app-capable' content='yes' />";
content += "<meta name='apple-mobile-web-app-status-bar-style' content='black-translucent' />";
content += "<TITLE>Arduino Steuerung</TITLE>";
content +="<style type=\"text/css\">";
content += gibStyle();
content += "</style>";
content += "</HEAD> <body>";
content += "<H1> Hausautomation </H1>";
content += "<hr /><br />";
content += "<H2> Nassims Zimmer</H2>";
content += " <h3>Licht</h3>";
content += "<form action=\"">;
content += "<input value='einschalten' type = 'button'></form><a href= '?LichtAus'>Licht Aus</a><br />";
content += " <h3>Rollo Rechts</h3>";
content += "<a href=\"?MotorRHoch\"\"> Hoch</a> <a href=\"/?MotorRRunter\"\">Runter</a><br />";
content += " <h3>Rollo Links</h3>";
content += "<a href=\"/?MotorLHoch\"\">Hoch</a> <a href=\"/?MotorLRunter\"\">Runter</a><br />";
content += "<br /> <hr /> <br />";
content += "<a href=\"/login?DISCONNECT=YES\">Ausloggen</a></body></html>";
server.send(200, "text/html", content);
return i;
} // End Oberfläche
//Check if header is present and correct
bool is_authentified(){
Serial.println("Enter is_authentified");
if (server.hasHeader("Cookie")){
Serial.print("Found cookie: ");
String cookie = server.header("Cookie");
Serial.println(cookie);
if (cookie.indexOf("ESPSESSIONID=1") != -1) { //Wenn der Cookie nicht -1 ist ist man eingeloggt
Serial.println("Authentification Successful");
return true;
}
}
Serial.println("Authentification Failed");
return false;
}
//login page, also called for disconnect
void handleLogin(){
String msg;
if (server.hasHeader("Cookie")){ // Wenn der Header ein Cookie hat wird es in der Variable cookie gespeichert
Serial.print("Found cookie: ");
String cookie = server.header("Cookie");
Serial.println(cookie);
}
// Wenn vom Servergesendete Daten Disconnect enthalten Cookie =0 setzen-> ausgeloggt
if (server.hasArg("DISCONNECT")){
Serial.println("Disconnection");
String header = "HTTP/1.1 301 OK\r\nSet-Cookie: ESPSESSIONID=0\r\nLocation: /login\r\nCache-Control: no-cache\r\n\r\n";
server.sendContent(header);
return;
}
if (server.hasArg("USERNAME") && server.hasArg("PASSWORD")){
if (server.arg("USERNAME") == nutzer && server.arg("PASSWORD") == pw ){ // Wenn übereinstimmen, dann Cookie = 1 loging
String header = "HTTP/1.1 301 OK\r\nSet-Cookie: ESPSESSIONID=1\r\nLocation: /\r\nCache-Control: no-cache\r\n\r\n";
server.sendContent(header);
Serial.println("Log in Successful");
return;
}
msg = "Wrong username/password! try again.";
Serial.println("Log in Failed");
}
String content = "<html><body><form action='/login' method='POST'> Benutzerdaten eingeben <br>";
content += "User:<input type='text' name='USERNAME' placeholder='Benutzername'><br>";
content += "Password:<input type='password' name='PASSWORD' placeholder='Passwort'><br>";
content += "<input type='submit' name='Bestaetigen' value='Submit'></form>" + msg + "<br>";
content += "Userdaten <a href='/datenAnzeigen'>anzeigen</a></body></html>";
server.send(200, "text/html", content);
}
//no need authentification
void handleNotFound(){
String message = "File Not Found\n\n";
message += "URI: ";
message += server.uri();
message += "\nMethod: ";
message += (server.method() == HTTP_GET)?"GET":"POST";
message += "\nArguments: ";
message += server.args();
message += "\n";
for (uint8_t i=0; i<server.args(); i++){
message += " " + server.argName(i) + ": " + server.arg(i) + "\n";
}
server.send(404, "text/plain", message);
}
String gibStyle(){
String style = R"=====(a,body,h1,h2{text-align:center}body{margin:60px 0;padding:0}h1,h2{font-family:Arial,\"Trebuchet MS\",Helvetica,sans-serif}a{text-decoration:none;width:75px;height:50px;border-color:#000;border-top:2px solid;border-bottom:2px solid;border-right:2px solid;border-left:2px solid;border-radius:10px;-o-border-radius:10px;-webkit-border-radius:10px;font-family:\"Trebuchet MS\",Arial,Helvetica,sans-serif;-moz-border-radius:10px;background-color:#293F5E;padding:8px}a:active,a:hover,a:link,a:visited{color:#fff})=====";
return style;
}// Ende des Styles
greeting Nassim