Ampel mit Wemos D1 und WiFi schalten (Lösung) – Projekte für Arduino und ESP32-Mikrocontroller

Für die Darstellung im Browser ist in den Zeile 149 und 160 eine Änderung nötig:

ü -> ü

#include "ESP8266WebServer.h"
 
int ROT = D7;
int GELB = D6;
int GRUEN = D5;

// Router: Name des Routers
// Passwort: WLAN-Passwort
char Router[] = "Router_SSID";
char Passwort[] = "xxxxxxxx";

// festeIP = false -> IP-Adresse über DHCP vergeben
// festeIP = true -> IP Gateway und Subnetz festlegen
bool festeIP = false;

// IP, Gateway und Subnetz festlegen
IPAddress ip(192,168,1,200);
IPAddress gateway(192,168,1,1);
IPAddress subnet(255,255,255,0);
 
WiFiServer Server(80);
WiFiClient Client;

void setup()
{
  Serial.begin(9600);
  pinMode(ROT, OUTPUT);
  pinMode(GELB, OUTPUT);
  pinMode(GRUEN, OUTPUT);

  // WiFi starten
  WiFi.begin(Router, Passwort);

  if (festeIP) WiFi.config(ip, gateway, subnet);

  // verbinden
  while(WiFi.status() != WL_CONNECTED)
  {
    delay(500); 
    Serial.print(".");
  }
  Server.begin();

  // IP des Servers/des verbunden Computers anzeigen
  Serial.print("Server: ");
  Serial.println(WiFi.SSID());

  // IP des Arduinos anzeigen
   if (festeIP) Serial.print("Statische IP Adresse: ");
  else Serial.print("IP Adresse DHCP: ");
  Serial.println(WiFi.localIP());
}

