• Уважаемые посетители сайта esp8266.ru!
    Мы отказались от размещения рекламы на страницах форума для большего комфорта пользователей.
    Вы можете оказать посильную поддержку администрации форума. Данные средства пойдут на оплату услуг облачных провайдеров для сайта esp8266.ru
  • Система автоматизации с открытым исходным кодом на базе esp8266/esp32 микроконтроллеров и приложения IoT Manager. Наша группа в Telegram

ESP32 присвоить переменной значение из веб формы

P

PMA

New member
приветствую всех.
в программировании есп я пока ноль. поэтому биение головой об клаву постоянное.
на данный момент споткнулся на простой вещи.
в веб морде пользователь набирает имя сервера (в моем случае mqtt), имя пользователя и пароль. Нажимает кнопку "сохранить"
Как эти поля перенести в переменные внутри есп32? я могу отреагировать на нажатие кнопки, но не могу выудить данные. поля для ввода, на самой странице, описаны так: "<input name='ServerName' maxlength="35" size="35" value=%ServerName%>" т.е. ориентир, после которого нужно забрать строку для записи есть - ServerName
именно есп32. Для есп 8266 я нашел не один пример решения подобной задачи. но они не сработали :(
 
Сергей_Ф

Сергей_Ф

Moderator
Команда форума
@PMA у вас ServerName не может быть ориентиром. Это данные, по тому что вы тут написали.
 
P

PMA

New member
Сергей_Ф написал(а):
@PMA у вас ServerName не может быть ориентиром. Это данные, по тому что вы тут написали.
Нажмите для раскрытия...
вы правы.
исправил в странице код
теперь он выглядит так: <input name='%ServName%' maxlength="35" size="35" value=%ServerName%>

ServName это ориентир. и его нахожу без проблем. а далее затык.
Похоже я понял, где моя проблема. У меня огромный пробел знаний в том, в каком виде данные со страницы передаются в есп как таковые вообще.
Где почитать?
 
Сергей_Ф

Сергей_Ф

Moderator
Команда форума
PMA написал(а):
У меня огромный пробел знаний в том, в каком виде данные со страницы передаются в есп как таковые вообще.
Нажмите для раскрытия...
при чем тут esp? Вы данные со странице передаёте на сервер. На чем сделан сервер вообще не важно. У сервера есть обработчик запроса. Этот обработчик и должен получить и разобрать строку запроса. А уж как он данные из нее передаст в программу, это совсем другая тема.
Пробелы у вас, судя по всему, во всех шагах. Потому даже не знаю что посоветовать читать. Попробуйте начать с учебников по html, JavaScript. Когда поймёте как и куда отправляются данные со страницы, то переходите на C++ для создания сервера обработчиков http запросов.
 
P

PMA

New member
Сергей_Ф написал(а):
при чем тут esp? Вы данные со странице передаёте на сервер. На чем сделан сервер вообще не важно. У сервера есть обработчик запроса. Этот обработчик и должен получить и разобрать строку запроса. А уж как он данные из нее передаст в программу, это совсем другая тема.
Пробелы у вас, судя по всему, во всех шагах. Потому даже не знаю что посоветовать читать. Попробуйте начать с учебников по html, JavaScript. Когда поймёте как и куда отправляются данные со страницы, то переходите на C++ для создания сервера обработчиков http запросов.
Нажмите для раскрытия...
с html стало более менее понятно. особенно про обработку данных из форм :)
Теперь следующий шаг.
передаю свои данные через адресную строку. например: test.htm?login=222&pass=333
поскольку данных у меня максимум 4ре числа, то должно хватить.
теперь затупил на стороне есп. не могу понять простого.. библиотека ESPAsyncWebServer.. как с ее помощью отловить эти переменные?
 
Сергей_Ф

Сергей_Ф

Moderator
Команда форума
@PMA извините, вам лень ту тему почитать? Там всего три библиотеки упоминаются. Посмотрите где есть это есть. Дела на 5 минут.
 
G

Goldz

