Нужна помощь Webserver в среде Arduino IDE

[NLObP]

Всем привет. Кто-нибудь знаком с примером "esp8266_webinterface" из библиотеки ws2812fx? Код примера приводить не буду, обрисую ситуацию вкратце. В общем, нужно этот пример немного переделать под радиоканал. Нужно раздать и записать команды с пульта наподобие как в прошивке wifi-iot.

Спойлер

Ну то есть имеется горсть команд для управления, нужна функция программирования пульта на этой самой веб-странице, так сказать присвоить значения команд пульта аргументам управления. Смотрел другие примеры по веб-интерфейсу, но тут совсем всё иначе написано, я не нахожу ничего подобного. Попытался внедрить в код вот такое чудо:

    <ul id='radioinput'>
    <form name="test" method="post">
  <p><b>x:</b><br>
   <input type="text" size="40">
   </p>
   <p><input type="submit" value="Отправить">
   </p>
   </ul>

void loop() {
  if (mySwitch.available())
  {
    if(mySwitch.getReceivedValue() == x)
    ws2812fx.setMode(next_mode);
    mySwitch.resetAvailable();
  }
}

void srv_handle_set() {
  if(server.argName(i) == "test") {
      if(server.arg(i) > 0)
      x = i;
   }
}

Результат:

Спойлер

Разумеется, пульт не программируется, я не знаю ни HTML, ни скриптов. Надо бы в EEPROM еще это дело внедрить, но хотя бы так пока разобраться нужно... Прошу помощи.

 

[Сергей_Ф]

[off]Смешались в кучу кони, люди... (М.Ю.Лермонтов)[/off]
Я так и не понял, в чем у вас проблема и какое отношение к ней имеет тема топика.

 

[NLObP]

@Сергей_Ф
это вы к чему? Я же описал. Не получается запрограммировать пульт через веб-страницу. То есть придать введенные аргументы командам управления.

 

[Сергей_Ф]

@NLObP какой пульт? У вас тема называется как? И при чем тут пульт? Где у веб-сервер на Ардуино ИДЕ пульт? Судя по отсутствии ответов не один я ничего не понял.

 

[NLObP]

@Сергей_Ф обычный 433й радиоканал. Библиотека RCSwitch. Но это вообще неважно в том плане, что вместо радиоканала может быть любое другое управляющее устройство вроде обычной припаянной кнопки. Команды я знаю, например, которые поступают с пульта. Для управления светодиодной лентой я использую аргументы x1, x2 и т.д. (для упрощения) x1 = 8931077, x2 = 8931083 (команды с пульта), эти команды выполняют какие-либо действия в программе. Я хочу сделать их программируемыми из веб-сервера (при смене пульта, например). То есть нужно вписать чему равны эти x1, x2... со страницы веб-сервера и запомнить в EEPROM.

 

[NLObP]

Вот пример, к слову. Человек пытается прочитать числа из своих полей. Как мне это же внедрить, только с EEPROM'ом еще?

 

[Сергей_Ф]

@NLObP не знаю, то ли это что вам нужно, но посмотрите https://esp8266.ru/forum/threads/prostye-wifi-chasy.1209/page-3#post-25854
Ну и сам код часов в той теме смотрите. Немного разбираться в http и js придется научиться.

 

[NLObP]

@Сергей_Ф, Мне не нужно менять GPIO. Код смотрел, не увидел ничего на сохранение.
Требуется лишь простейшая кнопка для сохранения числа. Может, я с переменной что-то не так делаю? Тут код от пульта, его нужно как byte хранить?
Покажите мне скрипт сохранения, как он пишется ТОЧНО. Нужна ли отдельная функция для этого? В файле main.js есть вот такое:

function submitVal(name, val) {
  var xhttp = new XMLHttpRequest();
  xhttp.open('GET', 'set?' + name + '=' + val, true);
  xhttp.send();
}

Как её использовать в моем случае?
Или другой скрипт написать?

 

[NLObP]

Попытался вот так:

<ul id='button'>
    <input type="text" name="date_x" id="date_x" size=2 autofocus> x
    <div>
    <br><button id="save_button">Save</button></br>
    </div>
    <script scr="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script>
      var x;
      $("#save_button").click(function(e) {
        e.preventDefault();
        x = $("#date_x").val();
        $.get("/save?x=" + x, function(data) {
          console.log(data);
        });
      });
    </script>
</ul>

void srv_handle_set() {
  if(server.arg("x") != "") {
      Serial.println("Kod pulta = " + server.arg("x"));
  }
}

Должно же в монитор порта выводить этот аргумент сервера после ввода числа через веб-страничку, верно? Но ничего нет.
Значит, скрипт не работает...

 

[Сергей_Ф]

@NLObP что у вас обрабатывает запросы? Вам в первую очередь код http-сервера надо смотреть, а не скрипты .

 

[NLObP]

@Сергей_Ф,

