OTA Web Update Issue (SOLVED)

Hi guys, I have a problem with OTA and I hope you can help me.
I loaded an owa.html page in the FS mounted with SPIFFS. This is the code, adapted from the OTAWebUpdater example available in arduino IDE:

<!DOCTYPE html>
<html lang="en" class="">
<head>	<meta charset='utf-8'>
		<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no">
		<link rel="stylesheet" href="styles.css">
<script src='https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js'></script>
<form method='POST' action='#' enctype='multipart/form-data' id='upload_form'></form>

<div style='text-align:left;display:inline-block;color:#eaeaea;min-width:340px;'>
  <script>"$('form').submit(function(e){e.preventDefault(); var form=$('#upload_form')[0]; var data=new FormData(form);$.ajax({url: '/update',type:'POST',data:data,contentType:false,processData:false, xhr:function(){ var xhr=new window.XMLHttpRequest();xhr.upload.addEventListener('progress', function(evt){ if (evt.lengthComputable) { var per=evt.loaded/evt.total;$('#prg').html('progress: ' + Math.round(per*100) +'%');}}, false);return xhr;},success:function(d, s) {console.log('success!')},error: function (a, b, c) { }});});"</script>
  <div style='text-align:center;color:#eaeaea;'>
   <h2>OTA WEB Updater</h2>
   <legend><b>Upgrade by .bin upload</b></legend>
   <form method='POST' action='#' enctype='multipart/form-data' id='upload_form'>
    <input type='file' name='update'>
    <input type='submit' value='Upgrade'>
   <div style='text-align:center;color:#eaeaea;' id='prg'>progress: 0%</div>
  <p><form action='.' method='get'><button>Main Menu</button></form></p>
  <div style='text-align:right;font-size:11px;'><hr/>
	<a href='https://bit.ly/tasmota' target='_blank' style='color:#aaa;'>%CAPTION%</a>

if I call the page locally everything is fine.
If I call it from the web server on esp32, a black page appears.
If I remove the code part with the script, the page returns but obviously the scripts don't work.
Any ideas?

This HTML part is not complete.


is missing for one thing.
Also there is no defined.
Different browsers will respond differently to html syntax errors.


1 Like