• Система автоматизации с открытым исходным кодом на базе esp8266/esp32 микроконтроллеров и приложения IoT Manager. Наша группа в Telegram

Проблемы с локальной Web-страницей (без выхода в интернет) для сохранения разных настроек.

CCat

Member
В общем, захотел прикрутить какую-то веб-морду для сохранения и изменения некоторых значений.
Нашел пример и немного изменил его. (не нашел другого понятного скетча, который не лезет в сеть (в остальных примерах ESP выходит в интернет, а какой интернет, если я хочу интерфейс в том числе для изменения имени и пароля точки доступа, если он поменялся на роутере :mad:), а молча создает точку доступа и страницу, на которой можно что-то делать)
И вот как бы работает, но то подвисает на несколько секунд перед выводом страницы, то в броузере мелькает "страница недоступна", или вообще недоступна до перезагрузки страницы в броузере...

Такое впечатление, что скетч прямо таки выжимает все соки из ESP и она работает на пределе возможностей, хотя по скетчу такого и не скажешь. :)

Собственно, вопрос - что может быть не так? Вроде всё элементарно.
ESP у меня NodeMCU v3, и вроде беспроблемная - во всех прочих вариантах (пока не начал возиться с генерацией странички) беспроблемная.
Код:
#include <ESP8266WiFi.h>
#include <WiFiClient.h>
#include <ESP8266WebServer.h>

const char *ssid = "WeatherBox";
String f_ssid = "tempo";
String f_pass = "123";

ESP8266WebServer server(80);

const String HTTP_HEAD   = "<!DOCTYPE html><html lang=\"en\"><head><meta name=\"viewport\" content=\"width=device-width, initial-scale=1, user-scalable=no, charset=windows-1251\"/><title>Test</title>";
const String HTTP_STYLE  = "<style>input[type=text], input[type=password] {width: 100%; padding: 12px 20px; margin: 8px 0; display: inline-block; border: 1px solid #ccc; box-sizing: border-box;}  button {background-color: #4CAF50; color: white; padding: 14px 20px; margin: 8px 0; border: none; cursor: pointer; width: 100%;}  .container {padding: 16px;} </style>";
const String HTTP_HEADER  = "</head><body><div class=\"container\"><form method=\"get\"><h1>Настройки</h1>";
const String HTTP_FOOTER  = "<button type=\"submit\">OK</button></div></form></body></html>";


/* Just a little test message.  Go to http://192.168.4.1 in a web browser
* connected to this access point to see it.
*/
void handleRoot() {
    if(server.arg("f_ssid"))
      f_ssid = server.arg("f_ssid");
    if(server.arg("f_pass"))
      f_pass = server.arg("f_pass");
String s = HTTP_HEAD;
      s += HTTP_STYLE;
      s += HTTP_HEADER;

    s += "<label for=\"uname\"><b>Имя</b></label><input type=\"text\" name=\"f_ssid\" value=\""+f_ssid+"\" required>";
    s += "<label for=\"psw\"><b>Password</b></label><input type=\"text\" name=\"f_pass\" value=\""+f_pass+"\" required>";
    s += "<label><input type=\"checkbox\" checked=\"checked\" name=\"remember\"> Remember me</label>";

  
      if (f_ssid == "2"){
    s += "<H4>Two</H4>";
  } else {
    s += "<H4>Not two</H4>";
  }
      s+=HTTP_FOOTER;
      server.send(200, "text/html", s);
}

void setup() {
  delay(1000);
  Serial.begin(115200);
  Serial.println();
  Serial.print("Configuring access point...");
  //WiFi.softAP(ssid, password);
  WiFi.softAP(ssid);

  IPAddress myIP = WiFi.softAPIP();
  Serial.print("AP IP address: ");
  Serial.println(myIP);
  server.on("/", handleRoot);
 
  server.begin();
  Serial.println("HTTP server started");
}

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

tretyakov_sa

Moderator
Команда форума
Вот чтоб всякую ерунду не писать в код, специально сделан веб интерфейс. Смотрите Мой канал.
 

CCat

Member
@tretyakov_sa, спасибо, Вы о Подключаем Web страницы FSWebServer | Программирование ESP8266 в среде Arduino IDE (извините, обучающие видео не люблю - текст лучше для восприятия)
Я пороюсь. Но я вижу, Вы используете другие библиотеки.
А в моем примере где именно фигня? (Я не сомневаюсь, что она есть, но понять-то хочется...) :)
 

tretyakov_sa

Moderator
Команда форума
Фигня в то что вы генерируете страницу. HTML код станицы сюда выложите. Я сделаю пример.
 
  • Like
Реакции: CCat

CCat

Member
Фигня в то что вы генерируете страницу. HTML код станицы сюда выложите. Я сделаю пример.
HTML:
<!DOCTYPE html>
<html>
<head>
  <meta charset="windows-1251">
  <title>Тест</title>
<style>
input[type=text], input[type=password] {
    width: 100%;
    padding: 12px 20px;
    margin: 8px 0;
    display: inline-block;
    border: 1px solid #ccc;
    box-sizing: border-box;
}

button {
    background-color: #4CAF50;
    color: white;
    padding: 14px 20px;
    margin: 8px 0;
    border: none;
    cursor: pointer;
    width: 100%;
}

.container {
    padding: 16px;
}

</style>
</head>

<body>

<form>
  <div class="container">
    <h1>Настройки</h1>
    <label for=\"ssid\"><b>SSID</b></label><input type=\"text\" name=\"ssid\" value=\"ssid\" required>
    <label for=\"pass\"><b>Пароль</b></label><input type=\"text\" name=\"pass\" value=\"pass\">
    <label for=\"altit\"><b>Высота</b></label><input type=\"text\" name=\"altit\" value=\"altit\">
    <label><input type=\"checkbox\" checked=\"checked\" name=\"remember\"> Чекбокс</label>
    <button type="submit">OK</button>
  </div>
</form>

</body>
</html>
Кстати, у меня еще беда с кодировкой. Через одну перезагрузку страницы то нормально, то слетает.
Подозреваю, что страница не докачивается (на мобильном в Хроме нет опции "посмотреть исходный HTML")
 

tretyakov_sa

Moderator
Команда форума
Скетч в приложении. Но такой способ обмена данными самый древний. Посмотрите плей лист Основы.
 

Вложения

  • Like
Реакции: CCat

CCat

Member
Большое спасибо! Но я попробую, и как у Вас. Мне понравилась идея насчет попытки соединения с роутером, а при отсутствии коннекта - запуск своей AP. Но немного не пойму, откуда я буду знать IP страницы, если подключился к роутеру (мало ли какой IP он выделит)
Тогда, видимо, надо и DNS свой поднимать, чтобы по адресу типа http://esp8266.local можно было попасть на веб-страницу в любом случае, при любом типе подсоединения?
 

CCat

Member
@tretyakov_sa, да, я дочитал-досмотрел, но это хорошо для десктопа. Мне кажется, такие вещи чаще делаются с мобильного. А там это будет неочевидно. Хотя и Винде неочевидно, имхо. Одно дело, вывести пользователю сообщение на экране "Не могу соединиться с роутером. Если изменился пароль, подключитесь к WiFi-точке "esp8266" и наберите в броузере адрес http://11.11.11.11 для изменения настроек", и другое дело поведать о SSDP. По крайней мере, мне так показалось. :)
 

Алексей.

Active member
Если изменился пароль, подключитесь к WiFi-точке "esp8266" и наберите в броузере адрес http://11.11.11.11 для изменения настроек"
Адрес 11.11.11.11 выбран не случайно?
Владелец пула 11.0.0.0 - 11.255.255.255 DoD Network Information Center (DNIC)
Почему в США нужно направлять? Маршрут уж больно длинный однако.
 

tretyakov_sa

Moderator
Команда форума
Одно дело, вывести пользователю сообщение на экране "Не могу соединиться с роутером. Если изменился пароль, подключитесь к WiFi-точке "esp8266" и наберите в броузере адрес http://11.11.11.11 для изменения настроек", и другое дело поведать о SSDP. По крайней мере, мне так показалось. :)
Напишите так: Если изменился пароль, подключитесь к WiFi-точке "esp8266" и наберите в броузере адрес http://esp.ru для изменения настроек"
Символьный адрес можно взять любой. так как в режиме точки доступа можно и нужно включить встроенный DNS сервер.
 
Сверху Снизу