void loop()
{
  // auf Clienten warten ...
  Client = Server.available();
  if (Client)
  {
    String SchaltungLesen;

    // solange der Client verbunden ist ...
    while (Client.connected())
    {
      if (Client.available())
      {
        // Anforderung vom Clienten lesen ...
        char Zeichen = Client.read();

        // return (\n) gesendet
        if (Zeichen == '\n')
        {
          // wenn der String SchaltungLesen leer ist
          if (SchaltungLesen == "")
          {
            /*
              HTML-Seite aufbauen
              die folgenden Anweisungen müssen
              mit print oder println gesendet werden
              println "verschönert" den Quelltext
              (erzeugt einen Zeilenumbruch im Quelltext)
              " müssen mit \ maskiert werden " -> \"
            */
            // HTML-Seite aufbauen
            Client.println("HTTP/1.1 200 OK");
            Client.println("Content-type:text/html");

            // Leerzeile zwingend erforderlich
            Client.println();
            Client.println(F("<!doctype html>"));
            Client.println(F("<html>"));
            Client.println(F("<body>"));
            Client.println(F("<h2>Ampel mit WiFi schalten</h2>"));
            Client.println(F("<hr />"));
            Client.println(F("<table><tr>"));

            // Button rot ein
            Client.print(F("<td><input style='font-size:14pt;"));
            Client.print(F("font-weight:bold;"));
            Client.print(F(" background-color:#FF6565;"));
            Client.print(F(" width:200px; cursor:pointer;"));
            Client.print(F(" border-radius:5px;border: 2px solid black;'"));
            Client.print(F(" type='button'"));
            Client.println(F(" onClick =\"location.href='RotEin'\""));
            Client.println(F(" value='rot einschalten'>"));
            Client.println(F("</td>"));

            // Button rot aus
            Client.print(F("<td><input style='font-size:14pt;"));
            Client.print(F("font-weight:bold;"));
            Client.print(F(" background-color:white;"));
            Client.print(F(" width:200px; cursor:pointer;"));
            Client.print(F(" border-radius:5px;border: 2px solid black;'"));
            Client.print(F(" type='button'"));
            Client.println(F(" onClick =\"location.href='RotAus'\""));
            Client.println(F(" value='rot ausschalten'>"));
            Client.println(F("</td></tr>"));

            // Button gelb ein
            Client.print(F("<td><input style='font-size:14pt;"));
            Client.print(F("font-weight:bold;"));
            Client.print(F(" background-color:#FFFB65;"));
            Client.print(F(" width:200px; cursor:pointer;"));
            Client.print(F(" border-radius:5px;border: 2px solid black;'"));
            Client.print(F(" type='button'"));
            Client.println(F(" onClick =\"location.href='GelbEin'\""));
            Client.println(F(" value='gelb einschalten'>"));
            Client.println(F("</td>"));

            // Button gelb aus
            Client.print(F("<td><input style='font-size:14pt;"));
            Client.print(F("font-weight:bold;"));
            Client.print(F(" background-color:white;"));
            Client.print(F(" width:200px; cursor:pointer;"));
            Client.print(F(" border-radius:5px;border: 2px solid black;'"));
            Client.print(F(" type='button'"));
            Client.println(F(" onClick =\"location.href='GelbAus'\""));
            Client.println(F(" value='gelb ausschalten'>"));
            Client.println(F("</td></tr>"));

            // Button grün ein
            Client.print(F("<td><input style='font-size:14pt;"));
            Client.print(F("font-weight:bold;"));
            Client.print(F(" background-color:#76FA5F;"));
            Client.print(F(" width:200px; cursor:pointer;"));
            Client.print(F(" border-radius:5px;border: 2px solid black;'"));
            Client.print(F(" type='button'"));
            Client.println(F(" onClick =\"location.href='GruenEin'\""));
            Client.println(F(" value='grün einschalten'>"));
            Client.println(F("</td>"));

            // Button grün aus
            Client.print(F("<td><input style='font-size:14pt;"));
            Client.print(F("font-weight:bold;"));
            Client.print(F(" background-color:white;"));
            Client.print(F(" width:200px; cursor:pointer;"));
            Client.print(F(" border-radius:5px;border: 2px solid black;'"));
            Client.print(F(" type='button'"));
            Client.println(F(" onClick =\"location.href='GruenAus'\""));
            Client.println(F(" value='grün ausschalten'>"));
            Client.println(F("</td></tr>"));
            Client.println(F("</table>"));
            Client.println(F("<hr />"));

            // IPs anzeigen
            Client.print(F("<b>Eigene IP: "));
            Client.print(Client.remoteIP());
            Client.print(F("</b>"));
            Client.print(F("<br><b>IP D1: "));
            Client.print(WiFi.localIP());
            Client.print(F("</b>"));
            Client.println(F("</body>"));
            Client.println(F("</html>"));

            // HTTP-Antwort endet mit neuer Zeile
            Client.println();

            // Seite vollständig geladen -> loop verlassen
            break;
          }

          // wenn SchaltungLesen nicht leer ist -> Inhalt löschen
          else
          {
            SchaltungLesen = "";
          }
        }

        // bei einem anderen Zeichen als return (\r)
        // -> Zeichen dem String SchaltungLesen hinzufügen
        else if (Zeichen != '\r')
        {
          SchaltungLesen += Zeichen;
        }
        // indexOf überprüft, ob die Zeichenfolge im String SchaltungLesen enthalten ist
        if (SchaltungLesen.indexOf("RotEin") > 0) digitalWrite(ROT, HIGH);
        if (SchaltungLesen.indexOf("RotAus") > 0) digitalWrite(ROT, LOW);
        if (SchaltungLesen.indexOf("GelbEin") > 0) digitalWrite(GELB, HIGH);
        if (SchaltungLesen.indexOf("GelbAus") > 0) digitalWrite(GELB, LOW);
        if (SchaltungLesen.indexOf("GruenEin") > 0) digitalWrite(GRUEN, HIGH);
        if (SchaltungLesen.indexOf("GruenAus") > 0) digitalWrite(GRUEN, LOW);
      }
    }
    Client.stop();
  }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

188

189

190

191

192

193

194

195

196

197

198

199

200

201

202

203

204

205

206

#include “ESP8266WebServer.h”

int ROT = D7;

int GELB = D6;

int GRUEN = D5;

// Router: Name des Routers

// Passwort: WLAN-Passwort

char Router[] = “Router_SSID”;

char Passwort[] = “xxxxxxxx”;

// festeIP = false -> IP-Adresse über DHCP vergeben

// festeIP = true -> IP Gateway und Subnetz festlegen

bool festeIP = false;

// IP, Gateway und Subnetz festlegen

IPAddress ip(192,168,1,200);

IPAddress gateway(192,168,1,1);

IPAddress subnet(255,255,255,0);

WiFiServer Server(80);

WiFiClient Client;

void setup()

{

Serial.begin(9600);

pinMode(ROT, OUTPUT);

pinMode(GELB, OUTPUT);

pinMode(GRUEN, OUTPUT);

// WiFi starten

WiFi.begin(Router, Passwort);

if (festeIP) WiFi.config(ip, gateway, subnet);

// verbinden

while(WiFi.status() != WL_CONNECTED)

{

delay(500);

Serial.print(“.”);

}

Server.begin();

// IP des Servers/des verbunden Computers anzeigen

Serial.print(“Server: ”);

Serial.println(WiFi.SSID());

// IP des Arduinos anzeigen

if (festeIP) Serial.print(“Statische IP Adresse: ”);

else Serial.print(“IP Adresse DHCP: ”);

Serial.println(WiFi.localIP());

}

void loop()

{

// auf Clienten warten …

Client = Server.available();

if (Client)

{

String SchaltungLesen;

// solange der Client verbunden ist …

while (Client.connected())

{

if (Client.available())

{

// Anforderung vom Clienten lesen …

char Zeichen = Client.read();

// return (\n) gesendet

if (Zeichen == ‘\n’)

{

// wenn der String SchaltungLesen leer ist

if (SchaltungLesen == “”)

{

HTML-Seite aufbauen

die folgenden Anweisungen müssen

mit print oder println gesendet werden

println “verschönert” den Quelltext

(erzeugt einen Zeilenumbruch im Quelltext)

” müssen mit \ maskiert werden ” -> \”

// HTML-Seite aufbauen

Client.println(“HTTP/1.1 200 OK”);

Client.println(“Content-type:text/html”);

// Leerzeile zwingend erforderlich

Client.println();

Client.println(F(“<!doctype html>”));

Client.println(F(“<html>”));

Client.println(F(“<body>”));

Client.println(F(“<h2>Ampel mit WiFi schalten</h2>”));

Client.println(F(“<hr />”));

Client.println(F(“<table><tr>”));

// Button rot ein

Client.print(F(“<td><input style=‘font-size:14pt;”));

Client.print(F(“font-weight:bold;”));

Client.print(F(“ background-color:#FF6565;”));

Client.print(F(“ width:200px; cursor:pointer;”));

Client.print(F(“ border-radius:5px;border: 2px solid black;‘”));

Client.print(F(“ type=‘button‘”));

Client.println(F(“ onClick =\“location.href=‘RotEin’\“”));

Client.println(F(“ value=‘rot einschalten’>”));

Client.println(F(“</td>”));

// Button rot aus

Client.print(F(“<td><input style=‘font-size:14pt;”));

Client.print(F(“font-weight:bold;”));

Client.print(F(“ background-color:white;”));

Client.print(F(“ width:200px; cursor:pointer;”));

Client.print(F(“ border-radius:5px;border: 2px solid black;‘”));

Client.print(F(“ type=‘button‘”));

Client.println(F(“ onClick =\“location.href=‘RotAus’\“”));

Client.println(F(“ value=‘rot ausschalten’>”));

Client.println(F(“</td></tr>”));

// Button gelb ein

Client.print(F(“<td><input style=‘font-size:14pt;”));

Client.print(F(“font-weight:bold;”));

Client.print(F(“ background-color:#FFFB65;”));

Client.print(F(“ width:200px; cursor:pointer;”));

Client.print(F(“ border-radius:5px;border: 2px solid black;‘”));

Client.print(F(“ type=‘button‘”));

Client.println(F(“ onClick =\“location.href=‘GelbEin’\“”));

Client.println(F(“ value=‘gelb einschalten’>”));

Client.println(F(“</td>”));

// Button gelb aus

Client.print(F(“<td><input style=‘font-size:14pt;”));

Client.print(F(“font-weight:bold;”));

Client.print(F(“ background-color:white;”));

Client.print(F(“ width:200px; cursor:pointer;”));

Client.print(F(“ border-radius:5px;border: 2px solid black;‘”));

Client.print(F(“ type=‘button‘”));

Client.println(F(“ onClick =\“location.href=‘GelbAus’\“”));

Client.println(F(“ value=‘gelb ausschalten’>”));

Client.println(F(“</td></tr>”));

// Button grün ein

Client.print(F(“<td><input style=‘font-size:14pt;”));

Client.print(F(“font-weight:bold;”));

Client.print(F(“ background-color:#76FA5F;”));

Client.print(F(“ width:200px; cursor:pointer;”));

Client.print(F(“ border-radius:5px;border: 2px solid black;‘”));

Client.print(F(“ type=‘button‘”));

Client.println(F(“ onClick =\“location.href=‘GruenEin’\“”));

Client.println(F(“ value=‘grün einschalten’>”));

Client.println(F(“</td>”));

// Button grün aus

Client.print(F(“<td><input style=‘font-size:14pt;”));

Client.print(F(“font-weight:bold;”));

Client.print(F(“ background-color:white;”));

Client.print(F(“ width:200px; cursor:pointer;”));

Client.print(F(“ border-radius:5px;border: 2px solid black;‘”));

Client.print(F(“ type=‘button‘”));

Client.println(F(“ onClick =\“location.href=‘GruenAus’\“”));

Client.println(F(“ value=‘grün ausschalten’>”));

Client.println(F(“</td></tr>”));

Client.println(F(“</table>”));

Client.println(F(“<hr />”));

// IPs anzeigen

Client.print(F(“<b>Eigene IP: ”));

Client.print(Client.remoteIP());

Client.print(F(“</b>”));

Client.print(F(“<br><b>IP D1: ”));

Client.print(WiFi.localIP());

Client.print(F(“</b>”));

Client.println(F(“</body>”));

Client.println(F(“</html>”));

// HTTP-Antwort endet mit neuer Zeile

Client.println();

// Seite vollständig geladen -> loop verlassen

break;

}

// wenn SchaltungLesen nicht leer ist -> Inhalt löschen

else

{

SchaltungLesen = “”;

}

// bei einem anderen Zeichen als return (\r)

// -> Zeichen dem String SchaltungLesen hinzufügen

else if (Zeichen != ‘\r’)

{

SchaltungLesen += Zeichen;

}

// indexOf überprüft, ob die Zeichenfolge im String SchaltungLesen enthalten ist

if (SchaltungLesen.indexOf(“RotEin”) > 0) digitalWrite(ROT, HIGH);

if (SchaltungLesen.indexOf(“RotAus”) > 0) digitalWrite(ROT, LOW);

if (SchaltungLesen.indexOf(“GelbEin”) > 0) digitalWrite(GELB, HIGH);

if (SchaltungLesen.indexOf(“GelbAus”) > 0) digitalWrite(GELB, LOW);

if (SchaltungLesen.indexOf(“GruenEin”) > 0) digitalWrite(GRUEN, HIGH);

if (SchaltungLesen.indexOf(“GruenAus”) > 0) digitalWrite(GRUEN, LOW);

}

Client.stop();

}

Letzte Aktualisierung: Nov. 19, 2025 @ 19:24