Esp 8266 Webserver

Hallo Zusammen

Habe da mal ein parr fragen

Ich moechte gern einen Mega mit einen ESP8266 verbinden
nun weiss Ich nicht wie und wo Ich die Htlm befehle eintragen kann

client.println("");
client.println("");

client.println("<table border=“5” frame=“void” width=“390” >");
client.println("<colgroup span=“6”>");
client.println("<th width=“300” align=“left” >");
client.println("<div style=“font-size:100%; color:#0000FF; font-family:Verdana”>");
client.write(“8 Zirkulation”);
client.println("");
client.println("");

client.println("<th width=“90” >");
client.println("<div style=“font-size:100%; color:#0000FF; font-family:Verdana”>");
client.println(zirkulationtmp,1);

client.println("");
client.println("");

Da stehen zwar die Befehle aber wie werden sie aufgerufen

gibt es da eine Anleitung

#include <ESP8266WiFi.h>
#include <WiFiClient.h>
#include <ESP8266WebServer.h>
#include <ESP8266mDNS.h>

const char *ssid = “YourSSIDHere”;
const char *password = “YourPSKHere”;
MDNSResponder mdns;

ESP8266WebServer server ( 80 );

const int led = 13;

void handleRoot() {
digitalWrite ( led, 1 );
char temp[400];
int sec = millis() / 1000;
int min = sec / 60;
int hr = min / 60;

snprintf ( temp, 400,

"\

\ \ ESP8266 Demo\ \ body { background-color: #cccccc; font-family: Arial, Helvetica, Sans-Serif; Color: #000088; }\ \ \ \

Hello from ESP8266!

\

Uptime: %02d:%02d:%02d

\ \ \ ",

hr, min % 60, sec % 60
);
server.send ( 200, “text/html”, temp );
digitalWrite ( led, 0 );
}

void handleNotFound() {
digitalWrite ( led, 1 );
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 );
digitalWrite ( led, 0 );
}

void setup ( void ) {
pinMode ( led, OUTPUT );
digitalWrite ( led, 0 );
Serial.begin ( 115200 );
WiFi.begin ( ssid, password );
Serial.println ( “” );

// Wait for connection
while ( WiFi.status() != WL_CONNECTED ) {
delay ( 500 );
Serial.print ( “.” );
}

Serial.println ( “” );
Serial.print ( "Connected to " );
Serial.println ( ssid );
Serial.print ( "IP address: " );
Serial.println ( WiFi.localIP() );

if ( mdns.begin ( “esp8266”, WiFi.localIP() ) ) {
Serial.println ( “MDNS responder started” );
}

server.on ( “/”, handleRoot );
server.on ( “/test.svg”, drawGraph );
server.on ( “/inline”, {
server.send ( 200, “text/plain”, “this works as well” );
} );
server.onNotFound ( handleNotFound );
server.begin();
Serial.println ( “HTTP server started” );
}

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

void drawGraph() {
String out = “”;
char temp[100];
out += “<svg xmlns=“SVG namespace” version=“1.1” width=“400” height=“150”>\n”;
out += “<rect width=“400” height=“150” fill=“rgb(250, 230, 210)” stroke-width=“1” stroke=“rgb(0, 0, 0)” />\n”;
out += “<g stroke=“black”>\n”;
int y = rand() % 130;
for (int x = 10; x < 390; x+= 10) {
int y2 = rand() % 130;
sprintf(temp, “<line x1=”%d" y1="%d" x2="%d" y2="%d" stroke-width=“1” />\n", x, 140 - y, x + 10, 140 - y2);
out += temp;
y = y2;
}
out += “\n\n”;

server.send ( 200, “image/svg+xml”, out);
}

bye juergen

Bin unterwegs, deswegen sehr kurz ein Tipp, wenn man sich mit HTML noch nicht besonders auskennt:

Programm zum Webseiten erstellen downloaden (das simpelste was man finden kann), dann in den Texteditiermodus gehen, nachdem man erstellt hat was man möchte.

Dann sieht man die Struktur was / wo von HTML.

Alternative: Auf einer simplen/schrottigen Website Rechtsklick und Debugger bzw. Code betrachten klicken (je nach Browser unterschiedlich).

Wenn man das dann nicht versteht, sollte man sich das Tutorial bei w3c.org durchlesen (www Consortium).

Gruß,
Stefan

Hallo zusammen

Hallo thefreak

Fuer den Arduino habe Ich schon einen Webserver erstellt
aber das war ja mit client.println
jetzt moechte Ich wissen wie das beim ESP8266 geht

wo Ich die Webbefehle eintragen muss

Ich habe mal diesen getestet
Ich moechte gern den Ablauf vertehen
und wo Ich mit

sResponse += “<font color=”#000000"><body bgcolor="#d0d0f0">";

die HTLM befehle eintragen muss

/*--------------------------------------------------
HTTP 1.1 Webserver for ESP8266
for ESP8266 adapted Arduino IDE

Stefan Thesen 04/2015

Running stable for days
(in difference to all samples I tried)

Does HTTP 1.1 with defined connection closing.
Reconnects in case of lost WiFi.
Handles empty requests in a defined manner.
Handle requests for non-exisiting pages correctly.

This demo allows to switch two functions:
Function 1 creates serial output and toggels GPIO2
Function 2 just creates serial output.

Serial output can e.g. be used to steer an attached
Arduino, Raspberry etc.
--------------------------------------------------*/

