ESP8266 Community Forum

- Thu Sep 01, 2016 6:51 pm #54290 OK, I think I'm using the right terms. Below is some code I've modified from an Instructables that I can use to control two LEDs via a webpage (this is server mode, right?). However, it requires that the SSID and PW be hard coded and flashed.

I would like to add the AP function, running at the same time, so I can access the ESP and set parameters for the SSID and PW since I have several APs in my environment and will need to be able to change these "on the fly."

If possible, I would also like to change the labels of LED1 and LED2 to the actual appliance they will control using variables entered in the AP mode function. Can anyone point me in the right direction, or help me fill in the code?

I'm thinking the AP side would be a webpage with two buttons... 1 "click to enter SSID and PW" which leads to a page with two input boxes whose strings would be used in the server code setup; and 2 "click to enter Control Labels" which leads to a page with two input boxes to enter labels to replace the LED1 and LED2 labels on the server.

Both pages (SSID/PW config and Labels config) would have a submit button which would enter the variables (parameters) into the server code and restart the ESP so the changes would take effect.

I believe it can be done, I just can't find sample code since I'm not really sure what it's called. It doesn't seem like it should be too hard. Thanks for your help.

(BTW, I left the instructable link commented in the code for those who want to view the original posting.)

Code: Select all/*  See: http://www.instructables.com/id/ESP8266-WiFi-Module-for-Dummies/ for the details on how to set the board up and upload the code to the ESP8266
  Also see: http://www.instructables.com/id/The-Simple-Guide-to-Flashing-Your-ESP8266-Firmware/
*/

// Include the ESP8266 Library. This library is automatically provided by the ESP8266 Board Manager and does not need to be installed manually.
#include <ESP8266WiFi.h>

String codeVersion = "Version 2.0  Lights";

// WiFi Router Login - change these to your router settings
const char* SSID = "MyWifi SSID";
const char* password = "MyPassWord";

// Setup GPIO2
int pinGPIO2 = 2; //To control LED 1
int pinGPIO0 = 0; //To control LED 2
int led1Status = 0; //LED 1 0=off,1=on,2=dimmed
int led2Status = 0; //LED 2 0=off,1=on,2=dimmed

// Create the ESP Web Server on port 80
WiFiServer WebServer(80);
// Web Client
WiFiClient client;

void setup() {
  Serial.begin(115200);
  delay(10);
  Serial.println();
  Serial.println();
  Serial.println(codeVersion);

  // Setup the GPIO2 LED Pin - uses PWM to dim the LED.
  pinMode(pinGPIO2, OUTPUT);
  digitalWrite(pinGPIO2, LOW);
  led1Status = 0;

  // Setup the GPIO0 LED Pin - uses PWM to dim the LED.
  pinMode(pinGPIO0, OUTPUT);
  digitalWrite(pinGPIO0, LOW);
  led2Status = 0;
 
  // Connect to WiFi network
  Serial.println();
  WiFi.disconnect();
  WiFi.mode(WIFI_STA);
  Serial.print("Connecting to ");
  Serial.println(SSID);
  WiFi.begin(SSID, password);

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

  // Start the Web Server
  WebServer.begin();
  Serial.println("Web Server started");

  // Print the IP address
  Serial.print("You can connect to the ESP8266 at this URL: ");
  Serial.print("http://");
  Serial.print(WiFi.localIP());
  Serial.println("/");
}

