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

Обновление прошивки по wifi, устройство автономное

13_CHIP_13

New member
Здравствуйте, сделал пульт управления на базе esp32, работает точкой доступа и поднимает сервер (полностью автономный, связи с инетом непредусмотренно), потребовалось реализовать обновление прошивки по вафле. Ради этой затеи погрузился несколько в arduino ide, html и немного JS. Пример из ардуины (клиентская часть) написан на jQuery (который OTAwebUpdater), но для работы требуется или инет или как то скачать библиотеку (наверняка не маленькую) и держать её на самой esp. Поэтому немного переписал на JS, но работает по разному на разных браузерах, может где то накосячил? (конкретно процент загрузки идёт некоректно в firefox и итоговое сообщение upload не всегда выводиться). Также не всегда загружается прошивка в esp32, но это может быть связано с тем что нужно останавливать ненужные задачи (от аппаратных прерываний отказался, потому как они явно мешали, только задачи для операционки) или это всё равно для этой библиотеки?

Код:
 const char* serverIndex =  "<head><link rel='shortcut icon' href='data:,' /></head>\n"
 "<form method='POST' action='#' enctype='multipart/form-data' id='upload_form' name='fileinfo'>\n"
"<meta http-equiv='Content-type' content='text/html; charset=utf-8'>\n"         
"<title>Update</title>"
"<style type=\"text/css\">\n"
"body { background-color: #cccccc; font-family: Arial, Helvetica, Sans-Serif; Color: #000088; margin: 2px auto; text-align: center; width: 100%; max-width: 1024px;}\n"
"</style>\n"
"<h1 style = 'font-size: 40pt'>Обновление прошивки</h1>\n"
"<p style = 'font-size: 15pt; Color: red;'>Если обновлять не собираешься, то нужно перезагрузить пульт</p>"
"<p><input style = 'font-size: 30pt' type='file' name='update' accept='.bin' required></p>\n"
"<p><input style = 'font-size: 30pt' type='submit' value='Update'></p>\n"
"</form>\n"
"<div style = 'font-size: 30pt' id='prg'>progress: 0%</div>\n"
"<script>\n"
"let form = document.forms.namedItem('fileinfo');\n"
"form.addEventListener('submit', function(e) {\n"
"     e.preventDefault();\n"
"     let Output = document.querySelector('div');\n"
"     let data = new FormData(form);\n"     
"     let request = new XMLHttpRequest();\n"
"     request.open('POST', '/update', true);\n"
"     request.upload.addEventListener('progress', function(evt) {\n"
"        if (evt.lengthComputable) {\n"
"          let per = evt.loaded / evt.total;\n"
"          if(Math.round(per*100)>=100) Output.innerHTML = 'Complite';\n"
"          else Output.innerHTML = ('progress: ' + Math.round(per*100) + '%');\n"
"        }\n"
"      }, false);\n"
"     request.onload = function(Event) {\n"
"        if (request.status == 200) {\n"
"          Output.innerHTML = 'Uploaded!';\n"\
"        } else {\n"
"          Output.innerHTML = 'Error ' + request.status + ' occurred when trying to upload your file.<br/>';\n"
"        }\n"
"     }\n"
"     if(confirm('Обновляем?'))request.send(data);\n"
"     e.preventDefault();\n"
"}, false);\n"
"</script>";
 

yurik72

Member
Ну тут вопрос к реализации JavaScript.
Корректная реализация это весь твой скрипт запихнуть в event Document Loaded
<script>
document.addEventListener('DOMContentLoaded', function (event) {
your script there.....
}
</script>

Иначе идет попытка прицепиться к евентам еще не существующих объектов. Browser еще не достроил DOM,
может проявляться на любых browser....
 

13_CHIP_13

New member
Спасибо попробую, но пока сыкотно, потому что, если накосячу придется разбирать и кабелем прошивать. Поправка небольшая на мой вопрос: прошивается всегда, но только статус процентов какой то один выводиться (77 чаще всего) и больше не меняется, потом два сообщения "Complite" и затем "Uploaded". Пока терпимый глюк.
 
Сверху Снизу