#include <ESP8266WiFi.h>

const char* ssid = “ALICE-WLAN56”;
const char* password = “8086091123162777”;

unsigned long ulReqcount;
unsigned long ulReconncount;

// Create an instance of the server on Port 80
WiFiServer server(80);

void setup()
{
// setup globals
ulReqcount=0;
ulReconncount=0;

// prepare GPIO2
pinMode(2, OUTPUT);
digitalWrite(2, 0);

// start serial
Serial.begin(115200);
delay(1);

// inital connect
WiFi.mode(WIFI_STA);
WiFiStart();
}

void WiFiStart()
{
ulReconncount++;

// Connect to WiFi network
Serial.println();
Serial.println();
Serial.print("Connecting to ");
Serial.println(ssid);

WiFi.begin(ssid, password);

while (WiFi.status() != WL_CONNECTED) {
delay(500);
Serial.print(".");
}
Serial.println("");
Serial.println(“WiFi connected”);

// Start the server
server.begin();
Serial.println(“Server started”);

// Print the IP address
Serial.println(WiFi.localIP());
}

void loop()
{
// check if WLAN is connected
if (WiFi.status() != WL_CONNECTED)
{
WiFiStart();
}

// Check if a client has connected
WiFiClient client = server.available();
if (!client)
{
return;
}

// Wait until the client sends some data
Serial.println(“new client”);
unsigned long ultimeout = millis()+250;
while(!client.available() && (millis()<ultimeout) )
{
delay(1);
}
if(millis()>ultimeout)
{
Serial.println(“client connection time-out!”);
return;
}

// Read the first line of the request
String sRequest = client.readStringUntil(’\r’);
//Serial.println(sRequest);
client.flush();

// stop client, if request is empty
if(sRequest=="")
{
Serial.println(“empty request! - stopping client”);
client.stop();
return;
}

// get path; end of path is either space or ?
// Syntax is e.g. GET /?pin=MOTOR1STOP HTTP/1.1
String sPath="",sParam="", sCmd="";
String sGetstart=“GET “;
int iStart,iEndSpace,iEndQuest;
iStart = sRequest.indexOf(sGetstart);
if (iStart>=0)
{
iStart+=+sGetstart.length();
iEndSpace = sRequest.indexOf(” “,iStart);
iEndQuest = sRequest.indexOf(”?”,iStart);

// are there parameters?
if(iEndSpace>0)
{
if(iEndQuest>0)
{
// there are parameters
sPath = sRequest.substring(iStart,iEndQuest);
sParam = sRequest.substring(iEndQuest,iEndSpace);
}
else
{
// NO parameters
sPath = sRequest.substring(iStart,iEndSpace);
}
}
}

///////////////////////////////////////////////////////////////////////////////
// output parameters to serial, you may connect e.g. an Arduino and react on it
///////////////////////////////////////////////////////////////////////////////
if(sParam.length()>0)
{
int iEqu=sParam.indexOf("=");
if(iEqu>=0)
{
sCmd = sParam.substring(iEqu+1,sParam.length());
Serial.println(sCmd);
}
}

///////////////////////////
// format the html response
///////////////////////////
String sResponse,sHeader;

////////////////////////////
// 404 for non-matching path
////////////////////////////
if(sPath!="/")
{
sResponse=“404 Not Found

Not Found

The requested URL was not found on this server.

”;

sHeader = “HTTP/1.1 404 Not found\r\n”;
sHeader += “Content-Length: “;
sHeader += sResponse.length();
sHeader += “\r\n”;
sHeader += “Content-Type: text/html\r\n”;
sHeader += “Connection: close\r\n”;
sHeader += “\r\n”;
}
///////////////////////
// format the html page
///////////////////////
else
{
ulReqcount++;
sResponse = “Demo f&uumlr ESP8266 Steuerung”;
sResponse += “<font color=”#000000”><body bgcolor=”#d0d0f0">";
sResponse += “<meta name=“viewport” content=“width=device-width, initial-scale=1.0, user-scalable=yes”>”;
sResponse += “

Demo f&uumlr ESP8266 Steuerung

”;
sResponse += “Funktion 1 schaltet GPIO2 und erzeugt eine serielle Ausgabe.
“;
sResponse += “Funktion 2 erzeugt nur eine serielle Ausgabe.
“;
sResponse += “”;
sResponse += “

Funktion 1 <a href=”?pin=FUNCTION1ON”>einschalten <a href=”?pin=FUNCTION1OFF”>ausschalten

”;
sResponse += “

Funktion 2 <a href=”?pin=FUNCTION2ON">einschalten <a href="?pin=FUNCTION2OFF">ausschalten

";

//////////////////////
// react on parameters
//////////////////////
if (sCmd.length()>0)
{
// write received command to html page
sResponse += “Kommando:” + sCmd + "
";

// switch GPIO
if(sCmd.indexOf(“FUNCTION1ON”)>=0)
{
digitalWrite(2, 1);
}
else if(sCmd.indexOf(“FUNCTION1OFF”)>=0)
{
digitalWrite(2, 0);
}
}

sResponse += “”;
sResponse += "
Aufrufzähler=";
sResponse += ulReqcount;
sResponse += " - Verbindungszähler=";
sResponse += ulReconncount;
sResponse += "
";
sResponse += "Stefan Thesen 04/2015
";
sResponse += “”;

sHeader = “HTTP/1.1 200 OK\r\n”;
sHeader += "Content-Length: ";
sHeader += sResponse.length();
sHeader += “\r\n”;
sHeader += “Content-Type: text/html\r\n”;
sHeader += “Connection: close\r\n”;
sHeader += “\r\n”;
}

// Send the response to the client
client.print(sHeader);
client.print(sResponse);

// and stop the client
client.stop();
Serial.println(“Client disonnected”);
}