void loop() {
  // Check if a user has connected
  client = WebServer.available();
  if (!client) {//restart loop
    return;
  }

  // Wait until the user sends some data
  Serial.println("New User");
  while (!client.available()) {
    delay(1);
  }

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

  // Process the request:
  if (request.indexOf("/LED1=ON") != -1) {
    analogWrite(pinGPIO2, 1023);
    led1Status = 1;
  }
  if (request.indexOf("/LED1=OFF") != -1) {
    analogWrite(pinGPIO2, 0);
    led1Status = 0;
  }
  if (request.indexOf("/LED1=DIM") != -1) {
    analogWrite(pinGPIO2, 512);
    led1Status = 2;
  } 
    if (request.indexOf("/LED2=ON") != -1) {
    analogWrite(pinGPIO0, 1023);
    led2Status = 1;
  }
  if (request.indexOf("/LED2=OFF") != -1) {
    analogWrite(pinGPIO0, 0);
    led2Status = 0;
  }
  if (request.indexOf("/LED2=DIM") != -1) {
    analogWrite(pinGPIO0, 512);
    led2Status = 2;
  }

  // Return the response
  client.println("HTTP/1.1 200 OK");
  client.println("Content-Type: text/html; charset=UTF-8");
  client.println("");
  client.println("<!DOCTYPE HTML>");
  client.println("<html>");
  client.println("<head>");
  client.println("<title>Front Lights</title>");
  client.println("</head>");
  client.println("<body>");
  client.println("<a href=\"/\">Refresh Status</a>");
  client.println("</br></br>");

  //check the LED status
  if (led1Status == 0) {
    client.print("LED1 is Off</br>");
    client.println("Turn the LED1 <a href=\"/LED1=ON\">ON</a></br>");
    client.println("Set LED1 to <a href=\"/LED1=DIM\">DIM</a></br>");
  } else if (led1Status == 1) {
    client.print("LED1 is On</br>");
    client.println("Turn the LED1 <a href=\"/LED1=OFF\">OFF</a></br>");
    client.println("Set LED1 to <a href=\"/LED1=DIM\">DIM</a></br>");
  } else if (led1Status == 2) {
    client.print("LED1 is Dimmed</br>");
    client.println("Turn the LED1 <a href=\"/LED1=OFF\">OFF</a></br>");
    client.println("Turn the LED1 <a href=\"/LED1=ON\">ON</a></br>");
  }
  if (led2Status == 0) {
    client.print("LED2 is Off</br>");
    client.println("Turn the LED2 <a href=\"/LED2=ON\">ON</a></br>");
    client.println("Set LED2 to <a href=\"/LED2=DIM\">DIM</a></br>");
  } else if (led2Status == 1) {
    client.print("LED2 is On</br>");
    client.println("Turn the LED2 <a href=\"/LED2=OFF\">OFF</a></br>");
    client.println("Set LED2 to <a href=\"/LED2=DIM\">DIM</a></br>");
  } else if (led2Status == 2) {
    client.print("LED2 is Dimmed</br>");
    client.println("Turn the LED2 <a href=\"/LED2=OFF\">OFF</a></br>");
    client.println("Turn the LED2 <a href=\"/LED2=ON\">ON</a></br>");
  }
  client.println("</br>");
 
  client.println("</br>");
  client.println("</body>");
  client.println("</html>");

  delay(1);
  Serial.println("User disconnected");
  Serial.println("");

}


- Fri Sep 02, 2016 3:09 pm #54339

I would like to add the AP function, running at the same time, so I can access the ESP and set parameters for the SSID and PW since I have several APs in my environment and will need to be able to change these "on the fly."

I use WiFiManager to eliminate the need to put the SSID and password in the source code.

- Fri Sep 02, 2016 4:40 pm #54344

I would like to add the AP function, running at the same time, so I can access the ESP and set parameters for the SSID and PW since I have several APs in my environment and will need to be able to change these "on the fly."

I use WiFiManager to eliminate the need to put the SSID and password in the source code.

Thanks. I looked at the GitHub and this does seem to be what I am looking for. I am planning to use the "AutoConnect with Reset" version. But, I am confused.

It seems I should be putting everything from my original sketch into this one that occurs before the void.setup() with exception of defining the strings for SSID and password? Or do I leave out the parts about setting up WebServer(80) and Wifi lient as well?

Original Sketch:

Code: Select allString codeVersion = "Version 2.0  Lights";

// WiFi Router Login - change these to your router settings
const char* SSID = "MyWifi";
const char* password = "MyPassword";

// Setup GPIO2 and GPIO0
int pinGPIO2 = 2; //To control LED1
int pinGPIO0 = 0; //To control LED2
int led1Status = 0; //LED 1 0=off,1=on,2=dimmed
int led2Status = 0; //LED 2 0=off,1=on,2=dimmed

// Create the ESP Web Server on port 80
WiFiServer WebServer(80);
// Web Client
WiFiClient client;

In the void.setup() it is commented to "// put your setup code here, to run once:" I don't understand what code I should be putting there.

Wifi Manager Sketch:

Code: Select allvoid setup() {
  // put your setup code here, to run once:
  Serial.begin(115200);
  Serial.println();

  //WiFiManager
  //Local intialization. Once its business is done, there is no need to keep it around
  WiFiManager wifiManager;

  //exit after config instead of connecting
  wifiManager.setBreakAfterConfig(true);

  //reset settings - for testing
  //wifiManager.resetSettings();


  //tries to connect to last known settings
  //if it does not connect it starts an access point with the specified name
  //here  "AutoConnectAP" with password "password"
  //and goes into a blocking loop awaiting configuration
  if (!wifiManager.autoConnect("AutoConnectAP", "password")) {
    Serial.println("failed to connect, we should reset as see if it connects");
    delay(3000);
    ESP.reset();
    delay(5000);
  }

  //if you get here you have connected to the WiFi
  Serial.println("connected...yeey :)");


  Serial.println("local ip");
  Serial.println(WiFi.localIP());
}

