Tips for data conversion

Convert AutoConnectElements value to actual data type

The value of the AutoConnectElements field of the custom Web pages consists of String type for all. Sketches will need to convert them to the actual data type. And then if the data type required for processing in the sketch is not a String type, it is necessary to convert to String type when storing to the AutoConenctElements value.

AutoConnect library does not provide the data conversion utility, and its function depends on Arduino language functions or functions of the type class. However, commonly used data conversion methods are generally similar.

Here, represent examples the typical method for the data type conversion for the AutoConnectElements value of custom Web pages.

Integer

Use int() or toInt() of String.

AutoConnectInput& input = aux.getElement<AutoConnectInput>("INPUT");
int value = input.value.toInt();

Float

Use float() or toFloat() of String.

AutoConnectInput& input = aux.getElement<AutoConnectInput>("INPUT");
float value = input.value.toFloat();

Date & Time

The easiest way is to use the Arduino Time Library. Sketches must accommodate differences in date and time formats depending on the time zone. You can absorb the difference in DateTime format by using sscanf function.¹

#include <TimeLib.h>

time_t tm;
int Year, Month, Day, Hour, Minute, Second;

AutoConnectInput& input = aux.getElement<AutoConnectInput>("INPUT");
sscanf(input.value.c_str(), "%d-%d-%d %d:%d:%d", &Year, &Month, &Day, &Hour, &Minute, &Second);
tm.Year = CalendarYrToTm(Year);
tm.Month = Month;
tm.Day = Day;
tm.Hour = Hour;
tm.Minute = Minute;
tm.Second = Second;

IP adderss

To convert a String to an IP address, use IPAddress::fromString. To stringize an instance of an IP address, use IPAddress::toString.

IPAddress ip;
AutoConnectInput& input aux.getElement<AutoConnectInput>("INPUT");
ip.fromString(input.value);
input.value = ip.toString();

Validation for the value

In order for data to be correctly converted from a string, the input data must be consistent with the format. How to implement strict validation in sketches depends on various perspectives and the power of tiny devices is not enough to implement a complete lexical analysis. But you can reduce the burden for data verification using the pattern of AutoConnectInput.

By giving a pattern to AutoConnectInput, you can find errors in data format while typing in custom Web pages. The pattern is specified by regular expression. If the value during input of AutoConnectInput does not match the regular expression specified by the pattern, its background color changes to pink. Refer to Handling the custom Web pages section.

However, input data will be transmitted even if the value does not match the pattern. To check the value with the sketch, using the AutoConnectInput::isValid function. The isValid function validates whether the value member variable matches a pattern and returns true or false.

#include <ESP8266WiFi.h>
#include <ESP8266WebServer.h>
#include <AutoConnect.h>

static const char input_page[] PROGMEM = R"raw(
[
  {
    "title": "IP Address",
    "uri": "/",
    "menu": true,
    "element": [
      {
        "name": "ipaddress",
        "type": "ACInput",
        "label": "IP Address",
        "pattern": "^(([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])$"
      },
      {
        "name": "send",
        "type": "ACSubmit",
        "value": "SEND",
        "uri": "/check"
      }
    ]
  },
  {
    "title": "IP Address",
    "uri": "/check",
    "menu": false,
    "element": [
      {
        "name": "result",
        "type": "ACText"
      }
    ]
  }
]
)raw";

AutoConnect portal;

String checkIPAddress(AutoConnectAux& aux, PageArgument& args) {
  AutoConnectAux* input_page = portal.aux("/");
  AutoConnectInput& ipaddress = input_page->getElement<AutoConnectInput>("ipaddress");
  AutoConnectText& result = aux.getElement<AutoConnectText>("result");

  if (ipaddress.isValid()) {
    result.value = "IP Address " + ipaddress.value + " is OK.";
    result.style = "";
  }
  else {
    result.value = "IP Address " + ipaddress.value + " error.";
    result.style = "color:red;";
  }
  return String("");
}

void setup() {
  portal.load(input_page);
  portal.on("/check", checkIPAddress);
  portal.begin();
}

void loop() {
  portal.handleClient();
}

Regular Expressions for JavaScript

Regular expressions specified in the AutoConnectInput pattern conforms to the JavaScript specification.

Here, represent examples the typical regular expression for the input validation.

URL

^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$

DNS hostname

^(([a-zA-Z0-9]|[a-zA-Z0-9][a-zA-Z0-9\-]*[a-zA-Z0-9])\.)*([A-Za-z0-9]|[A-Za-z0-9][A-Za-z0-9\-]*[A-Za-z0-9])$

email address ¹

^[a-zA-Z0-9.!#$%&'*+\/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$

IP Address

^(([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])$

Date as MM/DD/YYYY ²

^(0[1-9]|1[012])[- \/.](0[1-9]|[12][0-9]|3[01])[- \/.](19|20)\d\d$

Contain with backquote

If that regular expression contains a backquote it must be escaped by backquote duplication.

---

1. This regular expression does not fully support the format of the e-mail address requested in RFC5322. ↩↩

2. This regular expression does not consider semantic constraints. It is not possible to detect errors that do not exist as actual dates. ↩