Ich danke dir schon mal

bye juergen

Der Code ist auch ein Musterbeispiel für irrsinnige und völlig unnötige Verwendung der String Klasse.

Das ist doch Code für den ESP8266, da ist es doch nicht ganz so eng :slight_smile:

Trotzdem irgendwie Unsinn :slight_smile: Wieso den String erst mal als ganzes in den Speicher schreiben wenn man ihn auch direkt Stück für Stück ausgeben kann?

Wenn man die ganzen Jahre mit dem RAM geizen musste, tut das doch bestimmt mal richtig gut.

Oder der Autor hat es nie anders gelernt

Hallo Zusammen

Hallo ElEspanol

Hallo Serenifly

Habe leider kein Beispiel mit Charstring gefunden
wuerde gerne ein Beispiel mit Charstrings nehmen

bye juergen

Bring es erstmal so zum Laufen.

Später kannst du zur Übung den Sketch umschreiben und die Stringobjekte nach und nach rausprogrammieren.

Ist ne sehr gute Übung. Danach weißt du wesentlich mehr über das Thema char array

Hallo Zusammen

Hallo ElEspanol

Habe ja schon was mit char geamacht

Das beispiel laeuft so wie es ist macht auch die serielle uebertragung zum Mega
wenn Ich die Buttons druecke
Ich weiss nur nicht wo und wie Ich meine HTLM-Befehle eingebe

Eine erklaerung was die einzelne Teile des Demo-Programm machen waere gut

bye juergen

Hallo zusammen

Habe da noch eine Frage

Was bedeuted der Aufruf

server.handleClient();

und was passiert dann

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

bye juergen

juergen01:
Hallo zusammen

Habe da noch eine Frage

Was bedeuted der Aufruf

server.handleClient();

und was passiert dann

Das kann ich dir jetzt auch nicht sagen, ich heb den Code jetzt nicht bis ins Detail analysiert.

Aber in dem von dir gepsoteten Beispiel in Post #2 wird ab

///////////////////////
  // format the html page
  ///////////////////////

in dem String sResponse die HTML Seite zusammengebaut und dann weiter unten mit

// Send the response to the client
  client.print(sHeader);
  client.print(sResponse);

als Antwort verschickt.

Hallo Zusammen

Hallo ElEspanol

Mit deiner letzten Antwort hast Du mir sehr Geholfen

Ich hatte die

client.print(sHeader);
client.print(sResponse);

nicht gesehen jetzt kann Ich schon mal den String
sResponse aus den sketch werfen

der sHeader muss erst eimal bleiben

Ich Danke Dir

bye juergen

Hallo Zusammen

Habe noch eine Frage
gibt es bei den Strings Nicht Chararry eine Laengenbegrenzung
Ich habe mal etwas rumgespielt bei der Laenge von 3000 Byte war Ende

Bye Juergen

Kann sein. Beim Arduino sicherlich abhängig vom RAM, aber beim ESP8266 sollte es nicht deswegen sein.

Wie äussert sich das bei dir?

Und für was brauchst du so lange Texte am Stück?

Hallo Zusammen

Hallo ElEspanol

Ich sende zum client sResponse mit einer laenge von 3040 Byte
er empfaengt aber nur 3030 Byte

der rest wird dann abgeschnitten

der Webserver laeuft mit dem Client sonst sehr gut
trotz String klasse

bye juergen

Geht auch einfach so:

client.print("....");
client.print("....");
client.print("....");

Es gibt keinen Grund weshalb das in einem String stehen muss

Aud dem uC juckt die String Klasse nicht viel. Ist ein anders Kaliber als ein 328

Hallo Zusammen

Hallo ElEspanol

Hallo Serenifly

Ich weis das Ich client.print("....");
nehmen kann

Ich wollte nur wissen ob da bei strings eine Grenze gibt

Habe einen zaehler im loob eingebaut nach 5Sec war er
auf ueber 515000 Durchlaeufen mit dem 3000 Byte String
der alle 5 Sec zum Client sendet

bye juergen

klar, der loopt schnell, wenn er sonst nichts machen muss.

Sende mal die Daten in jedem loop und stoppe die Zeit für einen loop