Switched from ESPWebServer and WebSocketsServer to ESPAsyncWebServer.

This commit is contained in:
Fabian Schlenz 2019-10-23 06:22:53 +02:00
parent a902addf94
commit 141210a370
8 changed files with 197 additions and 160 deletions

View File

@ -5,15 +5,12 @@
#include "my_wifi.h" #include "my_wifi.h"
#include <FS.h> #include <FS.h>
#include <ESPAsyncWebServer.h>
#if defined ( ESP8266 ) extern AsyncWebServer http_server;
extern ESP8266WebServer http_server;
#elif defined ( ESP32 )
extern ESP32WebServer http_server;
#endif
extern File upload_file; extern File upload_file;
void http_server_setup(); void http_server_setup();
void http_server_loop(); void http_server_send_framedata();
#endif #endif

View File

@ -5,13 +5,11 @@
#if defined( ESP8266 ) #if defined( ESP8266 )
#include <ESP8266WiFi.h> #include <ESP8266WiFi.h>
#include <ESP8266mDNS.h> #include <ESP8266mDNS.h>
#include <ESP8266WebServer.h>
#elif defined( ESP32 ) #elif defined( ESP32 )
#include <WiFi.h> #include <WiFi.h>
#include <ESPmDNS.h> #include <ESPmDNS.h>
#include <WiFiClient.h> #include <WiFiClient.h>
#include <WiFiServer.h> #include <WiFiServer.h>
#include <ESP32WebServer.h>
#endif #endif
#include <WiFiUdp.h> #include <WiFiUdp.h>

View File

@ -1,4 +0,0 @@
#pragma once
void websocket_setup();
void websocket_loop();

View File

@ -17,8 +17,7 @@ lib_deps =
PubSubClient PubSubClient
https://github.com/fabianonline/FastLED.git https://github.com/fabianonline/FastLED.git
https://github.com/fabianonline/NTPClient.git https://github.com/fabianonline/NTPClient.git
ESP8266WebServer https://github.com/me-no-dev/ESPAsyncWebServer.git
WebSockets
[env:ota] [env:ota]
upload_port = 10.10.2.80 upload_port = 10.10.2.80

View File

