Arduino Web Server Course

0 %

Course content

Uncategorized
- #0 Introduction
- #1 Requirements
- #2 Hello World 10 xp
  - Quiz
- #3 Set and clear output 10 xp
  - Quiz
- #4 Show input value 10 xp
  - Quiz
- #5 Send RS485 data 10 xp
  - Quiz

#3 Set and clear output

10 XP

Prev Next

Fullscreen Share

This chapter adds a couple of links to set and clear an output.

Add set and clear actions

The easiest way to add simple actions into the web page is to insert anchor HTML elements with associated action paths. The HTTP response from the server should contain these anchors:

client.println("HTTP/1.1 200 OK");
client.println("Content-Type: text/html");
client.println();
client.println( "<!doctype html><html><head><title>Hello PLC!</title></head><body><h1>Hello PLC!</h1><a href='/setOutput'>Set output</a><br><a href='/clearOutput'>Clear output</a><br></body></html>" );

Parse the request

Now the sketch should parse the request to set or clear the output, depending on the path. To do this, it gets the route from the first line of the request using a String object called path and some of its functions.

Some variables are needed:

String header; bool firstLine = true;

And the character received from the client is appended to the header:

if (firstLine) { header += c; }

When the request is complete, the sketch parses the header line to get the path:

int pos = header.indexOf(' '); String path = header.substring(pos + 1, header.indexOf(' ', pos + 1));

Remember to update the first Line variable when the client sends a ‘new line’ (\n) character:

if (c == '\n') { emptyLine = true; firstLine = false; } else if (c != '\r') { emptyLine = false; }

Set or clear an output depending on the path

The server should set output to HIGH when the path is equal to “/setOutput” and LOW when the path is equal to “/clearOutput”.

if (path.compareTo("/setOutput") == 0)
    { // Set output
    digitalWrite(Q0_0, HIGH);
    } else if (path.compareTo("/clearOutput") == 0) {
    // Clear output
    digitalWrite(Q0_0, LOW);
}

Final code review

Here is the whole code, with some improvements:

send a 404 error for unknown requests,
send a redirection response to the main page on set/clear command request,
add the sendMainPage()

#include <Ethernet2.h> // Server creation
EthernetServer server(80);
void setup() {
  Serial.begin(9600UL); Serial.println("WebServer started"); // Ethernet initialization
  byte mac[] = {0xDE, 0xAD, 0xBE, 0xEF, 0xFE, 0xED};
  byte ip[] = {10, 10, 10, 25}; Ethernet.begin(mac, ip); // Server initialization
  server.begin();
}

void loop() { // Wait for clients
  EthernetClient client = server.available();
  if (client) { // Parse request
    bool emptyLine = true;
    String header; bool firstLine = true;
    while (client.connected()) {
      if (client.available()) {
        char c = client.read();
        if (firstLine) {
          header += c;  // The request is finished when an empty line is received
        }
        if (emptyLine && (c == '\n')) { // Get path from the header line
          int pos = header.indexOf(' ');
          String path = header.substring(pos + 1, header.indexOf(' ', pos + 1)); // Act depending on path
          if (path.compareTo("/") == 0) {
            sendMainPage(client);
          }
          else if (path.compareTo("/setOutput") == 0) { // Set output
            digitalWrite(Q0_0, HIGH); // Redirect response
            redirectToMainPage(client);
          }
          else if (path.compareTo("/clearOutput") == 0) { // Clear output
            digitalWrite(Q0_0, LOW); // Redirect response
            redirectToMainPage(client);
          }
          else { // Unrecognized path
            sendNotFound(client);
          } client.flush(); // Close connection
          client.stop(); break;
        } // The request is finished when a blank line is received
        if (c == '\n') {
          emptyLine = true;
          firstLine = false;
        }
        else if (c != '\r') {
          emptyLine = false;
        }
      }
    }
  }
}

void sendNotFound(EthernetClient &client) { // Path not found
  client.println("HTTP/1.1 404 Not Found");
  client.println("Content-Type: text/plain");
  client.println();
  client.println("404 Not Found");
}

void redirectToMainPage(EthernetClient &client) { // Redirect to main page
  client.println("HTTP/1.1 303 See Other");
  client.println("Location: /");
  client.println();
}

void sendMainPage(EthernetClient &client) { // Send the response
  client.println("HTTP/1.1 200 OK");
  client.println("Content-Type: text/html");
  client.println(); client.println( "<!doctype html><html><head><title>Hello PLC!</title></head><body><h1>Hello PLC!</h1><a href='/setOutput'>Set output</a><br><a href='/clearOutput'>Clear output</a><br></body></html>" );
}