INFO: Dieses Forum nutzt Cookies...
Cookies sind für den Betrieb des Forums unverzichtbar. Mit der Nutzung des Forums erklärst Du dich damit einverstanden, dass wir Cookies verwenden.

Es wird in jedem Fall ein Cookie gesetzt um diesen Hinweis nicht mehr zu erhalten. Desweiteren setzen wir Google Adsense und Google Analytics ein.

Antwort schreiben 
 
Themabewertung:
  • 0 Bewertungen - 0 im Durchschnitt
  • 1
  • 2
  • 3
  • 4
  • 5
Ethernet-WebServer: Button-Belegung
31.05.2015, 15:45 (Dieser Beitrag wurde zuletzt bearbeitet: 31.05.2015 15:47 von 4711engel.)
Beitrag #1
Ethernet-WebServer: Button-Belegung
Hi,
ich möchte bei einem arduino ethernet webserver einen button so belegen, dass beim Drücken im sketch eine spezielle Funktion angesteuert und ausgeführt wird.
Ich will in dieser Funktion mittels adafruit-cam VC0706 dann ein Foto aufnehmen und auf SD-Card des boards speichern.

Aktuell ändert sich nur beim Drücken die URL und die Webpage schaltet um. Das ist natürlich nicht gewollt. Die Webpage soll sich nicht ändern und das Bild soll im Hintergrund erstellt und abgespeichert werden. Danach soll das Bild auf der WebPage abgedated werden.

Wer von den Programmierprofis hätte einen Tipp für mich Anfänger? Würde mir in meinem kleinen Projekt einen Schritt weiterhelfen.

Danke vorab.

Anhang: Der zugehörige sketch und die Webpage von der SD-Card


Angehängte Datei(en) Thumbnail(s)
       

.ino  Arduino_Ehernet_Camera----Neu1.ino (Größe: 9,58 KB / Downloads: 35)
.htm  index.htm (Größe: 585 Bytes / Downloads: 60)
Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
07.06.2015, 11:25
Beitrag #2
RE: Ethernet-WebServer: Button-Belegung
Hi, ich habe nun einige Dinge ausprobiert. Leider ohne Erfolg. Unterstützung seitens des Forums ist auch ausgeblieben. Ist schon frustierend.

Hier die aktuelle index.htm mit der webpage, die zusammen mit der Bilddatei auf der SD Card des ethernet shields gespeichert ist. Es soll ja das Ethernet shield als Webserver dienen.

Webserver:
https://www.dropbox.com/s/wy0u5dk1i333d2...4.jpg?dl=0


Code:
<!DOCTYPE html>

<html>

    <head>

        <title>Arduino Ethernet Camera</title>

    </head>

    <body BGColor=#D0F0D0>

        <h1 align=center><Big><TT>Arduino Ethernet Camera</TT></Big></H1>
        <TABLE Bordercolor=#000000 cellspacing=6 align=center border=0>
            <TD>
            <img src="IMAGE.JPG">
            </TD>
        </TABLE>
        <TABLE Bordercolor=#000000 cellspacing=6 align=center border=0>
            <TD>
               <form action="/TakingPicture" method="GET">
               <button name="Take Picture" type="submit">Take Picture</button>
               </form>
            </TD>
        </TABLE>
    </body>

</html>


Und hier nun der sketch, in dem die Webpage im browser aufgebaut wird und der button <Take Picture> abgefragt wird. Wird der Button vom Nutzer gedrückt, so soll die adafruit-cam VC0706 ein Bild aufnehmen und das auf der SD-Card abgelegte Bild überschreiben. Somit kann man anhand von Bildern auch aus der Ferne das Wetter beobachten.

Code:
/*--------------------------------------------------------------
          Arduino Ethernet Camera
Take a picture using the adafruit_vc0706 , save it on SD-Card
and print it over ethernet on a internet browser
                  Ulrich Engel
  CoAuthor:       W.A. Smith, http://startingelectronics.org
--------------------------------------------------------------*/

#include <SPI.h>
#include <Ethernet.h>
#include <SD.h>
#include <Adafruit_VC0706.h>
#include <SoftwareSerial.h>  

// size of buffer used to capture HTTP requests
#define REQ_BUF_SZ   20
#define chipSelect 4

