EByte LoRa E32 Web Manager: description, configure and demo (esp8266, esp32) – 2

I do a lot of projects with EByte LoRa E32, all based on my library “EByte Lora E32 Library“, and a lot of peoples download that, but the tools from EByte are very poor, and sometime buggy.

So I try to create an example that via web support all the configuration features and widgets to test send and receive.

Here the LoRa E32 AliExpress (433MHz 5Km) - AliExpress (433MHz 8Km) - AliExpress (433MHz 16Km) - AliExpress (868MHz 915MHz 5.5Km) - AliExpress (868MHz 915MHz 8Km)

You can divide the application in 2 parts

Back End (like simple gateway)

I wrote 2 back end, one for esp8266 and one for esp32, you can find they on examples of my library “EByte LoRa E32 library“.

You can select to work with the device as Soft AP or you can insert your WiFi SSID and password and use they like normal server, to enable Soft AP you must comment this line

#define SERVER_MODE

Than if you attach D0 with pull-up resistor to RESET pin I automatically reset the device when needed.

Upload sketch and Web UI

To upload the sketchs you can refer to the tutorial I’v already write:

• esp8266:
  • Manage env and upload sketch “WeMos D1 mini (esp8266), pinout, specs and IDE configuration“
  • Upload data to LittleFS “WeMos D1 mini (esp8266), integrated LittleFS Filesystem“
• esp32:
  • Manage env and upload sketch “ESP32: pinout, specs and Arduino IDE configuration“
  • Upload data to SPIFFS “ESP32: integrated SPIFFS FileSystem“

Introduction to the Web UI

The Web UI is multilanguage and have some interesting features, here 2 video one to show the UI in Italian and one in English.

Module information

First widget is a simple panel with device information

In this widget you can find the information about the device attached, now I set all frequencies but only 100 and 1W module.

Configuration

The most important widget is the configuration one, that I use It con configure and reset the module.

As you can see there are all configuration options of E32 devices, with red button you send a reset command to the module, and with DEFAULT button you load the default values for the device, save to save permanently the configuration.

Send widget

If you want send a message in Trasparent, Fixed or Boradcast you can use the widget in send receive section.

If you had select Transparent option in configuration, the widget have only a tab with Transparent option.

The CHAN is blocked because you can’t change that value.

As default I add a ‘\0’ character to the message to use It as separator in the read of buffer.

If you select Fixed in transmission mode you have two options,

send FIXED message

where you can select CHAN, ADDH and ADDL.

Send BROADCAST message

Receiver widget

Now the widget to receive messages

the E32 receive all the message and put they in the buffer, when you click on START button you start to read message until ‘\0’ character, I use WebSocket to send message to front end, so you don’t need to do refresh every time.

Custom Home Page

I made my own web application with a simple but useful feature, you can click on the heart in the widget and this elements are pinned on homepage and you move or resize they in all pages and if you click on floating save button you can preserve the layout selected for the next access.

Thanks

Link to library

Link to Front-End GitHub project

Link to REST API implementations.

1. EByte LoRa E32 gateway: manage via REST and WebSocket
2. EByte LoRa E32 Web Manager: description, configure and demo