====== Konfigurations-Webseite für WLAN-Einstellungen im EEPROM-Speicher ======

[[uebung:itt11:beispielcode_esp8266|zurück zur Übersicht]]

**Achtung:** Dieses Beispiel besteht aus 2 Dateien, welche beide im Sketch-Ordner liegen müssen.

<code cpp Config_AP.ino>
/*
 * Dieses Beispiel zeigt, wie der EEPROM-Speicher dazu verwendet werden kann, 
 * Zugangsdaten für die WiFi-Verbindung variabel zu speichern und bei Bedarf
 * zu ändern, ohne dass die Firmware neu geflasht werden muss.
 * Zu diesem Zweck versucht sich der Microcontroller zu einem fest vorgegebenen
 * Konfigurations-Hotspot zu verbinden. Wenn dieser auffindbar ist, startet er
 * die Konfigurations-Webseite und lässt sich konfigurieren. Wenn die Verbindung
 * fehlschlägt, startet der Microcontroller ganz normal. Die Wartezeit für den
 * Hotspot beträgt bei diesem Beispiel 5 Sekunden (10 * 500ms).
 *
 * Der HTML-Code für die Webseite befindet sich in der Datei strings.h, diese darf
 * nicht fehlen.
 */

#include <ESP8266WiFi.h>
#include <EEPROM.h>
#include <ESP8266WebServer.h>

#include "strings.h"


// PP-Direktiven
#define EEPROM_SIZE 512
#define SSID_SIZE 32
#define SSID_ADDR 0
#define PASS_SIZE 64
#define PASS_ADDR 32


// forward declarations
void readEEPROMwifi(char *ssid, char *passphrase);
void writeEEPROMwifi(char *ssid, char *passphrase);
void handleRoot();
void handleSetWifi();
void handleReset();

// Konstanten
const char* cssid = "configAP"; // Access Point-SSID für den Konfigurationsmodus
const char* cpassword = "configPassphrase"; // Kennwort für den AP im Konfigurationsmodus
const char* hostname = "myMicrocontroller";
char ssid[SSID_SIZE];
char password[PASS_SIZE];


// Variablen
ESP8266WebServer server(80); // Instanz für den Konfigurations-Webserver
bool configMode = false;


/**
 * Setup
 */