// MAC address from Ethernet shield sticker under board
byte mac[] = {0x90, 0xA2, 0xDA, 0x0F, 0x1E, 0x28};
IPAddress ip(192, 168, 178, 45); // IP address, may need to change depending on network
byte gateway[] = { 192, 168, 178, 1 };
byte subnet[] = { 255, 255, 255, 0 };
EthernetServer server(80);  // create a server at port 80
File webFile;
char HTTP_req[REQ_BUF_SZ] = {0}; // buffered HTTP request stored as null terminated string
char req_index = 0;              // index into HTTP_req buffer


SoftwareSerial cameraconnection = SoftwareSerial(2, 3);
Adafruit_VC0706 cam = Adafruit_VC0706(&cameraconnection);

//*************************** void setup ********************************

void setup()
{
    // disable Ethernet chip
    pinMode(10, OUTPUT);
    digitalWrite(10, HIGH);
    
// Open serial communications:
  Serial.begin(9600);

// start the Ethernet connection and the server:
  Ethernet.begin(mac, ip, gateway, subnet);
  server.begin();

  Serial.print("server is at ");
  Serial.println(Ethernet.localIP());  

    
    // initialize SD card
    Serial.println("Initializing SD card...");
    if (!SD.begin(4)) {
        Serial.println("ERROR - SD card initialization failed!");
        return;    // init failed
    }
    Serial.println("SUCCESS - SD card initialized.");
    // check for index.htm file
    if (!SD.exists("index.htm")) {
        Serial.println("ERROR - Can't find index.htm file!");
        return;  // can't find index file
    }
    Serial.println("SUCCESS - Found index.htm file.");
    
}

// **************  void loop  ***********************

