control arduino through the web code example

Example 1: control arduino from website

<!DOCTYPE html> 
<html> 
<head>
<style>
.button {
background-color: #4CAF50;
border: 2px solid #4CAF50;;
color: white;
padding: 15px 32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
}
</style>
</head>
<body> 
<center><h1 style="color:blue;">ESP32 Web server LED controlling example</h1></center> 
<center><h2 style="color:black;">Web Server Example Microcontrollerslab.com</h2></center> 
<center><h2 style="color:Green;">Press "ON" button to turn on led and "OFF" button to turn off LED</h3></center> 
<form> 
<center>
<button class="button" name="LED0" value="ON" type="submit">LED0 ON</button> 
<button class="button" name="LED0" value="OFF" type="submit">LED0 OFF</button><br><br> 
<button class="button" name="LED1" value="ON" type="submit">LED1 ON</button> 
<button class="button" name="LED1" value="OFF" type="submit">LED1 OFF</button> <br><br>
<button class="button" name="LED2" value="ON" type="submit">LED2 ON</button> 
<button class="button" name="LED2" value="OFF" type="submit">LED2 OFF</button> 
</center>
</form> 
</body> 
</html>

Example 2: control arduino from website

if (header.indexOf("LED0=ON") != -1) 
{
Serial.println("GPIO23 LED is ON");
LED_ONE_STATE = "on";
digitalWrite(GPIO_PIN_NUMBER_22, HIGH);
} 
if (header.indexOf("LED0=OFF") != -1) 
{
Serial.println("GPIO23 LED is OFF");
LED_ONE_STATE = "off";
digitalWrite(GPIO_PIN_NUMBER_22, LOW);
} 
if (header.indexOf("LED1=ON") != -1)
{
Serial.println("GPIO23 LED is ON");
LED_TWO_STATE = "on";
digitalWrite(GPIO_PIN_NUMBER_23, HIGH);
}
if (header.indexOf("LED1=OFF") != -1) 
{
Serial.println("GPIO23 LED is OFF");
LED_TWO_STATE = "off";
digitalWrite(GPIO_PIN_NUMBER_23, LOW);
}
if (header.indexOf("LED2=ON") != -1) 
{
Serial.println("GPIO15 LED is ON");
LED_THREE_STATE = "on";
digitalWrite(GPIO_PIN_NUMBER_15, HIGH);
}
if(header.indexOf("LED2=OFF") != -1) {
Serial.println("GPIO15 LED is OFF");
LED_THREE_STATE = "off";
digitalWrite(GPIO_PIN_NUMBER_15, LOW);
}

Tags:

Html Example