Member
PMA написал(а):
этот пример я изначально нашел.
но к каой библиотеке он применим? я использую AsyncWebServer
и ессно полдучаю ошибку No membernamed named "arg"
Нажмите для раскрытия...
Здравствуйте! Четвертый день бьюсь с подобной ситуацией. Необходимо получить состояние чекбокса и текстового поля. <a href> не предлагать. Файлы храню на SPIFFS. Быть может Вы разобрались с этой проблемой? Помогите!!!!!
 
Ildarmustafin86

Ildarmustafin86

Active member
Отправка:
JavaScript: 
    document.getElementById("Button1").addEventListener("click", function(event){
    event.preventDefault();
    let chartDays = document.getElementById("input1").value;
    let jsonData = 'input1=' + chartDays;
    let xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
            Console.log("Success");
        }
    };
    xhttp.open("GET", 'chartDays?'+jsonData, true);
    xhttp.timeout = 10000;
    xhttp.send();       
    });
Прием:
C: 
server.on("/chartDays", HTTP_GET, [](AsyncWebServerRequest * request) {
    int chartDays = request->arg("input1").toInt();
    request->send(200, "text/plain", "");
  });
Что то в этом роде. Это выдранный кусок
 
G

Goldz

Member
Ildarmustafin86 написал(а):
Отправка:
JavaScript: 
    document.getElementById("Button1").addEventListener("click", function(event){
    event.preventDefault();
    let chartDays = document.getElementById("input1").value;
    let jsonData = 'input1=' + chartDays;
    let xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
            Console.log("Success");
        }
    };
    xhttp.open("GET", 'chartDays?'+jsonData, true);
    xhttp.timeout = 10000;
    xhttp.send();     
    });
Прием:
C: 
server.on("/chartDays", HTTP_GET, [](AsyncWebServerRequest * request) {
    int chartDays = request->arg("input1").toInt();
    request->send(200, "text/plain", "");
  });
Что то в этом роде. Это выдранный кусок
Нажмите для раскрытия...
Здравствуйте!
Так вышло что жизнь не заставляла меня программировать html. Чуть чуть разобрался, но а в джаве совсем глухой.
Я понимаю что у Вас своих дел полно, но набравшись наглости прошу Вас довести ответ до состояния файлов.
Мой html выглядит так
HTML: 
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Proba</title>
<meta name="generator" content="WYSIWYG Web Builder 16 - http://www.wysiwygwebbuilder.com">
</head>
<body>
   <div id="wb_Checkbox1" style="position:absolute;left:280px;top:161px;width:98px;height:44px;z-index:0;">
      <input type="checkbox" id="Checkbox1" name="" value="on" checked style="position:absolute;left:0;top:0;"><label for="Checkbox1"></label>
   </div>
   <input type="text" id="Editbox1" style="position:absolute;left:255px;top:113px;width:139px;height:27px;z-index:1;" name="Editbox1" value="" spellcheck="false">
<link href="Безымянный1.css" rel="stylesheet">
<link href="index.css" rel="stylesheet">
</body>
</html>
Я думаю что за рабочий пример в виде файлов Вам будут благодарны многие пользователи, а не только я.
 
Ildarmustafin86

Ildarmustafin86

Active member
Кстати, добавьте javascript на форму, иначе придется вручную его всегда добавлять
 
Ildarmustafin86

Ildarmustafin86

Active member
Я думаю вашу задачу нужно разделить на две части. Первое, это определить, что вы хотите передать. И второе, это передача-прием. Вторую я уже скинул. Осталось найти параметр для передачи и присвоить его заместо chartDays.
 
G

Goldz

Member
Ildarmustafin86 написал(а):
Я думаю вашу задачу нужно разделить на две части. Первое, это определить, что вы хотите передать. И второе, это передача-прием. Вторую я уже скинул. Осталось найти параметр для передачи и присвоить его заместо chartDays.
Нажмите для раскрытия...
Кусок джавы, который Вы указали это куда? Вставить в HTML или оформить отдельным файлом? Если файлом, то какое расширение и как сделать на него ссылку из INDEX.HTML
 
Войдите или зарегистрируйтесь для ответа.
Сверху Снизу