search

gmag11 / FSBrowserNG

Full autocontained (on SPIFFS) async web server on ESP8266. Written as a Library.
Other
158 stars 70 forks source link

readme

Notice: I (gmag11) do not have the free time to go on developing this project. If you would like to continue with it feel free to make your own fork or ask to be a collaborator. Please understand that I do need time for my job and my family :).

FSBrowserNG

Full autocontained (on SPIFFS) async web server on ESP8266. Written as a Library.

Same features as my FSBrowser sketch but built around AsyncWebServer library and implemented as a library itself. See *.ino file for usage example

Introduction

I wanted to add a standard environment for all my ESP8266 based projects to be able to configure them via web browser to avoid code editing when I need to change some settings like SSID, password, etc.

I found John Lassen's WebConfig project to almost fit my needs. It uses a simple but powerful web interface with dynamic data using microAJAX. I've added some dynamic data using Links2004's WebSockets library.

So, I tried to fork it. Original WebConfig project stores web pages on PROGMEM, but I was recently using SPIFFS on ESP8266 and I think it is a good way to store web content. I found I was not the first to think this when I noticed about FSBrowser example in ESP8266WebServer library.

This example code has a great bonus: a text editor (based on ACE) with syntax highligth that can be used to edit html on board directly. I found a bug on it (already sent to esp8266/Arduino repository) and, when fixed, noticed how usefull this editor is.

My code is a fork of both projects, and has become a start framework for my future projects. Finally i've refactored code to use it as a library, so it is easier to integrate it in a project. See this example to check that only 3 lines are necessary to use it.

I only have to add more HTML data and some funtions to show dynamic data in order to adapt it to any other task.

It has integrated NTP syncronization based on my own NTPClient library, that can be configured via this Web interface too.

Configuration is stored on SPIFFS too, in a JSON file. So, it recovers config during boot.

Implemented OTA Update with Arduino IDE and Web interface.

Web access can be protected with Basic HTTP Authentication.

I use a library called ESPAsyncWebServer. It is much faster than standard ESP8266WebServer library due to its async design.

Notice that Basic HTTP Authentication alone is not suitable to protect data over Internet. It allows recovery of user and password via sniffing and does not encrypt data flow. It is valid to give a first protection and may be a good solution combining it with strong VPN. Take this in account when connecting it to public networks or Internet.

WiFi connection

I've implemented a way to turn ESP8266 into AP mode so I can set WiFi config when prior WiFi is not available. It is done by setting IO pin 4 to high status during boot. This pin is configurable by a #define. in FSWebServerlib.h. You must ensure it is connected to GND to allow it to connect to a router.

AP Mode is also started when loadConfig() finds no config file (config.json). This is so to help first use without needind to hardcode user and password. config.json is generated automatically if needed:

{
    "ssid":"YOUR_SSID",
    "pass":"YOUR_PASSWORD",
    "ip":[192,168,1,4],
    "netmask":[255,255,255,0],
    "gateway":[192,168,1,1],
    "dns":[192,168,1,1],
    "dhcp":1,
    "ntp":"es.pool.ntp.org",
    "NTPperiod":5,
    "timeZone":10,
    "daylight":1,
    "deviceName":"ESP8266fs"
}

WiFi connection to router is confirmed via LED on IO pin GPIO02 as soon an IP address is got. Same LED is used to confirm AP mode by flashing 3 times. LED ping can be configured in FSWebServerlib.h.

How to use it

After compile and flash into ESP8266 you need to upload SPIFFS data using download tool for Arduino IDE. Check SPIFFS doc for details.

You may add your own files to SPIFFS to be served by ESP8266. You only need to add some code if you need dynamic data.

FSBrowserNG extends AsyncWebServer class. So, you may use all its methods as usual.

Dependencies

This library makes use of other libraries you have to include in your Arduino library folder.

All other libraries used are installed in Arduino ESP8266 framework.

Troubleshooting

If the compiler exits with an error similar to "WebHandlers.cpp:67:64: error: 'strftime' was not declared in this scope", follow these steps:

see https://github.com/me-no-dev/ESPAsyncWebServer/issues/60

If the ESP8266 Sketch Data Upload fails with an error similar to "Exception in thread "AWT-EventQueue-0" java.lang.IllegalAccessError: tried to access method", replace the ESP8266FS 0.3.0 plugin by the ESP8266FS 0.2.0 plugin.

Species5618

read data example (see user2.html in callback example) /rconfig/user1/user2/user3

will return values user1 , user2 and user3 user1|1|input user2|2|input user3|3|input

for div and chk valuea add 'd' add 'c 'to the url part so /rconfig/user1/d_user2/c_user3 for example might return

user1|1|input user2|222222222222|div user3|1|chk

and /pconfig will save ANY posted form value in the user config file

NOTE this may expose you config, be carefull

TODO

Simple user config

Simple way to add user config using the file userconfigui.json. No need to create or edit html files. See example UserConfigExample2.

Please Let Us know of any good projects based on this library, I wil linclude them in the examples/Otherexmaples.txt file