void loop()
{
  EthernetClient client = server.available();  // try to get client

    if (client) {  // got client?
        boolean currentLineIsBlank = true;
        while (client.connected()) {
            if (client.available()) {   // client data available to read
                char c = client.read(); // read 1 byte (character) from client
                // buffer first part of HTTP request in HTTP_req array (string)
                // leave last element in array as 0 to null terminate string (REQ_BUF_SZ - 1)

               if (req_index < (REQ_BUF_SZ - 1)) {
                    HTTP_req[req_index] = c;          // save HTTP request character
                    req_index++;
                }

                // print HTTP request character to serial monitor
                Serial.print(c);
                // last line of client request is blank and ends with \n
                // respond to client only after last line received
                if (c == '\n' && currentLineIsBlank) {
                    // open requested web page file
                    if (StrContains(HTTP_req, "GET / ")
                                 || StrContains(HTTP_req, "GET /index.htm")) {
                        client.println("HTTP/1.1 200 OK");
                        client.println("Content-Type: text/html");
                        client.println("Connnection: close");
                        client.println();
                        webFile = SD.open("index.htm");        // open web page file
                    }

                    if (StrContains(HTTP_req, "GET /IMAGE.JPG")) {
                        webFile = SD.open("IMAGE.JPG");
                        if (webFile) {
                            client.println("HTTP/1.1 200 OK");
                            client.println();
                        }
                    }
          
          
          
               if (StrContains(HTTP_req, "GET /TakingPicture")) {
                              client.println("HTTP/1.1 200 OK");
                              client.println("Content-Type: text/html");
                             client.println("Connnection: close");
                             client.println();  
                        
                          Serial.println("Button -Take a Picture- pressed!");                        
                        
                            
                          Serial.println("VC0706 Camera snapshot test");
                          Serial.println("");
/*                        
                        
                              // Try to locate the camera
                             if (cam.begin()) {
                                 Serial.println("Camera Found:");
                              } else {
                                 Serial.println("No camera found?");
                                 return;
                               }

                               // Existing image remove
                         //      SD.remove("IMAGE.JPG");

                               // Set the picture size - you can choose one of 640x480, 320x240 or 160x120
                                  //cam.setImageSize(VC0706_640x480);        // biggest
                                  cam.setImageSize(VC0706_320x240);        // medium
                                  //cam.setImageSize(VC0706_160x120);          // small

                               // You can read the size back from the camera (optional, but maybe useful?)
                                  uint8_t imgsize = cam.getImageSize();
                                  if (imgsize == VC0706_640x480) Serial.println("640x480");
                                  if (imgsize == VC0706_320x240) Serial.println("320x240");
                                  if (imgsize == VC0706_160x120) Serial.println("160x120");

                                  Serial.println("Snap in 3 secs...");
                                    delay(3000);

                                   if (! cam.takePicture())
                                       Serial.println("Failed to snap!");
                                    else
                                       Serial.println("Picture taken!");
  
                                    // Create an image with the name IMAGE.JPG
                                       char filename[10];
                                       strcpy(filename, "IMAGE.JPG");
                                    // Open the file for writing
                                       File imgFile = SD.open(filename, FILE_WRITE);

                                    // Get the size of the image (frame) taken  
                                       uint16_t jpglen = cam.frameLength();
                                       Serial.print("Storing ");
                                       Serial.print(jpglen, DEC);
                                       Serial.print(" byte image.");

                                       int32_t time = millis();
                                       pinMode(4, OUTPUT);
                                       // Read all the data up to # bytes!
                                       byte wCount = 0; // For counting # of writes
                                     while (jpglen > 0) {
                                       // read 32 bytes at a time;
                                       uint8_t *buffer;
                                       uint8_t bytesToRead = min(32, jpglen); // change 32 to 64 for a speedup but may not work with all setups!
                                       buffer = cam.readPicture(bytesToRead);
                                       imgFile.write(buffer, bytesToRead);
                                       jpglen -= bytesToRead;
                                      }
                                       imgFile.close();
                                       time = millis() - time;
                                       Serial.println("done!");
                                       Serial.print(time); Serial.println(" ms elapsed");
                        
                                      webFile = SD.open("index.htm");       // open web page file
  */                                    
                                   }
        
      
          
                    if (webFile) {
                        while(webFile.available()) {
                            client.write(webFile.read()); // send web page to client
                        }
                        webFile.close();
                    }
                    
                    // reset buffer index and all buffer elements to 0
                    req_index = 0;
                    StrClear(HTTP_req, REQ_BUF_SZ);
                    break;
                }
                // every line of text received from the client ends with \r\n
                if (c == '\n') {
                    // last character on line of received text
                    // starting new line with next character read
                    currentLineIsBlank = true;
                }
                else if (c != '\r') {
                    // a text character was received from client
                    currentLineIsBlank = false;
                }
            } // end if (client.available())
        } // end while (client.connected())
        delay(1);      // give the web browser time to receive the data
        client.stop(); // close the connection
    } // end if (client)
}

/**********************StrClear *********************/

// sets every element of str to 0 (clears array)
void StrClear(char *str, char length)
{
    for (int i = 0; i < length; i++) {
        str[i] = 0;
    }
}

/**********************StrContains *********************/

// searches for the string sfind in the string str
// returns 1 if string found
// returns 0 if string not found
char StrContains(char *str, char *sfind)
{
    char found = 0;
    char index = 0;
    char len;

    len = strlen(str);
    
    if (strlen(sfind) > len) {
        return 0;
    }
    while (index < len) {
        if (str[index] == sfind[found]) {
            found++;
            if (strlen(sfind) == found) {
                return 1;
            }
        }
        else {
            found = 0;
        }
        index++;
    }

    return 0;
}

Da der Button Teil noch nicht funktioniert, habe ich nur eine Serial.print Zeile eingefügt zum debuggen.

Vielleicht findet sich in diesem Forum doch noch jemand, der eine Idee hat. Ich bin eben doch erst ein Arduino-Stzarter. Da fehlt mir die Erfahrung.
Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
07.06.2015, 11:48
Beitrag #3
RE: Ethernet-WebServer: Button-Belegung
Hallo,

keine Ahnung, was Dein Webserver so kann. Dynamische Seiten baue ich normal mit Ajax für die Aktualisierung einzelner Elemente auf der Seite und Buttons / Werte werden mittels PHP ausgewertet. Allerdings hängt bei mir immer noch ein Raspberry Pi als Webfrontend dazwischen, welcher sich mit den AVRs 'unterhält'.

