Project Description

Description:

A push button switch interfaced to the Arduino is read to see whether it is ON or OFF. The state of the switch is displayed on a web page. The Arduino with Ethernet shield is set up as a web server and accessed from a web browser.

35

Hardware:

Arduino Uno

Ethernet Shield w5500

Toggle Switch/Push Button.

Arduino Web Server Hardware for Reading the Switch

The switch is interfaced to the Arduino / Ethernet shield .The switch is connected to pin 3 and not pin 2 of the Arduino (the article actually uses the circuit diagram from one of the Arduino examples on the Arduino website).

 

Reading the Switch

The web page is created as usual, except that the function GetSwitchState() is called when the text for the switch is to be displayed.

In the GetSwitchState() function, the state of the switch is read. The text that is sent to the browser will be a HTML paragraph that contains either “ON” or “OFF”, depending of the state of the switch.

Refreshing the Browser

A line of HTML in the <head> part of the HTML page sent to the browser is used to tell the browser to refresh the page every second. This allows the new state of the switch to be displayed if it has changed.

The line of code in the sketch that does this is shown here:

This will be sent to the browser as the following HTML code:

Remember that you can right-click on the web page in your browser and then select View Page Source on the pop-up menu (or similar menu item depending on the browser you are using).

The “1” in the code tells the browser to refresh every 1 second.

This is the same method used to read the analog inputs of the Arduino in the WebServer example that is built into the Arduino software (found in the Arduino IDE under File → Examples → Ethernet → WebServer).

 

Demo:

This video shows the web server operating and the state of the switch being displayed in the web browser.The browser refreshes the web page every second, so it can take up to a second for the new state of the switch to be displayed after pressing or releasing the button.

Tags:201802,Arduino Uno,Ethernet Shield W5500,Toggle Switch

Author: