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

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

A

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

tretyakov_sa

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

Pilnikov

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

Вложения

guinpin

guinpin

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

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

Pilnikov

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

guinpin

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

Pilnikov

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

guinpin

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

Baranoid

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

Pilnikov

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

PAV

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