$("#save_button").click(function(e)

А это разве не обработчик?

 

[Сергей_Ф]

@NLObP это обработчик js-скрипта. Он шлет get-запрос на сервер, судя по его коду. Что делает сервер получив запрос /save ? Судя по всему он его вообще не обрабатывает.
Я же дал вам ссылку как можно реализовать обработку кнопки на странице. Все шаги оьработки надо пройти. А вы пропустили самый первый. Ну или последний, если первым считать js.

 

[NLObP]

То есть нужно создать еще одну URL вида server.on("/save", srv_handle_set); ?
Или функцию вида void save()? Что она должна делать вообще?

 

[Сергей_Ф]

@NLObP и то и другое. Первое обработчик запроса, он может быть реализован и по другому, второе - сама функция обработчика. Делать она должна то что вам надо плюс отвечать на запрос. Вам же надо сохранить куда то код, вот и сохраняйте.

 

[NLObP]

@Сергей_Ф, спасибо. Попробую.

 

[Сергей_Ф]

немного уточню. Если будете создавать функцию save(), то её и вставляйте в обработчик. Сейчас у вас есть srv_handle_set, можете как показали

server.on("/save", srv_handle_set);

использовать её. В неё и добавляйте сохранение в EEPROM и, в зависимости от результата, формируйте ответ сервера "Ок" или "Ошибка".

 

[NLObP]

@Сергей_Ф
В общем, получилось! Спасибо за советы.) За основу взял уроки Сергея Третьякова. Ой какая мутота вышла... Но работает) Чтоб всё сохранялось, приделал файловую систему. Дописать пришлось овер дофига чего.
Теперь вопросы по оптимизации имеются.) Обработчиком кнопки выступает вот такая функция:

Спойлер: Функция JavaScript

<script type="text/javascript">
function set_kod1(submit){
   server = "/koD?kod1="+val('kod1');
   send_request(submit,server);
}
</script>

Спойлер: Остальной код

<h2 style="color:#ffffff"> Код пульта </h2>
    <input id="kod1" value="{{kod1}}" class="form-control" pattern="[0-9a-zA-Zа-яА-Я. ]{1,20}" placeholder="Эффект+">
    <input class="btn btn-block btn-success" value="Сохранить" onclick="set_kod1(this);" type="submit">

void srv_kod1_set() {
  kod1 = server.arg("kod1").toInt();
  saveConfig();
  server.send(200, "text/plain", "OK");
}

void handle_ConfigJSON() {
  String json = "{";  // Формировать строку для отправки в браузер json формат
  json += "\",\"kod1\":\"";
  json += kod1;
  json += "\"}";
  server.send(200, "text/json", json);
}

// Загрузка данных сохраненных в файл  config.json
bool loadConfig() {
  // Открываем файл для чтения
  File configFile = SPIFFS.open("/config.json", "r");
  if (!configFile) {
  // если файл не найден
    Serial.println("Failed to open config file");
  //  Создаем файл запиав в него аные по умолчанию
    saveConfig();
    return false;
  }
  // Проверяем размер файла, будем использовать файл размером меньше 1024 байта
  size_t size = configFile.size();
  if (size > 1024) {
    Serial.println("Config file size is too large");
    return false;
  }
// загружаем файл конфигурации в глобальную переменную
  jsonConfig = configFile.readString();
  // Резервируем памяь для json обекта буфер может рости по мере необходимти предпочтительно для ESP8266
    DynamicJsonBuffer jsonBuffer;
  //  вызовите парсер JSON через экземпляр jsonBuffer
  //  строку возьмем из глобальной переменной String jsonConfig
    JsonObject& root = jsonBuffer.parseObject(jsonConfig);
  // Теперь можно получить значения из root
    kod = root["kod1"];               // Так получаем число
    return true;
}

// Запись данных в файл config.json
bool saveConfig() {
  // Резервируем памяь для json обекта буфер может рости по мере необходимти предпочтительно для ESP8266
  DynamicJsonBuffer jsonBuffer;
  //  вызовите парсер JSON через экземпляр jsonBuffer
  JsonObject& json = jsonBuffer.parseObject(jsonConfig);
  // Заполняем поля json
  json["kod1"] = kod1;
  // Помещаем созданный json в глобальную переменную json.printTo(jsonConfig);
  json.printTo(jsonConfig);
  // Открываем файл для записи
  File configFile = SPIFFS.open("/config.json", "w");
  if (!configFile) {
    //Serial.println("Failed to open config file for writing");
    return false;
  }
  // Записываем строку json в файл
  json.printTo(configFile);
  return true;
  }

Да, я очень плохо понимаю JavaScript... В общем вопрос, а как применить эту же функцию для остальных кнопок, то есть например kod2, kod3, kodn... чтобы не писать еще обработчики для других кнопок? Как сделать единицу в коде переменной (этой самой n)? В принципе, не проблема написать для всех, а их будет около 20, но сами понимаете как захламится код, если я подобные обработчики добавлю для всех 20 команд...)

 

[Сергей_Ф]

@NLObP js может работать с массивами. Посмотрите тему, на которую я давал ссылку. Там я выкладывал свой мод, в нем реализованы динамические будильники. Как раз на массивах.