ESP32-ESP8266-File-Download-Upload-Delete-Stream-and-Directory
ESP32-ESP8266-File-Download-Upload-Delete-Stream-and-Directory copied to clipboard
G6EJD
Calling your HomePage () function from HTML
Hi Dave, I really need your support and hope you can find a minute to help me with calling your HomePage() function from this HTML code, replacing the "window.open('/serverIndex')" statament:
String loginIndex = "<form name='loginForm'>" "<table width='40%' bgcolor=cyan align='center' border= '2px solid black'>" "<tr>" "<td colspan=2>" "<center><font size=4><b>LavaXpress</b></font></center>" "<center><font size=4><b>Acceso restringido</b></font></center>" "<br>" "</td>" "<br>" "<br>" "</tr>" "<td>Usuario:</td>" "<td><input type='text' size=25 name='userid'><br></td>" "</tr>" "<br>" "<br>" "<tr>" "<td>Contraseña:</td>" "<td><input type='Password' size=25 name='pwd'><br></td>" "<br>" "<br>" "</tr>" "<tr>" "<td><input type='submit' onclick='check(this.form)' value='Acceso'></td>" "</tr>" "</table>" "</form>" "<script>" "function check(form)" "{" "if(form.userid.value=='admin' && form.pwd.value=='admin')" "{" "window.open('/serverIndex')" "}" "else" "{" " alert('Error Password or Username')/*displays error message*/" "}" "}" "</script>";
The code comes from the Arduino OTA WebUpdater example. I am very inexperienced and I have not gotten it to work.
Oslaf
What I do is google ‘html school, then choose one of their examples: then erase their example and paste you code in place:
<!DOCTYPE html>
<html>
<form name='loginForm'>
<table width='40%' bgcolor=cyan align='center' border= '2px solid black'>
<tr>
<td colspan=2>
<center>
<font size=4><b>LavaXpress</b></font>
</center>
<center>
<font size=4><b>Acceso restringido</b></font>
</center>
<br>
</td>
<br>
<br>
</tr>
<td>Usuario:</td>
<td><input type='text' size=25 name='userid'><br></td>
</tr><br><br>
<tr>
<td>Contraseña:</td>
<td><input type='Password' size=25 name='pwd'><br></td>
<br><br>
</tr>
<tr>
<td><input type='submit' onclick='check(this.form)' value='Acceso'></td>
</tr>
</table>
</form>
<script>
function check(form)
{
if(form.userid.value=='admin' && form.pwd.value=='admin'){window.open('/serverIndex')}
else{alert('Error Password or Username')/*displays error message*/}
}
</script>
</body>
</html>
Your problem is the page is not correctly formatted it has missing doctype identifier <HTML> and </HTML> headers, you try it, it all works as expected with the headers and footers added.
Thanks a lot Dave for your response. I'm not sure I understand your answer. The code I posted yesterday looks unformatted because that's how the GitHub page uploaded it. I tried twice and both times it uploaded that way. In my project it is correctly formatted and works.
I added the OTA WebUpdater example's code to your TechNote 087's code in order to have an initial user/password page. Finally it works but I'd need to jump from there to your HomePage() function.
I guess that I have to replace the
"window.open('/serverIndex')"
statement with other one, but after googling two days I didn't find how to do that. I ask your help with the correct statement for replacing that code line.
I use your code for accessing the SD card in my ESP32 project and -as I pointed before- I had added the user/password code from the OTA WebUpdater example, so, when the ESP32 server receives a request from a client it first returns the user/password web page (from the OTA example) and if the entered parameters are correct it should open (jump to) your web home page using your HomePage() function. I have a very poor English and is hard to make myself understood. I apologize for that.
The server home page is an empty parameter, like this:
window.open('/')"
Sent from my iPad
Hi Dave, thanks again for your support. I followed your suggestion and It works now.
In your code I changed server.on("/", HomePage); to server.on("/homepage", HomePage); and in the HTML code I changed "window.open('/serverIndex')" to "window.open('/homepage')".
The initial web page now is the user/password page from the OTAWebUpdater example.
It seems now easy but I could not do it before.
On github you can give code quotes by enclosing in ‘’’ code ‘’’ but they must be backward quotes
On 12 Feb 2019, at 22:19, OslafEman [email protected] wrote:
Thanks a lot Dave for your response. I'm not sure I understand your answer. The code I posted yesterday looks unformatted because that's how the GitHub page uploaded it. I tried twice and both times it uploaded that way. In my project it is correctly formatted and works.
I added the OTA WebUpdater example's code to your TechNote 087's code in order to have an initial user/password page. Finally it works but I'd need to jump from there to your HomePage() function.
I guess that I have to replace the "window.open('/serverIndex')" statement with other one, but after googling two days I didn't find how to do that. I ask your help with the correct statement for replacing that code line.
I use your code for accessing the SD card in my ESP32 project and -as I pointed before- I had added the user/password code from the OTA WebUpdater example, so, when the ESP32 server receives a request from a client it first returns the user/password web page (from the OTA example) and if the entered parameters are correct it should open (jump to) your web home page using your HomePage() function. I have a very poor English and is hard to make myself understood. I apologize for that.
— You are receiving this because you commented. Reply to this email directly, view it on GitHub, or mute the thread.