Webserver Demo #5
Comments
ajquick
added
discussion
|
Finally picked up an ESP8266 today so I can start testing out some of these features and make some progress again. After getting the Arduino IDE configured and successfully uploading the Blink sketch, I tried this one out. After uploading I could see the Wifi network: When I connected my phone to this network it instantly opened a Connectivity Check with Sign In prompt, which displayed the "Hello World" page (my Android phone thought it was a hotspot which required a login). For me it actually does handle all requests to the internet. I navigated to But if I try accessing a site I've visited previously, I get a There's no real way around this as it's a key part of HTTP security, but I don't think it's a problem for us. Just for the fun of it, I modified the sketch to see if I could perform some requests with it: #include <Arduino.h>
#include <FS.h>
#include <LittleFS.h>
#include <ESP8266WiFi.h>
#include <WiFiClient.h>
#include <DNSServer.h>
#include <ESP8266WebServer.h>
#include <EEPROM.h>
const byte DNS_PORT = 53;
IPAddress apIP(10, 10, 10, 1);
DNSServer dnsServer;
ESP8266WebServer webServer(80);
#ifndef APSSID
#define APSSID "AFTERLIFE " + WiFi.macAddress()
#define APPSK "ghostbusters"
#endif
String responseHTML = "<!DOCTYPE html>"
"<html lang=\"en\">"
"<head>"
"<meta charset=\"utf-8\">"
"<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">"
"<title>Hello World</title>"
"</head>"
"<body>"
"<h1>Hello, World!</h1>"
"<form action='/trigger' method='post'>"
"<input type='submit' name='action' value='On'>"
"<input type='submit' name='action' value='Off'>"
"</form><br>"
"</body>"
"</html>";
void setup() {
pinMode(LED_BUILTIN, OUTPUT);
digitalWrite(LED_BUILTIN, LOW);
WiFi.mode(WIFI_AP);
WiFi.softAPConfig(apIP, apIP, IPAddress(255, 255, 255, 0));
WiFi.softAP(APSSID, APPSK);
dnsServer.start(DNS_PORT, "*", apIP);
webServer.on("/trigger", HTTP_POST, [] () {
String inputMessage;
if (webServer.hasArg("action")) {
inputMessage = webServer.arg("action");
if (inputMessage == "On") {
digitalWrite(LED_BUILTIN, HIGH);
} else if(inputMessage == "Off") {
digitalWrite(LED_BUILTIN, LOW);
}
}
webServer.sendHeader("Location", String("/"), true);
webServer.send ( 302, "text/plain", "");
});
webServer.onNotFound([]() {
webServer.send(200, "text/html", responseHTML);
});
webServer.begin();
LittleFS.format();
Serial.println("Mount LittleFS");
if (!LittleFS.begin()) {
//error
}
EEPROM.begin(512);
}
void loop() {
dnsServer.processNextRequest();
webServer.handleClient();
}This sketch displays an On/Off button which controls the built-in LED, it worked very well during testing. Edit: I need to have a play with this: https://github.com/plapointe6/EspHtmlTemplateProcessor |
|
Can you push your code to the webserver branch? Getting interactions is the next step, and its something I can focus on doing if you would prefer. I just need API end points to save config data and trigger events.
This makes sense. Also because on sites previously visited the DNS is cached on your device, so it's probably trying to connect to whatever IP that isn't the ESP8266.
These both use SPIFFS as the file system. I had planned on going with LittleFS since I think it is a little easier to deal with loading files on to the ESP8266. If you have any insight into that, let me know. Basically I think LittleFS can just have a "data" directory with raw files (index, js, css, jpg.. etc) that can be accessed or fed directly instead of having things in the Arduino code. |
|
Yep, I'll push my code shortly 👍
After a bit of research, it looks like SPIFFS is deprecated/unsupported anyway, plus LittleFS is apparently more performant. So let's stick with LittleFS: I can't find any HTML template libraries which support LittleFS, but I don't think that's a dealbreaker anyway (we're not going to building anything too complex here). I was able to convert the Webserver demo to store the HTML file in LittleFS, the only catch is that I couldn't get it working with I'll commit what I have so you can try it out: #9 |
|
Now that I've got my hardware connected (See #7) I tried to perform an integration test with the Webserver code and my Neopixel code. I'm currently powering the Neopixels directly from the ESP8266, I thought maybe the current draw was too much for the Wifi. But even after disconnecting the Neopixels entirely the Wifi still drops out. So I commented out my animations and left just the webserver (and dependencies), the Wifi stays up fine. Next thing I tried was removing the animations and just setting the colour of one of the Neopixel strips based on the button presses (no timers etc, just the Adafruit Neopixel library). This still dropped out unfortunately. So pretty much ruled out my animations and the Timers, I think it's Neopixels interfering with Wifi. I jumped onto the Adafruit GitHub and searched for ESP8266 and found this Issue: That led me here: https://forum.arduino.cc/t/interrupting-the-neopixels-help-needed/495593
We're not be able to use Wifi and the Adafruit Neopixel library at the same time. What alternatives are out there? So, next up I tried FastLED. It took a significantly bigger rewrite to get up and running. But it mostly works (with a couple of weird hacks that I found others had to use on the ESP8266), and the logic of my original animations translates very pretty easily. In fact I actually like some aspects of it more than the Neopixel library. I now have a working demo with the Cyclotron LEDs and Webserver/Wifi. I can control the speed of the Cyclotron over Wifi: There are still some random glitches/flickering in the Cyclotron LEDs though. If I disable Wifi it runs smoothly, so there's potentially some adjustments/optimizations to be made there. WiFi.mode(WIFI_AP);
WiFi.softAPConfig(apIP, apIP, IPAddress(255, 255, 255, 0));
WiFi.softAP(APSSID, APPSK);I've barely scratched the surface of the FastLED documentation so I don't know what configuration/troubleshooting options we have available. If it's not a solvable problem, then that unfortunately rules out "Party Mode" 🤣 Disabling WifiI just tried adding some code to disable Wifi (by clicking on a button on the HTML page), and although it does switch it off I can't seem to re-enable it. Apparently it's possible, but I can't tell if it's Wifi that's failing, or DNS, or the WebServer. Need to read some more documentation. Update: Disabling Wifi does fix the flicker, in fact I notice that every time I click on a button while Wifi is enabled, the LEDs flicker more! So it must be whenever a Wifi packet is received it interferes with the Neopixels. void startWifi() {
WiFi.setSleepMode(WIFI_NONE_SLEEP); //Put this at the top of the setup function.
WiFi.mode(WIFI_AP);
WiFi.softAPConfig(apIP, apIP, IPAddress(255, 255, 255, 0));
WiFi.softAP(APSSID, APPSK);
}
void stopWifi() {
WiFi.disconnect(true);
WiFi.mode(WIFI_OFF);
webServer.end();
}It's getting late, but I'd like to connect it to a button and see if I can toggle Wifi on/off. So users could switch it on, change some settings, switch Wifi off again, and then use their Pack as normal. |
|
Regarding the flicker, are there any wires or large metal surfaces (ground planes) near the Wi-Fi antenna? Maybe try moving the ESP8266 to see if the condition improves? Perhaps a good idea to check to see what Wled has done because I suspect they have tackled all these issues. They already use the Async webserver, LittleFS, FastLED.. etc. So it is definitely possible. |
|
It's plugged into a breadboard sitting on a wooden desk, I don't think there's any interference. I'm installing WLED to see if I have the same problem, but I'm feeling pretty confident it's a hardware issue now. I also ordered some bidirectional logic level converters, I did find a UPDATE: WLED works perfectly, so unless there's something different about using the device as a SoftAP vs a Wifi client, maybe it isn't hardware. That's good, I can see if there's any solutions we can borrow from wled 👍 |
|
I've been trying to decipher the code from WLED but it's so heavily abstracted that I just can't understand it. I did find a few small configuration options which seemed to relate to ESP8266 but none had any effect. The flicker remained when I brought it into my sketch. I copied it into my sketch and 💥 no more flickering. My guess is that WLED isn't affected because they're doing all the LED communication themselves at the lowest (pin) level (which is why there's no It's an ugly hack but it should be enough to keep us going, I'll include some comments so we can periodically check on the original issue and see if someone resolves it. Next I just need to reconnect the PowerCell and make sure I can still run both strips at the same time 🤞 |
|
The demo of the webserver is completed (as documented in #10) so I believe we can close this too. |
I have created a branch with a webserver demo:
https://github.com/gbfans/afterlife-lightkit/blob/webserver/SOFTWARE/Webserver.ino
Currently the code will do the following:
Now it is supposed to start the DNS server and handle all requests to the internet and then display a Hello World page for everything. However it does not currently do that.
Accessing through http://www.msftconnecttest.com/redirect or the device's static IP of http://10.10.10.1/ does show the "Hello World" page.
The text was updated successfully, but these errors were encountered: