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

Вопрос Веб сервер с html + js и сохранение пользовательских данных

S

sonfire

New member
Как вместо такого сделать подачу html страницы?
Код: 
  webPage += "<h1>ESP8266 Web Server</h1><p>Socket #1 <a href=\"socket1On\"><button>ON</button></a>&nbsp;<a href=\"socket1Off\"><button>OFF</button></a></p>";
  webPage += "<p>Socket #2 <a href=\"socket2On\"><button>ON</button></a>&nbsp;<a href=\"socket2Off\"><button>OFF</button></a></p>";
    server.on("/", [](){
    server.send(200, "text/html", webPage);
  });
И еще как сохранить данные введенные пользователем на сайте во внутренней памяти устройства?
 
NeoroN

NeoroN

Member
Для этого нужно подучить теорию по протоколу http.
На каждый запрос генерируется ответ. Вначале нужно обработать запрос чтобы понять чего хотят от сервера(просто файл js картинку или страницу). Затем файл считывается с флешки модулем по работе с файловой системой, производится замена переменных в коде страницы(если это страница), формируется код ответа. Код ответа содержит заголовок и тело файла, разделенные пустой строкой "\n\n".

Сам код sever.on("/".....
заствляет чтение каждого файла прописывать отдельно, но может там есть настройка в модуле и он существуюшие файлы будет сам отдавать. Нужно больше информации.
 
S

sonfire

New member
@NeoroN
Например код. Одно поле ввода теста и кнопка сохранить
HTML: 
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Тег form, атрибут autocomplete</title>
</head>
<body>
  <form autocomplete="on">
   <p>Имя: <input name="user"></p>
    <p><input type="submit" value="Сохранить"></p>
  </form>
</body>
</html>
Как бы сохранить данные и считать их потом
 
tretyakov_sa

tretyakov_sa

Moderator
Команда форума
sonfire написал(а):
@NeoroN
Например код. Одно поле ввода теста и кнопка сохранить
Код: 
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Тег form, атрибут autocomplete</title>
</head>
<body>
  <form autocomplete="on">
   <p>Имя: <input name="user"></p>
    <p><input type="submit" value="Сохранить"></p>
  </form>
</body>
</html>
Как бы сохранить данные и считать их потом
Нажмите для раскрытия...
Посмотрите видео в плей листе "Основы", касающееся web сервера.
 
aliev_roman

aliev_roman

New member
Сделайте в любом web-редакторе страницу, для передачи используйте <form>. При обработке server.on, выдергивайте пары переменная-значение из свойства args(. В описании библиотеки это все есть.
После пишите настройки в eeprom и используйте на здоровье.
P.S.. Для создания страниц использую dreamweaver, только потом лишние теги удаляю. Можете встроить css в html файл и ваша страница станет цветной и красивой. Я даже gif вставлял, только страница грузится долго начинает - так что лучше без излишеств. Страницу потом вставляйте в String и перед отправкой клиенту модифицируй те значения полей ввода server.send(....
 
Войдите или зарегистрируйтесь для ответа.
Сверху Снизу