Die Ajax-Geschichte macht der Browser. Bleibt nur die Abfrage z.B. mittels PHP. Dieses müsste dann eine globale Variable ändern, so dass die Mainloop / das bestimmte Sub darauf reagieren kann. Statt PHP geht auch ein eigenes Protokoll, welches Die POST-Daten, bzw. die URL auf Parameter analysiert.

Dann würde ich den Cache im Browser abschalten, da sonst geänderte Informationen nicht gleich dargestellt werden. Das geht auch per HTML-Tag.
Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
07.06.2015, 11:56 (Dieser Beitrag wurde zuletzt bearbeitet: 07.06.2015 11:58 von Thorsten Pferdekämper.)
Beitrag #4
RE: Ethernet-WebServer: Button-Belegung
(07.06.2015 11:25)4711engel schrieb:  Unterstützung seitens des Forums ist auch ausgeblieben. Ist schon frustierend.
Hi,
tja, das kann mehrere Gründe haben. Zum Beispiel, dass sich in einem Arduino-Forum nicht viele mit HTTP-Feinheiten auskennen. ...oder vielleicht, dass niemand Lust hat, sich durch so viel Coding zu wühlen. ...oder aber, dass es nicht ganz klar ist, wo eigentlich das Problem liegt.
Fangen wir mal mit letzterem an. Ich nehme an, dass das Problem nur ist, dass die komplette Seite neu geladen wird, statt nur das Bild zu ersetzen. Das kann man wahrscheinlich mit Javascript hinbekommen. Etwa sowas wie:
Code:
<button name="Take Picture" type="button"
         onClick="document['DasBild'].src = 'TakingPicture';">
    Take Picture
</button>

Das img-Tag braucht dann natürlich noch ein name='DasBild' oder so.
Ohne Gewähr, ich habe das nicht ausprobiert.
Was mir noch einfällt: TakingPicture muss dann natürlich das Bild liefern und nicht die index.html.
Gruß,
Thorsten

Falls ich mit einer Antwort helfen konnte, wuerde ich mich freuen, ein paar Fotos oder auch ein kleines Filmchen des zugehoerigen Projekts zu sehen.
Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
07.06.2015, 12:00
Beitrag #5
RE: Ethernet-WebServer: Button-Belegung
Hi peterfido,
leider habe ich kein Wörterbuch zur Hand, um deinen Post zu verstehen. Spaß beiseite. Ich bin ein totaler Anfänger, was die Programmierung des Arduino und von Webseiten betrifft. Ich habe bislang nur kleine Sachen gemacht, wo ich viel Input auch über diverse Tutorials erhalten habe. Dieses hat auch bis dato gelangt.
Damit habe ich dann z.B. mit einem UNO und einem Ethernet shield Sensor-Daten ausgelesen und über Internet konnte ich diese dann z.B. auf meinem Handy lesen. Dazu habe ich die Befehle für die Wbseite gleich mit client.print ... in den Sketch geschrieben. Nun will ich dieses erweitern und neben dem Auslesen der Wetterdaten bei mir dem Nutzer auch die Möglichkeit geben, durch betätigen eines Button auf der Webpage bei mir ein "Wetterfoto" zu machen und auf der Webpage zu sehen. D.h. betätigt er den Button, so erstellt die am ethernet shield verbundene adafruit-cam VC0706 ein Foto und speicher es auf der SD-Card ab. Wie im snapshot-example zur cam-library. Bilder aufnehmen und abspeichern funktioniert lokal gut.
Was nur nicht klappt ist die "Fernauslösung" über den Button. Hier fehlt mir einfach die Erfahrung, wie man den <form> Tg richtig machen muss und wie man im sketch den button richtig ausliest, um dann im Hintergrund mittels cam das Foto auf der SD updaten zu können.

Vielleicht gibt es über das Forum Hilfe für mich als Anfänger.
MfG
Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
07.06.2015, 12:05
Beitrag #6
RE: Ethernet-WebServer: Button-Belegung
(07.06.2015 12:00)4711engel schrieb:  Vielleicht gibt es über das Forum Hilfe für mich als Anfänger.
Was soll das denn jetzt? Was ist mit meiner Antwort?

