cotestatnt / async-esp-fs-webserver

ESP32/ESP8266 WebServer, WiFi manager and ACE web editor Arduino library. Based on ESPAsyncWebServer
Apache License 2.0
33 stars 10 forks source link

Feature : Add option to remove default "setup tab" #24

Closed GregAscolab closed 4 months ago

GregAscolab commented 5 months ago

Feature
Add #define to activate/remove default "setup tab" (Wifi / update & FS)

Description / Use case
I will mainly use my ESP wifi "access point" to connect to in order to display webpage for setup, hmi, etc...
And I don't want user to be able to change wifi parameter or scan...

So I asking myself if there is a possibility to add some kind of #define to remove native features...

This will be interresting also if some user don't want the firmware update feature.

Bonus
An update of this demand could also be to be able to define web page acces according some kind of user logging...
I user is not logged : display only
if logged : access to setup and modification.

Maybe this could be done by "javascript framework" or something (html/javascript is not my main knowledge ;-) )

cotestatnt commented 5 months ago

I had already thought of something like this, let's say it's on my to-do list.

For now, you could work around the problem by setting a password that only you know to access the /setup page The /edit page, however, must be explicitly enabled, so you just need not enter the relevant instructions. A complete example in customOptions.ino

  // Enable ACE FS file web editor and add FS info callback function
  // server.enableFsCodeEditor();

  // set /setup and /edit page authentication
  server.setAuthentication("admin", "admin");
GregAscolab commented 5 months ago

I had already thought of something like this, let's say it's on my to-do list.

For now, you could work around the problem by setting a password that only you know to access the /setup page

Yes I understand... but I'm not the only user so I need to share password (not so good...)

In my case, I really need Firmware update, Options tabs... but not the wifi setup part.
Maybe I can make my own "setup" html page, removing "Wifi" part ?

The /edit page, however, must be explicitly enabled, so you just need not enter the relevant instructions.

How to enable/disable the "/edit" page ? :

Using INCLUDE_EDIT_HTM ? Using server.enableFsCodeEditor(); ?

cotestatnt commented 5 months ago

Ok. Since you need only to remove WiFi tab, you could just add a little JS script which remove wifi elements and then simulate a menu click on first available option tab in order to show it properly.

Add this string literal char array to your sketch:

static const char NO_WIFI[] PROGMEM = R"STRING_LITERAL(
$('set-wifi').remove();
$('wifi-box').remove();

// Simulate menu navigator click on first available tab
document.getElementById('top-nav').getElementsByTagName('a')[0].click();
)STRING_LITERAL";

And then inject in /setup page as Javascript

server.addJavascript(NO_WIFI, "no-wifi", true);

In this way all WiFi related stuffs will be removed from page, but only after page loading. Of course you can edit the default /setup web page if you prefer.

Another option which don't require to edit library sources, could be "rewrite" the web request /setup to your custom page (for example, you could copy&paste the final HTML result of the above script using dev-tools of your browser).

  server.addRewrite( new AsyncWebRewrite("/setup", "/setup2"));
  server.on("/setup2", HTTP_GET, [](AsyncWebServerRequest *request) {
        request->send(200, "text/html", "CUSTOM_SETUP_HTML");
  });

Regarding /edit web page, it's up to you: if you edit INCLUDE_EDIT_HTM in the library source, all projects eventually using this library will be affected. If you use the method server.enableFsCodeEditor(); you can control the single project.

GregAscolab commented 5 months ago

Thank you very much for this "hack" ! I'm currently changing /setup page to my look and feel, and just "hidding" wifi info. But your javascript solution is much more clean to be able to reactivate wifi option later...

Creating a new setup page is also a solution I was thinking of... it will depend on my code size/memory available...