Arduino Shield - Ethernet W5100 - Data via webbrowser

Dit voorbeeld laat zien hoe je gegevens (voorbeeld analoge pins) van de arduino kan tonen via een webbrowser, en zo de gegevens op afstand kan zien, het shield functioneert dan als een webserver.

Hardware: Arduino + Ethernet shield (W5100)

Wat heb je nodig?
Standaard wordt de ethernet bibliotheek al meegeleverd met de Arduino IDE

Script
Ik heb hieronder het standaard script uit de voorbeelden een beetje aangepast, vereenvoudigd en de commentaar regels vertaald.

Wat doet het script?
Het script geeft de waarden van de 6 analoge ingangen weer in een browser, het venster wordt elke 5 seconden ververst!
De HTML pagina wordt in-code gemaakt en opgebouwd, er bestaat geen HTML bestand.

#include <SPI.h> // Importeer de SPI bibliotheek.
#include <Ethernet.h>  // Importeer de ehternet bibliotheek.

// [INSTELLINGEN]
byte mac[] = {0xDE, 0xAD, 0xBE, 0xEF, 0xFE, 0xED}; // Vul het MAC address van de shield in (deze mag je ook verzinnen).
int poort = 80; //80 is standaard HTTP.
//Onderstaande IP invullen als je een vast ip wilt gebruiken.
//IPAddress ip(192, 168, 0, 109); // Kies een vast IP adres in de range van je subnet.

// Variabelen
EthernetServer server(poort); // Intialiseer de ethernet server bibliotheek met de poort om te gebruiken.

void setup() {
  Serial.begin(9600); // Start de seriele poort.
  //Ethernet.begin(mac, ip); // Start de ethernet connectie met vaste IP (zie boven)
  Ethernet.begin(mac); // Start de ethernet connectie.
  server.begin(); // Start de server.
  Serial.print("[-- De server is actief op IP: "); Serial.print(Ethernet.localIP()); Serial.println(" --]");
}

void loop() {
  // Luister naar aanvraag van clienten
  EthernetClient client = server.available();
  if (client) {
    // Er is een nieuwe client aanvraag.
    Serial.println("[-- Nieuwe client --]");
    // Elke HTTP aanvraag eindigd in een lege lijn.
    boolean currentLineIsBlank = true;
    while (client.connected()) {
      if (client.available()) {
        char c = client.read();
        Serial.write(c);

        if (c == '\n' && currentLineIsBlank) {
          // We hebben hier een nieuwe lijn ontvangen en de volgende lijn is leeg,
          // het verzoek is beeindigd, we kunnen nu een reactie terugsturen.

          // [HEADER] begin
          client.println("HTTP/1.1 200 OK");
          client.println("Content-Type: text/html");
          client.println("Connection: close");  // De connectie zal verbroken worden, nadat aan de aanvraag is voldaan.
          client.println("Refresh: 5");  // Ververs de pagina elke 5 seconden.
          client.println();
          // [HEADER] einde

          // [HTML] begin
          client.println("<!DOCTYPE HTML>");
          client.println("<html>");
          // Ga langs elke Analoge pin en schrijf de waarden weg.
          for (int analogChannel = 0; analogChannel < 6; analogChannel++) {
            int sensorReading = analogRead(analogChannel);
            client.print("Waarde analoge ingang "); client.print(analogChannel); client.print(" is: ");
            client.print(sensorReading); client.println("<br>");
          }
          client.println("</html>");
          break; // Dit is nodig om de connectie te beeindigen.
          // [HTML] einde
        }
        if (c == '\n') {currentLineIsBlank = true;} // Laatste karakter ontvangen van de client, start een nieuwe lijn met volgende karakters.
        else if (c != '\r') {currentLineIsBlank = false;} // Je hebt een nieuw karakter ontvangen van de client.
      }
    }
    delay(1); // Geef de browser wat tijd om de data te ontvangen.
    client.stop(); // Sluit de connectie.
    Serial.println("[-- Client verbroken --]"); Serial.println("");
  }
}

#include <SPI.h> // Importeer de SPI bibliotheek.

#include <Ethernet.h> // Importeer de ehternet bibliotheek.

// [INSTELLINGEN]

byte mac[] = {0xDE, 0xAD, 0xBE, 0xEF, 0xFE, 0xED}; // Vul het MAC address van de shield in (deze mag je ook verzinnen).

int poort = 80; //80 is standaard HTTP.

//Onderstaande IP invullen als je een vast ip wilt gebruiken.

//IPAddress ip(192, 168, 0, 109); // Kies een vast IP adres in de range van je subnet.

// Variabelen

EthernetServer server(poort); // Intialiseer de ethernet server bibliotheek met de poort om te gebruiken.