Is that where I put all of the code from my original sketch that sets up the server, station, and GPIO pins? (ie: above all of the code already there?)
Or, is that where I put the code that sets up my GPIO pins only and the Wifi Manager library takes care of setting up the server and station?

Original Sketch:

Code: Select all Serial.begin(115200);
  delay(10);
  Serial.println();
  Serial.println();
  Serial.println(codeVersion);

  // Setup the GPIO2 LED Pin - uses PWM to dim the LED.
  pinMode(pinGPIO2, OUTPUT);
  digitalWrite(pinGPIO2, LOW);
  led1Status = 0;

  // Setup the GPIO0 LED Pin - uses PWM to dim the LED.
  pinMode(pinGPIO0, OUTPUT);
  digitalWrite(pinGPIO0, LOW);
  led2Status = 0;
 
  // Connect to WiFi network
  Serial.println();
  WiFi.disconnect();
  WiFi.mode(WIFI_STA);
  Serial.print("Connecting to ");
  Serial.println(SSID);
  WiFi.begin(SSID, password);

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

  // Start the Web Server
  WebServer.begin();
  Serial.println("Web Server started");

  // Print the IP address
  Serial.print("You can connect to the ESP8266 at this URL: ");
  Serial.print("http://");
  Serial.print(WiFi.localIP());
  Serial.println("/");
}


Thanks!
And the, I understand that I put all of my original void.loop() code into the Wifi Manager sketch.

Really, I just don't understand how to merger the two sets of code together.

- Sun Sep 04, 2016 9:40 am #54441 So I took my best stab at merging the sketches. The wifi manager does what it is supposed to... boots in AP mode, if necessary, let's me enter credentials, then restarts in server mode and successfully connects to my network.

I can ping the ip and get a response, but when I try to go to the http site, I get a page cannot be found error. I've missed something, but I don't know what. The server does not seem to work as a web_station client(?)

Here is the sketch I loaded. Any thoughts are appreciated. Thanks.

Code: Select all#include <FS.h>                   //this needs to be first, or it all crashes and burns...

#include <ESP8266WiFi.h>          //https://github.com/esp8266/Arduino

//needed for library
#include <DNSServer.h>
#include <ESP8266WebServer.h>
#include <WiFiManager.h>          //https://github.com/tzapu/WiFiManager

//These lines are from the LED sketch and many are commented out here.
//I left them here for reference.

String codeVersion = "Version 2.0  Lights";

// // WiFi Router Login - change these to your router settings
//const char* SSID = "MY-SSID";
//const char* password = "MY-PASSWORD";

// Setup GPIO2 and GPIO0
int pinGPIO2 = 2; //To control LED1
int pinGPIO0 = 0; //To control LED2
int led1Status = 0; //LED 1 0=off,1=on,2=dimmed
int led2Status = 0; //LED 2 0=off,1=on,2=dimmed

// Create the ESP Web Server on port 80
 WiFiServer WebServer(80);
// Web Client
 WiFiClient client;

void setup() {
//These first lines are from LED server sketch.
  // put your setup code here, to run once:
  Serial.begin(115200);
  Serial.println();
  Serial.println();
  Serial.println(codeVersion);

  // Setup the GPIO2 LED Pin - uses PWM to dim the LED.
  pinMode(pinGPIO2, OUTPUT);
  digitalWrite(pinGPIO2, LOW);
  led1Status = 0;

  // Setup the GPIO0 LED Pin - uses PWM to dim the LED.
  pinMode(pinGPIO0, OUTPUT);
  digitalWrite(pinGPIO0, LOW);
  led2Status = 0;

//These lines are from wifi manager sketch.
  //WiFiManager
  //Local intialization. Once its business is done, there is no need to keep it around
  WiFiManager wifiManager;

  //exit after config instead of connecting
  wifiManager.setBreakAfterConfig(true);

  //reset settings - for testing
  wifiManager.resetSettings();


  //tries to connect to last known settings
  //if it does not connect it starts an access point with the specified name
  //here  "AutoConnectAP" with password "Reilly.70"
  //and goes into a blocking loop awaiting configuration
  if (!wifiManager.autoConnect("AutoConnectAP", "password")) {
    Serial.println("failed to connect, we should reset as see if it connects");
    delay(3000);
    ESP.reset();
    delay(5000);
  }

  //if you get here you have connected to the WiFi
  Serial.println("connected...yeey :)");


  Serial.println("local ip");
  Serial.println(WiFi.localIP());

//The rest of the void setup is from LED server sketch.
//I have commented it all out for now.
//I think this is the section where I have made mistakes and need help.

//  // Connect to WiFi network
//  Serial.println();
//  WiFi.disconnect();
//  WiFi.mode(WIFI_STA);
//  Serial.print("Connecting to ");
//  Serial.println(SSID);
//  WiFi.begin(SSID, password);

//  while (WiFi.status() != WL_CONNECTED) {
//    delay(500);
//    Serial.print(".");
//  }
//  Serial.println("");
//  Serial.println("Connected to WiFi");

//  // Start the Web Server
//  WebServer.begin();
//  Serial.println("Web Server started");

//  // Print the IP address
//  Serial.print("You can connect to the ESP8266 at this URL: ");
//  Serial.print("http://");
//  Serial.print(WiFi.localIP());
//  Serial.println("/");
}