@ -5,18 +5,16 @@
#include "http_server.h" #include "http_server.h"
#include "effects.h" #include "effects.h"
#include "my_wifi.h" #include "my_wifi.h"
#include "functions.h"
#include "prototypes.h" #include "prototypes.h"
#include <FS.h> #include <FS.h>
#if defined( ESP8266 ) AsyncWebServer http_server(HTTP_SERVER_PORT);
ESP8266WebServer http_server(HTTP_SERVER_PORT); AsyncWebSocket ws("/ws");
#elif defined( ESP32 )
ESP32WebServer http_server(HTTP_SERVER_PORT);
#endif
File upload_file; File upload_file;
void http_server_handle_file_upload() { /*void http_server_handle_file_upload() {
if (http_server.uri() != "/upload") return; if (http_server.uri() != "/upload") return;
HTTPUpload upload = http_server.upload(); HTTPUpload upload = http_server.upload();
@ -32,15 +30,20 @@ void http_server_handle_file_upload() {
if (upload_file) upload_file.close(); if (upload_file) upload_file.close();
LOGln("HTTP * Upload of %s with %d bytes done.", upload.filename.c_str(), upload.totalSize); LOGln("HTTP * Upload of %s with %d bytes done.", upload.filename.c_str(), upload.totalSize);
} }
} }*/
void http_server_400() { void handle_ws(AsyncWebSocket* server, AsyncWebSocketClient* client, AwsEventType type, void* arg, uint8_t* data, size_t len) {
http_server.send(400); if (type == WS_EVT_CONNECT) {
LOGln("Websocket * Client connected.");
} else if (type == WS_EVT_DISCONNECT) {
LOGln("Websocket * Client disconnected.");
}
} }
void http_server_setup() { void http_server_setup() {
PGM_P text_plain = PSTR("text/plain"); PGM_P text_plain = PSTR("text/plain");
http_server.on("/", HTTP_GET, [&](){ PGM_P text_html = PSTR("text/html");
http_server.on("/", HTTP_GET, [&](AsyncWebServerRequest* request){
LOGln("HTTP * GET /"); LOGln("HTTP * GET /");
String message = "<html><head><title>Pitrix</title></head><body><h1>Pitrix</h1><p><a href='/settings'>Settings</a></p><p><a href='/effects'>Effect</a></p><p>Known animations:</p>"; String message = "<html><head><title>Pitrix</title></head><body><h1>Pitrix</h1><p><a href='/settings'>Settings</a></p><p><a href='/effects'>Effect</a></p><p>Known animations:</p>";
if (!SPIFFS.begin()) { if (!SPIFFS.begin()) {
@ -55,9 +58,9 @@ void http_server_setup() {
message += "<form action='/upload' method='POST'><input type='file' name='file' /><input type='submit' value='Upload file' /></form>"; message += "<form action='/upload' method='POST'><input type='file' name='file' /><input type='submit' value='Upload file' /></form>";
} }
message += "</body></html>"; message += "</body></html>";
http_server.send(200, "text/html", message); request->send(200, "text/html", message);
}); });
http_server.on("/settings", HTTP_GET, [&]() { http_server.on("/settings", HTTP_GET, [&](AsyncWebServerRequest* request) {
String message = "<html><head><title>Pitrix settings</title></head><body><h1>Pitrix settings</h1><a href='/'>Back to main page</a><table>\n"; String message = "<html><head><title>Pitrix settings</title></head><body><h1>Pitrix settings</h1><a href='/'>Back to main page</a><table>\n";
for (int i=0; i<all_settings_size; i++) { for (int i=0; i<all_settings_size; i++) {
Setting s = all_settings[i]; Setting s = all_settings[i];
@ -107,50 +110,51 @@ void http_server_setup() {
message += "</form></td></tr>\n"; message += "</form></td></tr>\n";
} }
message += "</table></body></html>"; message += "</table></body></html>";
http_server.send(200, "text/html", message); request->send(200, "text/html", message);
}); });
http_server.on("/settings", HTTP_POST, [&]() { http_server.on("/settings", HTTP_POST, [&](AsyncWebServerRequest* request) {
if (!http_server.hasArg("key") || !http_server.hasArg("value")) { if (!request->hasParam("key", true) || !request->hasParam("value", true)) {
http_server.send(400, "text/plain", "Missing argument."); request->send(400, "text/plain", "Missing argument.");
return; return;
} }
String name = http_server.arg("key"); String name = request->getParam("key", true)->value();
uint16_t value = http_server.arg("value").toInt(); uint16_t value = request->getParam("value", true)->value().toInt();
if (change_setting(name.c_str(), value)) { if (change_setting(name.c_str(), value)) {
if (http_server.hasArg("redir")) { if (request->hasParam("redir")) {
http_server.sendHeader("Location", "/settings"); AsyncWebServerResponse* response = request->beginResponse(301, "text/plain", "Moved");
http_server.send(301); response->addHeader("Location", "/settings");
request->send(response);
} else { } else {
http_server.send(200, "text/plain", "OK"); request->send(200, "text/plain", "OK");
} }
save_settings(); save_settings();
} else { } else {
http_server.send(400, "text/plain", "Could not change setting."); request->send(400, "text/plain", "Could not change setting.");
} }
}); });
http_server.on("/settings/load", HTTP_POST, [&]() { http_server.on("/settings/load", HTTP_POST, [&](AsyncWebServerRequest* request) {
load_settings(); load_settings();
http_server.send(200, "text/plain", "OK"); request->send(200, "text/plain", "OK");
}); });
http_server.on("/settings/save", HTTP_POST, [&]() { http_server.on("/settings/save", HTTP_POST, [&](AsyncWebServerRequest* request) {
save_settings(); save_settings();
http_server.send(200, "text/plain", "OK"); request->send(200, "text/plain", "OK");
}); });
http_server.on("/settings.txt", HTTP_GET, [&]() { http_server.on("/settings.txt", HTTP_GET, [&](AsyncWebServerRequest* request) {
File f; File f;
if (SPIFFS.begin()) { if (SPIFFS.begin()) {
f=SPIFFS.open("/pitrix_settings.txt", "r"); f=SPIFFS.open("/pitrix_settings.txt", "r");
if (f) { if (f) {
String s = f.readString(); String s = f.readString();
f.close(); f.close();
http_server.send(200, "text/plain", s); request->send(200, "text/plain", s);
return; return;
} }
} }
http_server.send(500, "text/plain", "Could not read settings."); request->send(500, "text/plain", "Could not read settings.");
}); });
http_server.on("/effects", HTTP_GET, [&]() { http_server.on("/effects", HTTP_GET, [&](AsyncWebServerRequest* request) {
String message = "<html><head><title>Pitrix effects</title></head><body><h1>Pitrix settings</h1><a href='/'>Back to main page</a><table>"; String message = "<html><head><title>Pitrix effects</title></head><body><h1>Pitrix settings</h1><a href='/'>Back to main page</a><table>";
for (int i=0; i<effects_size; i++) { for (int i=0; i<effects_size; i++) {
message += "<tr><td>"; message += "<tr><td>";
@ -160,97 +164,203 @@ void http_server_setup() {
message += "'><input type='hidden' name='redir' value='1'><input type='submit' value='Select'></form></td></tr>"; message += "'><input type='hidden' name='redir' value='1'><input type='submit' value='Select'></form></td></tr>";
} }
message += "</table></body></html>"; message += "</table></body></html>";
http_server.send(200, "text/html", message); request->send(200, "text/html", message);
}); });
http_server.on("/effects", HTTP_POST, [&]() { http_server.on("/effects", HTTP_POST, [&](AsyncWebServerRequest* request) {
if (!http_server.hasArg("name")) { if (!request->hasParam("name", true)) {
http_server.send(400, "text/plain", "Missing argument 'name'."); request->send(400, "text/plain", "Missing argument 'name'.");
return; return;
} }
String name = http_server.arg("name"); String name = request->getParam("name", true)->value();
if (change_current_effect(name)) { if (change_current_effect(name)) {
if (http_server.hasArg("redir")) { if (request->hasParam("redir")) {
http_server.sendHeader("Location", "/effects"); AsyncWebServerResponse* response = request->beginResponse(301, "text/plain", "Moved");
http_server.send(301); response->addHeader("Location", "/effects");
request->send(response);
} else { } else {
http_server.send(200, "text/plain", "OK"); request->send(200, "text/plain", "OK");
} }
} else { } else {
http_server.send(404, "text/plain", "Effect not found."); request->send(404, "text/plain", "Effect not found.");
} }
}); });
http_server.on("/delete", HTTP_GET, [&]() { http_server.on("/delete", HTTP_GET, [&](AsyncWebServerRequest* request) {
LOGln("HTTP * GET /delete"); LOGln("HTTP * GET /delete");
if (http_server.args()==0) { if (request->params()==0) {
http_server.send_P(400, text_plain, PSTR("No filename given")); request->send_P(400, text_plain, PSTR("No filename given"));
return; return;
} }
String file = http_server.arg(0); String file = request->getParam(0)->value();
if (file == "/") { if (file == "/") {
http_server.send_P(400, text_plain, PSTR("Invalid path")); request->send_P(400, text_plain, PSTR("Invalid path"));
return; return;
} }
if (!SPIFFS.exists(file)) { if (!SPIFFS.exists(file)) {
http_server.send_P(400, text_plain, PSTR("File does not exist.")); request->send_P(400, text_plain, PSTR("File does not exist."));
return; return;
} }
SPIFFS.remove(file); SPIFFS.remove(file);
http_server.send_P(200, text_plain, PSTR("OK")); request->send_P(200, text_plain, PSTR("OK"));
}); });
http_server.on("/upload", HTTP_POST, []() { /*http_server.on("/upload", HTTP_POST, [](AsyncWebServerRequest* request) {
LOGln("HTTP * POST /upload"); LOGln("HTTP * POST /upload");
http_server.send(200, "text/plain", "OK"); request->send(200, "text/plain", "OK");
}, http_server_handle_file_upload); }, http_server_handle_file_upload);*/
http_server.on("/free_heap", HTTP_GET, [&](){ http_server.on("/free_heap", HTTP_GET, [&](AsyncWebServerRequest* request){
LOGln("HTTP * GET /free_heap"); LOGln("HTTP * GET /free_heap");
http_server.send(200, "text/plain", String(ESP.getFreeHeap())); request->send(200, "text/plain", String(ESP.getFreeHeap()));
}); });
http_server.on("/uptime", HTTP_GET, [&](){ http_server.on("/uptime", HTTP_GET, [&](AsyncWebServerRequest* request){
LOGln("HTTP * GET /uptime"); LOGln("HTTP * GET /uptime");
http_server.send(200, "text/plain", String(millis()/1000)); request->send(200, "text/plain", String(millis()/1000));
}); });
http_server.on("/fps", HTTP_GET, [](){ http_server.on("/fps", HTTP_GET, [](AsyncWebServerRequest* request){
LOGln("HTTP * GET /fps"); LOGln("HTTP * GET /fps");
http_server.send(200, "text/plain", String(FastLED.getFPS())); request->send(200, "text/plain", String(FastLED.getFPS()));
}); });
http_server.on("/reboot", HTTP_POST, [](){ http_server.on("/reboot", HTTP_POST, [](AsyncWebServerRequest* request){
LOGln("HTTP * POST /reboot"); LOGln("HTTP * POST /reboot");
ESP.restart(); ESP.restart();
}); });
http_server.on("/brightness", HTTP_POST, [&](){ http_server.on("/mode", HTTP_POST, [&](AsyncWebServerRequest* request){
LOGln("HTTP * POST /brightness with value %s", http_server.arg("plain").c_str()); LOGln("HTTP * POST /mode with value %s", request->getParam("plain", true)->value().c_str());
if (!http_server.hasArg("plain")) { if (!request->hasParam("plain", true)) {
http_server.send_P(400, text_plain, PSTR("No brightness given")); request->send_P(400, text_plain, PSTR("No effect given."));
return; return;
} }
long val = http_server.arg("plain").toInt(); String val = request->getParam("plain", true)->value();
if (val==0 || val>255) {
http_server.send_P(400, text_plain, PSTR("New value out of bounds. (1-255)"));
return;
}
FastLED.setBrightness(val);
http_server.send(200, "text/plain", "OK");
});
http_server.on("/mode", HTTP_POST, [&](){
LOGln("HTTP * POST /mode with value %s", http_server.arg("plain").c_str());
if (!http_server.hasArg("plain")) {
http_server.send_P(400, text_plain, PSTR("No effect given."));
return;
}
String val = http_server.arg("plain");
if (change_current_effect(val)) { if (change_current_effect(val)) {
http_server.send(200, "text/plain", "OK"); request->send(200, "text/plain", "OK");
} else { } else {
http_server.send_P(400, text_plain, PSTR("Unknown effect.")); request->send_P(400, text_plain, PSTR("Unknown effect."));
} }
}); });
http_server.on("/monitor", HTTP_GET, [&](AsyncWebServerRequest* request) {
static const char* html PROGMEM = R"(
<html>
<head>
<title>Pitrix</title>
</head>
<body>
<canvas id='target' width='800' height='500'></canvas>
<script type='text/javascript'>
ctx = document.getElementById('target').getContext('2d');
socket = new WebSocket((document.location.protocol=='https:' ? 'wss' : 'ws') + '://' + document.location.host + '/ws');
socket.binaryType = 'arraybuffer';
socket.onmessage = function(message) {
var buffer = new Uint8Array(message.data);
var width = buffer[0];
var height = buffer[1];
if (buffer[2] != 255) return;
var offset = 3;
ctx.fillStyle = '#000000';
ctx.fillRect(0, 0, 20*width, 20*height);
for (var y=0; y<height; y++) for (var x=0; x<width; x++) {
var r = buffer[offset + 0];
var g = buffer[offset + 1];
var b = buffer[offset + 2];
offset = offset + 3;
ctx.beginPath();
ctx.arc(x*20 + 10, y*20 + 10, 10, 0, 2*Math.PI, false);
ctx.fillStyle = 'rgb('+r+','+g+','+b+')';
ctx.fill();
}
};
function redraw() {
ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);
}
</script>
</body>
</html>
)";
request->send_P(200, PSTR("text/html"), html);
});
ws.onEvent(handle_ws);
http_server.addHandler(&ws);
http_server.begin(); http_server.begin();
MDNS.addService("_http", "_tcp", 80); MDNS.addService("_http", "_tcp", 80);
} }
void http_server_loop() { void http_server_send_framedata() {
http_server.handleClient(); if (ws.count() > 0) {
uint16_t _size = LED_WIDTH * LED_HEIGHT * 3 + 4;
uint8_t* _buffer = new uint8_t[_size];
_buffer[0] = LED_WIDTH;
_buffer[1] = LED_HEIGHT;
_buffer[2] = 255;
for (uint8_t y=0; y<LED_HEIGHT; y++) for(uint8_t x=0; x<LED_WIDTH; x++) {
uint16_t index = XYsafe(x, y);
CRGB pixel = leds[index];
_buffer[3 + (y*LED_WIDTH + x)*3 + 0] = (pixel.r==255 ? 254 : pixel.r);
_buffer[3 + (y*LED_WIDTH + x)*3 + 1] = (pixel.g==255 ? 254 : pixel.g);
_buffer[3 + (y*LED_WIDTH + x)*3 + 2] = (pixel.b==255 ? 254 : pixel.b);
}
_buffer[_size - 1] = 255;
ws.binaryAll(_buffer, _size);
delete _buffer;
}
} }
#endif #endif
/*
#include <ESP8266WiFi.h>
#include <WebSocketsServer.h>
#include "config.h"
#include "websockets.h"
#include "my_fastled.h"
#include "functions.h"
#include "effects.h"
WebSocketsServer ws = WebSocketsServer(81);
void ws_event(uint8_t num, WStype_t type, uint8_t* payload, size_t length) {
if (type == WStype_CONNECTED) {
LOGln("Websockets * Client connected.");
} else if (type == WStype_DISCONNECTED) {
LOGln("Websockets * Client disconnected.");
} else if (type == WStype_TEXT) {
String msg = String((char*)payload);
LOGln("Websockets * Received: %s", msg.c_str());
if (msg.startsWith("E:")) {
change_current_effect(msg.substring(2));
}
}
}
void websocket_setup() {
ws.begin();
ws.onEvent(ws_event);
}
void send_data() {
uint16_t _size = LED_WIDTH * LED_HEIGHT * 3 + 4;
uint8_t* _buffer = new uint8_t[_size];
_buffer[0] = LED_WIDTH;
_buffer[1] = LED_HEIGHT;
_buffer[2] = 255;
for (uint8_t y=0; y<LED_HEIGHT; y++) for(uint8_t x=0; x<LED_WIDTH; x++) {
uint16_t index = XYsafe(x, y);
CRGB pixel = leds[index];
_buffer[3 + (y*LED_WIDTH + x)*3 + 0] = (pixel.r==255 ? 254 : pixel.r);
_buffer[3 + (y*LED_WIDTH + x)*3 + 1] = (pixel.g==255 ? 254 : pixel.g);
_buffer[3 + (y*LED_WIDTH + x)*3 + 2] = (pixel.b==255 ? 254 : pixel.b);
}
_buffer[_size - 1] = 255;
ws.broadcastBIN(_buffer, _size);
delete _buffer;
}
void websocket_loop() {
if (ws.connectedClients()>0) {
send_data();
}
ws.loop();
}
*/

View File

@ -11,7 +11,6 @@
#include "effects.h" #include "effects.h"
#include "http_server.h" #include "http_server.h"
#include "settings.h" #include "settings.h"
#include "websockets.h"
uint8_t starting_up = OTA_STARTUP_DELAY; uint8_t starting_up = OTA_STARTUP_DELAY;
int loop_timeouts = 0; int loop_timeouts = 0;
@ -44,7 +43,6 @@ void setup() {
ntp_setup(); ntp_setup();
ota_setup(); ota_setup();
fastled_setup(); fastled_setup();
websocket_setup();
ntpClient.begin(); ntpClient.begin();
#ifdef HTTP_SERVER_ENABLE #ifdef HTTP_SERVER_ENABLE
http_server_setup(); http_server_setup();
@ -80,10 +78,6 @@ void loop() {
#ifdef MQTT_ENABLE #ifdef MQTT_ENABLE
mqtt_loop(); mqtt_loop();
#endif #endif
#ifdef HTTP_SERVER_ENABLE
http_server_loop();
#endif
websocket_loop();
EVERY_N_MILLISECONDS(100) { EVERY_N_MILLISECONDS(100) {
baseHue++; baseHue++;
@ -119,10 +113,7 @@ void loop() {
} }
FastLED.show(); FastLED.show();
http_server_send_framedata();
#ifdef RECORDER_ENABLE
recorder->loop();
#endif
} }
#if defined(MQTT_ENABLE) && defined(MQTT_REPORT_METRICS) #if defined(MQTT_ENABLE) && defined(MQTT_REPORT_METRICS)

View File

@ -13,7 +13,7 @@ def rgb2ansi(r, g, b)
end end
IP = ARGV[0] IP = ARGV[0]
uri = "ws://#{IP}:81" uri = "ws://#{IP}:80/ws"
puts "Connecting to #{uri}..." puts "Connecting to #{uri}..."
EM.run do EM.run do

View File

@ -1,54 +0,0 @@
#include <ESP8266WiFi.h>
#include <WebSocketsServer.h>
#include "config.h"
#include "websockets.h"
#include "my_fastled.h"
#include "functions.h"
#include "effects.h"
WebSocketsServer ws = WebSocketsServer(81);
void ws_event(uint8_t num, WStype_t type, uint8_t* payload, size_t length) {
if (type == WStype_CONNECTED) {
LOGln("Websockets * Client connected.");
} else if (type == WStype_DISCONNECTED) {
LOGln("Websockets * Client disconnected.");
} else if (type == WStype_TEXT) {
String msg = String((char*)payload);
LOGln("Websockets * Received: %s", msg.c_str());
if (msg.startsWith("E:")) {
change_current_effect(msg.substring(2));
}
}
}
void websocket_setup() {
ws.begin();
ws.onEvent(ws_event);
}
void send_data() {
uint16_t _size = LED_WIDTH * LED_HEIGHT * 3 + 4;
uint8_t* _buffer = new uint8_t[_size];
_buffer[0] = LED_WIDTH;
_buffer[1] = LED_HEIGHT;
_buffer[2] = 255;
for (uint8_t y=0; y<LED_HEIGHT; y++) for(uint8_t x=0; x<LED_WIDTH; x++) {
uint16_t index = XYsafe(x, y);
CRGB pixel = leds[index];
_buffer[3 + (y*LED_WIDTH + x)*3 + 0] = (pixel.r==255 ? 254 : pixel.r);
_buffer[3 + (y*LED_WIDTH + x)*3 + 1] = (pixel.g==255 ? 254 : pixel.g);
_buffer[3 + (y*LED_WIDTH + x)*3 + 2] = (pixel.b==255 ? 254 : pixel.b);
}
_buffer[_size - 1] = 255;
ws.broadcastBIN(_buffer, _size);
delete _buffer;
}
void websocket_loop() {
if (ws.connectedClients()>0) {
send_data();
}
ws.loop();
}