void setup() {
  Serial.begin(115200);
  Serial.setDebugOutput(true);
  Serial.println();

  /* ******** config mode ******** */
  Serial.println("Trying config mode, searching for config AP");

  WiFi.begin(cssid, cpassword);
  WiFi.setHostname(hostname);

  int configCount = 0;
  while (WiFi.status() != WL_CONNECTED && configCount < 10) {
    delay(500);
    configCount++;
    Serial.print(".");
  }
  Serial.println("");
  if (WiFi.status() != WL_CONNECTED)
  {
    Serial.println("Skipping config Mode");
  }
  else
  {
    Serial.println("WiFi connected to config AP");
    Serial.print("Use 'http://");
    Serial.print(WiFi.localIP());
    Serial.println("' to connect");
    configMode = true;
  }

  server.on("/", handleRoot);
  server.on("/setwifi", handleSetWifi);
  server.on("/reset", handleReset);
  server.begin();

  if (configMode)
  {
    return;
  }
  
  /* ******** no config mode ******** */

  /* WiFi connection */
  readEEPROMwifi(ssid, password);
  
  Serial.print("Connecting to ");
  Serial.print(ssid);
  Serial.print(" using ");
  Serial.println(password);

  WiFi.begin(ssid, password);
  WiFi.setHostname(hostname);

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


/**
  Loop
  */
void loop() {
  if (configMode)
  {
    server.handleClient();
  }
  else
  {
    Serial.println("Faul sein ist wunderschön, denn die Arbeit hat noch Zeit. (Pipi Langstrumpf)");
	delay(5000);
  }
}


/**
  * read ssid and passphrase from eeprom and write into given char arrays
  */
void readEEPROMwifi(char *ssid, char *passphrase)
{
  EEPROM.begin(EEPROM_SIZE);
  // read ssid from eeprom
  for (int i = 0; i < SSID_SIZE; i++)
  {
    ssid[i] = char(EEPROM.read(SSID_ADDR + i));
  }
  // read passphrase from eeprom
  for (int i = 0; i < PASS_SIZE; i++)
  {
    passphrase[i] = char(EEPROM.read(PASS_ADDR + i));
  }
  // end eeprom access
  EEPROM.end();
}

/**
  * write given ssid and passphrase into corresponding eeprom space
  */
void writeEEPROMwifi(char *ssid, char *passphrase)
{
  EEPROM.begin(EEPROM_SIZE);
  // write ssid to eeprom
  for (int i = 0; i < SSID_SIZE; i++)
  {
    EEPROM.write(SSID_ADDR + i, ssid[i]);
  }
  // write passphrase to eeprom
  for (int i = 0; i < PASS_SIZE; i++)
  {
    EEPROM.write(PASS_ADDR + i, passphrase[i]);
  }
  // commit write and end access
  EEPROM.commit();
  EEPROM.end();
}

/**
  * handle GET request for root page access
  */
void handleRoot()
{
  server.send(200, "text/html", sRootPage);
}

/**
  * handle request for set wifi action
  */
void handleSetWifi()
{
  String ssid_str = server.arg("ssid");
  String passphrase_str = server.arg("passphrase");
  char ssid[SSID_SIZE];
  char passphrase[PASS_SIZE];
  ssid_str.toCharArray(ssid, SSID_SIZE);
  passphrase_str.toCharArray(passphrase, PASS_SIZE);
  writeEEPROMwifi(ssid, passphrase);
  server.send(200, "text/html", sSetWifiHandler);
  readEEPROMwifi(ssid, passphrase);
}

/**
 * handle request for reset
 * */
void handleReset()
{
  server.send(200, "text/plain", "rebooting");
  delay(500);
  ESP.restart();
}
</code>

<code cpp strings.h>
#pragma once

String sRootPage = "<!DOCTYPE html>\r\n\
<html>\r\n\
<head>\r\n\
<meta charset=utf-8>\r\n\
<meta name=viewport content=width='device-width, initial-scale=1'>\r\n\
<title>Login Form</title>\r\n\
<style>\r\n\
body {\r\n\
font-family: sans-serif;\r\n\
}\r\n\
div.section {\r\n\
margin: 32px 0;\r\n\
}\r\n\
hr {\r\n\
width: 50%;\r\n\
color: #002260;\r\n\
}\r\n\
h1, h2 {\r\n\
color: #002260;\r\n\
}\r\n\
h2 {\r\n\
font-weight: normal;\r\n\
font-size: large;\r\n\
}\r\n\
label, input[type=submit] {\r\n\
display: block;\r\n\
margin: 10px 0;\r\n\
}\r\n\
input[type=text], input[type=password] {\r\n\
width: 100%;\r\n\
padding: 8px 8px;\r\n\
margin: 8px 0;\r\n\
box-sizing: border-box;\r\n\
border: 1px solid #ccc;\r\n\
border-radius: 4px;\r\n\
}\r\n\
input[type=submit] {\r\n\
width: 100%;\r\n\
background-color: #0047ab;\r\n\
color: white;\r\n\
padding: 8px 8px;\r\n\
margin: 4px 0;\r\n\
border: none;\r\n\
border-radius: 4px;\r\n\
cursor: pointer;\r\n\
}\r\n\
form {\r\n\
width: 30%;\r\n\
margin: 0 auto;\r\n\
text-align: left;\r\n\
}\r\n\
</style>\r\n\
</head>\r\n\
<body>\r\n\
<h1>Konfiguration</h1>\r\n\
<div id=wifi class=section>\r\n\
<h2>WiFi-Zugangsdaten festlegen</h2>\r\n\
<p><form method=GET action=setwifi>\r\n\
<label for=ssid>SSID:</label>\r\n\
<input name=ssid id=ssid length=32 type=text /><br />\r\n\
<label for=passphrase>Passphrase:</label>\r\n\
<input name=passphrase id=passphrase length=64 type=password /><br />\r\n\
<input type=submit value=festlegen>\r\n\
</form></p>\r\n\
</div><hr />\r\n\
<div id=reset class=section>\r\n\
<h2>Controller neu starten</h2>\r\n\
<p><form method=GET action=/reset>\r\n\
<input type=submit value=Neustart />\r\n\
</form></p>\r\n\
</div>\r\n\
</body>\r\n\
</html>\r\n";

String sSetWifiHandler = "<h1>WiFi-Konfiguration</h1>\r\n\
<p>WiFi-Einstellungen wurden gespeichert. F&uuml;r weitere Einstellungen <a href=\"/\">zur&uuml;ck</a>.<br />\r\n\
Zum Aktivieren der Einstellungen bitte <a href=\"/reset\">neu starten</a> und Access Point deaktivieren.</p>\r\n";
</code>