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

Решено Вывод данных с Esp на сервер

Abel

New member
Доброго времени суток! Вопрос вот какой. В примере сервера на esp8266 есть вот такая строка
Код:
String s = "HTTP/1.1 200 OK\r\nContent-Type: text/html\r\n\r\n<!DOCTYPE HTML>\r\n<html>\r\n ";
s += val;
s += "</html>\n";
как я понял, это страница в браузере, куда будут выводиться данные с esp в HTML. Но значение переменной должно val постоянно меняется, а при таком выводе в браузере это видно только после обновления страницы. Можно ли каким нибудь образом настроить автообновление страницы сервера, или вывести все пришедшие значения как в мониторе порта?
 

tretyakov_sa

Moderator
Команда форума
Можно ли каким нибудь образом настроить автообновление страницы сервера, или вывести все пришедшие значения как в мониторе порта?
Что вы пытаетесь сделать не ясно. Получение данных без перезагрузки страницы посмотрите здесь:
 

Pilnikov

Active member
Решил написать господину Третьякову сюда, так как тема живая. Если что не так прошу сильно не пинать, а перенаправить в другую ветку.
Прошу помощи.
Скетч в прицепе. Нужна помощь в доработке веб морды - конкретно как обновить данные на странице настройки будильнков при изменении номера будильника (выпадающий список)
Спасибо.
 

Вложения

guinpin

New member
Скетч в прицепе. Нужна помощь в доработке веб морды - конкретно как обновить данные на странице настройки будильнков при изменении номера будильника (выпадающий список)
Спасибо.
Тут сильно зависит от того, как именно у вас реализовано веб-приложение(морда вашего интерфейса). Судя по вопросу, смею предположить, что в сайтостроительстве вы не гуру, поэтому вариант самый простой.

HTML:
    <select onchange="document.location.href='http://localhost?alarm_id='+value">
      <option value="1">1
      <option value="2">2
      <option value="3">3
    </select>
При изменении селекта, пойдет запрос с идентификатором будильника. Обрабатываете его на ESP и выдаете страницу с данными выбранного будильника. Для Arduino IDE смотрите server.arg("alarm_id").
Да, если в форме данные изменены и не сохранены- они потеряются. Это уже отдельный вопрос.

Вопрос ваш относится не к ESP, а к веб-разработке. Поэтому гуглите HTML, JS. По нарастающей: можно на страницу загружать сразу данные всех будильников и менять данные в полях без перезагрузки страницы. Можно при выборе будильника делать AJAX-запрос без перезагрузки страницы.
 

Pilnikov

Active member
для меня к сожалению HTML, JS и AJAX темнее чем темный лес, сейчас данные обновляются если нажать на вкладку "будильник" , а вот как ее (эту вкладку) "нажать" по селектору - для меня балшой вопрос - я в веб разработке полный ноль
 

guinpin

New member
для меня к сожалению HTML, JS и AJAX темнее чем темный лес, сейчас данные обновляются если нажать на вкладку "будильник" , а вот как ее (эту вкладку) "нажать" по селектору - для меня балшой вопрос - я в веб разработке полный ноль
Посмотреть, какой код выполняет обработчик вкладки и вызвать его в onchange селекта.
Либо смотрите в сторону облачных сервисов, там все мышкой рисуется. ис опенсорсного есть OpenHAB, например
 

Pilnikov

Active member
Посмотреть, какой код выполняет обработчик вкладки и вызвать его в onchange селекта.
Либо смотрите в сторону облачных сервисов, там все мышкой рисуется. ис опенсорсного есть OpenHAB, например
я blynk делал - тормозит жутко. тут весь смысл в том что локальная форма доступна всегда вне зависимости есть инет или нет его. в этом проекте есть кусок thingspeak - вот только не работает он при использовании инета от МТС
 

guinpin

New member
в этом проекте есть кусок thingspeak - вот только не работает он при использовании инета от МТС
Нажмите в браузере F12, обновите страницу и посмотрите во вкладке "сеть" - возможно не могут подгрузиться какие-то внешние ресурсы. Можно посмотреть в консоль - если есть ошибки в JS вы их там увидите.
В любом случае, если хотите рисовать интерфейсы сами, придется учиться.
 

Baranoid

New member
Так поделитесь ;) Или тоже в поиск?
Да в общем не знаю, что и писать))) Там по уму много чего надо вдумчиво понять. У Третьякова какая-то часть решения в роликах выше есть, где-то еще куски. У меня код разбросан в нескольких местах скетча и файлов html и javascript. Собрать все в одном месте сложно.
Суть такая. В html прописываем поля с неким тэгом. Этому тегу присваивается значение переменной в javascript файле в функции. Функция рефрешится раз в секунду (ну или как часто надо). Соответственно рефрешится и значение тэга в html без перезагрузки страницы. Да, переменная в функции рефрешится из файла в формате json. Т.е. надо еще отдельно засылать значение переменной в json файл из кода ардуины.
У меня код уже разросся неимоверно, давать целиком бессмысленно, а выдергивать без контекста еще глупее. Что бы ответить "как", надо снимать обучающий ролик на минут 40.
Поэтому Pilnikov и мне не ответил на этот вопрос.
 
Последнее редактирование:

Pilnikov

Active member
Я попробую вкратце. Есть 3 объекта: 1 - сервер, 2 - javascript, 3 - html страничка. Есть взаимодействие между ними - запрос ответ. Есть протокол(формат) обмена данными - JSON. Html страница - это просто "витрина" на которой отображаются данные и присутствуют элементы управления (кнопки). За поведение страницы (реакции на нажатия кнопок, изменение каких то полей, различные проверки) отвечают java script - своего рода промежуточный обработчик, либо посредник, между сервером и страницей. Работает это все следующим образом: в скрипте задана цикличность с периодом допустим 1 сек, каждый цикл скрипт посылает запрос на сервер - в ответ сервер выдает строчку в формате JSON (идентификатор - данные - разделитель), скрипт обрабатывает эти данные встроенным парсером (дешифратором) на выходе которого мы получаем уже готовые значения, которые и подставляются в соответствующие поля на странице. Так работает вывод данных на страницу. При вводе данных обрабатывается нажатие кнопки "применить" - которое есть ни что иное, как точно такой же запрос на сервер. В результате этого запроса на сервере запускается функция обработчик, которая и изменяет данные в вашей программе. Примерно так. Конкретика внутри кода html страниц и в функции web (если брать мою погодную станцию)
 

PAV

Member
Мужики, я понимаю, что те, кто разобрался, такие вопросы не любят, но я что на профильном форуме MJD всех всегда прошу - давайте готовые решения, чтобы новичок мог не разбираясь со всей этой ненужной ему херней, данные свои подставить и получить работающее решение, так и вас прошу, дайте кусок работающего кода для обновления, например, температуры. Кто захочет разбираться со всем подробно - полезет и разберется, а кому нужен один датчик температуры с выводом на веб страницу, возьмет ваш пример, сделает раз и забудет навсегда ;) Заранее спасибо.
 
Сверху Снизу