Falls ich mit einer Antwort helfen konnte, wuerde ich mich freuen, ein paar Fotos oder auch ein kleines Filmchen des zugehoerigen Projekts zu sehen.
Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
07.06.2015, 12:12
Beitrag #7
RE: Ethernet-WebServer: Button-Belegung
Hallo Herr Pferdekämprer,
Sie haben natürlich vollkommen Recht. Viel Code, den ich gepostet habe um mich verständlich zu machen. Vielleicht auch ein Anfängerproblem.

Nun mein Problem ist eigentlich vorrangig noch nicht der Refresh der ganzen Seite. Das wäre dann die Kosmetik zum Schluss.
Der Arduino und das Ethernet shield sollen ja als Webserver dienen. Auf der SD-Card ist die Webpage index.htm mit dem benötigten dort abgebildeten IMAGE.JPG.
Wenn der User nun im Browser irgentwo die Webpage öffnet und dann den Button darauf betätigt, dann soll über die am ethernet shield angeschlossene Cam (Pin 2 und 3 für TX und RX) ein neues "Wetterbild" IMAGE.JPG erstellt und auf SD die alte Datei upgedated werden. Wenn dann die Webpage refreshed wird, wird auch das neue Bild angezeigt. fertig. So die Idee.

MfG
Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
07.06.2015, 12:14
Beitrag #8
RE: Ethernet-WebServer: Button-Belegung
(07.06.2015 12:12)4711engel schrieb:  Hallo Herr Pferdekämprer,
Oha, wie förmlich... Ich hoffe, dass das nicht auch von mir erwartet wird.

Zitat:Der Arduino und das Ethernet shield sollen ja als Webserver dienen. Auf der SD-Card ist die Webpage index.htm mit dem benötigten dort abgebildeten IMAGE.JPG.
Wenn der User nun im Browser irgentwo die Webpage öffnet und dann den Button darauf betätigt, dann soll über die am ethernet shield angeschlossene Cam (Pin 2 und 3 für TX und RX) ein neues "Wetterbild" IMAGE.JPG erstellt und auf SD die alte Datei upgedated werden. Wenn dann die Webpage refreshed wird, wird auch das neue Bild angezeigt. fertig. So die Idee.
Also was das Endergebnis sein soll hatte ich auch vorher verstanden. Ich hatte nur nicht verstanden, was das Problem dabei ist. Könntest Du mal detailliert beschreiben, was das System macht und was Du daran falsch findest?

Falls ich mit einer Antwort helfen konnte, wuerde ich mich freuen, ein paar Fotos oder auch ein kleines Filmchen des zugehoerigen Projekts zu sehen.
Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
Antwort schreiben 


Möglicherweise verwandte Themen...
Thema: Verfasser Antworten: Ansichten: Letzter Beitrag
  Arduino UNO und Ethernet Shield 2 POE und Fritzbox 3272 tr3 2 155 19.11.2016 10:46
Letzter Beitrag: tr3
  ESP8266 ESP12-E Webserver-Frage Claus_M 8 243 14.11.2016 22:02
Letzter Beitrag: Claus_M
  Webserver + Bild als Hintergrund ?! Marc2014 8 246 11.10.2016 21:39
Letzter Beitrag: Bitklopfer
  Ethernet Modul Enc28j60 Pin13 LED Schalten BennIY 16 502 27.09.2016 20:30
Letzter Beitrag: BennIY
  ESP8266 Webserver Programmieren HDT 11 762 23.08.2016 13:28
Letzter Beitrag: HDT
  Hilfe gesucht. Webserver Statsiche und Dynamische HTMl Seite b3ta 11 449 22.08.2016 08:07
Letzter Beitrag: b3ta
  ESP8266 Webserver Marc2014 0 347 30.07.2016 20:15
Letzter Beitrag: Marc2014
Question Webserver, Client, Loop Marc2014 6 364 29.07.2016 21:04
Letzter Beitrag: Marc2014
Sad Die Grafik Kontakt/Pin Belegung ATtiny 85 malsehen 3 258 15.07.2016 19:31
Letzter Beitrag: hotsystems
  Frage zu One Button in Kombination mit Fast LED Wolfgang_2801 3 238 26.06.2016 22:11
Letzter Beitrag: hotsystems

Gehe zu:


Benutzer, die gerade dieses Thema anschauen: 1 Gast/Gäste