void setup() {

Serial.begin(9600); // Start de seriele poort.

//Ethernet.begin(mac, ip); // Start de ethernet connectie met vaste IP (zie boven)

Ethernet.begin(mac); // Start de ethernet connectie.

server.begin(); // Start de server.

Serial.print("[-- De server is actief op IP: "); Serial.print(Ethernet.localIP()); Serial.println(" --]");

}

void loop() {

// Luister naar aanvraag van clienten

EthernetClient client = server.available();

if (client) {

// Er is een nieuwe client aanvraag.

Serial.println("[-- Nieuwe client --]");

// Elke HTTP aanvraag eindigd in een lege lijn.

boolean currentLineIsBlank = true;

while (client.connected()) {

if (client.available()) {

char c = client.read();

Serial.write(c);

if (c == '\n' && currentLineIsBlank) {

// We hebben hier een nieuwe lijn ontvangen en de volgende lijn is leeg,

// het verzoek is beeindigd, we kunnen nu een reactie terugsturen.

// [HEADER] begin

client.println("HTTP/1.1 200 OK");

client.println("Content-Type: text/html");

client.println("Connection: close"); // De connectie zal verbroken worden, nadat aan de aanvraag is voldaan.

client.println("Refresh: 5"); // Ververs de pagina elke 5 seconden.

client.println();

// [HEADER] einde

// [HTML] begin

client.println("<!DOCTYPE HTML>");

client.println("<html>");

// Ga langs elke Analoge pin en schrijf de waarden weg.

for (int analogChannel = 0; analogChannel < 6; analogChannel++) {

int sensorReading = analogRead(analogChannel);

client.print("Waarde analoge ingang "); client.print(analogChannel); client.print(" is: ");

client.print(sensorReading); client.println("<br>");

}

client.println("</html>");

break; // Dit is nodig om de connectie te beeindigen.

// [HTML] einde

}

if (c == '\n') {currentLineIsBlank = true;} // Laatste karakter ontvangen van de client, start een nieuwe lijn met volgende karakters.

else if (c != '\r') {currentLineIsBlank = false;} // Je hebt een nieuw karakter ontvangen van de client.

}

delay(1); // Geef de browser wat tijd om de data te ontvangen.

client.stop(); // Sluit de connectie.

Serial.println("[-- Client verbroken --]"); Serial.println("");

}

Resultaat browser:

Resultaat Seriele monitor:

[-- De server is actief op IP: 192.168.0.109 --]
[-- Nieuwe client --]
GET / HTTP/1.1
Host: 192.168.0.109
Connection: keep-alive
Cache-Control: max-age=0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8
Upgrade-Insecure-Requests: 1
User-Agent: Mozilla/5.0 (Windows NT 6.3; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/45.0.2454.101 Safari/537.36
Referer: http://192.168.0.109/
Accept-Encoding: gzip, deflate, sdch
Accept-Language: nl-NL,nl;q=0.8,en-US;q=0.6,en;q=0.4

[-- Client verbroken --]

[-- Nieuwe client --]
GET /favicon.ico HTTP/1.1
Host: 192.168.0.109
Connection: keep-alive
User-Agent: Mozilla/5.0 (Windows NT 6.3; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/45.0.2454.101 Safari/537.36
Accept: */*
Referer: http://192.168.0.109/
Accept-Encoding: gzip, deflate, sdch
Accept-Language: nl-NL,nl;q=0.8,en-US;q=0.6,en;q=0.4

[-- Client verbroken --]

[-- De server is actief op IP: 192.168.0.109 --]

[-- Nieuwe client --]

GET / HTTP/1.1

Host: 192.168.0.109

Connection: keep-alive

Cache-Control: max-age=0

Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8

Upgrade-Insecure-Requests: 1

User-Agent: Mozilla/5.0 (Windows NT 6.3; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/45.0.2454.101 Safari/537.36

Referer: http://192.168.0.109/

Accept-Encoding: gzip, deflate, sdch

Accept-Language: nl-NL,nl;q=0.8,en-US;q=0.6,en;q=0.4

[-- Client verbroken --]

[-- Nieuwe client --]

GET /favicon.ico HTTP/1.1

Host: 192.168.0.109

Connection: keep-alive

User-Agent: Mozilla/5.0 (Windows NT 6.3; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/45.0.2454.101 Safari/537.36

Accept: */*

Referer: http://192.168.0.109/

Accept-Encoding: gzip, deflate, sdch

Accept-Language: nl-NL,nl;q=0.8,en-US;q=0.6,en;q=0.4

[-- Client verbroken --]

Ps. Bovenstaande client is de browser Chrome, je ziet dat deze browser ook altijd een aanvraag doet om het favicon.ico bestand op te halen.

Zoeken

Arduino Shield – Ethernet W5100 – Data via webbrowser