void loop() {
//The entire void loop is copied from LED server without any changes.
 
  // put your main code here, to run repeatedly:  // Check if a user has connected
  client = WebServer.available();
  if (!client) {//restart loop
    return;
  }

  // Wait until the user sends some data
  Serial.println("New User");
  while (!client.available()) {
    delay(1);
  }

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

  // Process the request:
  if (request.indexOf("/LED1=ON") != -1) {
    analogWrite(pinGPIO2, 1023);
    led1Status = 1;
  }
  if (request.indexOf("/LED1=OFF") != -1) {
    analogWrite(pinGPIO2, 0);
    led1Status = 0;
  }
  if (request.indexOf("/LED1=DIM") != -1) {
    analogWrite(pinGPIO2, 512);
    led1Status = 2;
  } 
    if (request.indexOf("/LED2=ON") != -1) {
    analogWrite(pinGPIO0, 1023);
    led2Status = 1;
  }
  if (request.indexOf("/LED2=OFF") != -1) {
    analogWrite(pinGPIO0, 0);
    led2Status = 0;
  }
  if (request.indexOf("/LED2=DIM") != -1) {
    analogWrite(pinGPIO0, 512);
    led2Status = 2;
  }

  // Return the response
  client.println("HTTP/1.1 200 OK");
  client.println("Content-Type: text/html; charset=UTF-8");
  client.println("");
  client.println("<!DOCTYPE HTML>");
  client.println("<html>");
  client.println("<head>");
  client.println("<title>Front Lights</title>");
  client.println("</head>");
  client.println("<body>");
  client.println("<a href=\"/\">Refresh Status</a>");
  client.println("</br></br>");

  //check the LED status
  if (led1Status == 0) {
    client.print("LED1 is Off</br>");
    client.println("Turn the LED1 <a href=\"/LED1=ON\">ON</a></br>");
    client.println("Set LED1 to <a href=\"/LED1=DIM\">DIM</a></br>");
  } else if (led1Status == 1) {
    client.print("LED1 is On</br>");
    client.println("Turn the LED1 <a href=\"/LED1=OFF\">OFF</a></br>");
    client.println("Set LED1 to <a href=\"/LED1=DIM\">DIM</a></br>");
  } else if (led1Status == 2) {
    client.print("LED1 is Dimmed</br>");
    client.println("Turn the LED1 <a href=\"/LED1=OFF\">OFF</a></br>");
    client.println("Turn the LED1 <a href=\"/LED1=ON\">ON</a></br>");
  }
  if (led2Status == 0) {
    client.print("LED2 is Off</br>");
    client.println("Turn the LED2 <a href=\"/LED2=ON\">ON</a></br>");
    client.println("Set LED2 to <a href=\"/LED2=DIM\">DIM</a></br>");
  } else if (led2Status == 1) {
    client.print("LED2 is On</br>");
    client.println("Turn the LED2 <a href=\"/LED2=OFF\">OFF</a></br>");
    client.println("Set LED2 to <a href=\"/LED2=DIM\">DIM</a></br>");
  } else if (led2Status == 2) {
    client.print("LED2 is Dimmed</br>");
    client.println("Turn the LED2 <a href=\"/LED2=OFF\">OFF</a></br>");
    client.println("Turn the LED2 <a href=\"/LED2=ON\">ON</a></br>");
  }
  client.println("</br>");
 
  client.println("</br>");
  client.println("</body>");
  client.println("</html>");

  delay(1);
  Serial.println("User disconnected");
  Serial.println("");

}


THANKS for helping.