Ethernet Shield: caricamento immagine da sd

International Italiano Generale
1

Salve ragazzi,
praticamente, ho creato una pagina index che ho caricato sulla sd, con la quale controllo da remoto l'arduino... adesso ho cercato di migliorare la grafica, con i css ecc...
Solo che ho un problema: ho creato dei bottoni ai quali gli ho messo un'immagine di background (in particolare l'immagine di una lampadina) , utilizzando questo codice

<button type="button" id="LED1" onclick="GetButton1()" class="button" style="background-image: url(prova.png); "></button>

dove con style="background-image: url(prova.png), imposto l'immagine di sfondo... Fin quando apro il file index dal pc, l'immagine viene caricata perfettamente, invece, appena copio l'index.html e l'immagine nella sd, questa non viene visualizzata...
Io penso che il problema stia nel fatto che l'immagine non viene "trovata" correttamente nella sd, in quanto se provo a caricare l'immagine da internet con l'url background-image: url(http://www.prova.it/prova.png) questa viene visualizzata senza problemi...
Potete aiutarmi?

2

Che Arduino stai usando?
Ci mandi lo sketch completo?
Ciao Uwe

3

Arduino UNO
questo è lo sketch:

#include <SPI.h>
#include <Client.h>
#include <Ethernet.h>
#include <Server.h>
#include <SD.h>
// size of buffer used to capture HTTP requests
#define REQ_BUF_SZ   60

// MAC address from Ethernet shield sticker under board
byte mac[] = {  
  0x00, 0xAA, 0xBB, 0xCC, 0xDE, 0x02 };
byte ip[] = {192, 168, 1, 10};

//PORTA DI COMUNICAZIONE			
EthernetServer server(120);
File webFile;               // the web page file on the SD card
char HTTP_req[REQ_BUF_SZ] = {0}; // buffered HTTP request stored as null terminated string
char req_index = 0;              // index into HTTP_req buffer
boolean LED_state[3] = {0}; // stores the states of the LEDs

void setup()
{
    // disable Ethernet chip
    pinMode(10, OUTPUT);
    digitalWrite(10, HIGH);
    
    Serial.begin(9600);       // for debugging
    
    // 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.");
    // LEDs
    pinMode(16, OUTPUT);
    pinMode(9, OUTPUT);
    pinMode(8, OUTPUT);
    
    Ethernet.begin(mac, ip);  // initialize Ethernet device
    server.begin();           // start to listen for clients
}

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
                // limit the size of the stored received HTTP request
                // 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++;
                }
                // last line of client request is blank and ends with \n
                // respond to client only after last line received
                if (c == '\n' && currentLineIsBlank) {
                    // send a standard http response header
                    client.println("HTTP/1.1 200 OK");
                    // remainder of header follows below, depending on if
                    // web page or XML page is requested
                    // Ajax request - send XML file
                    if (StrContains(HTTP_req, "ajax_inputs")) {
                        // send rest of HTTP header
                        client.println("Content-Type: text/xml");
                        client.println("Connection: keep-alive");
                        client.println();
                        SetLEDs();
                        // send XML file containing input states
                        XML_response(client);
                    }
                    else {  // web page request
                        // send rest of HTTP header
                        client.println("Content-Type: text/html");
                        client.println("Connection: keep-alive");
                        client.println();
                        // send web page
                        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();
                        }
                    }
                    // display received HTTP request on serial port
                    Serial.print(HTTP_req);
                    // 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)
}

// checks if received HTTP request is switching on/off LEDs
// also saves the state of the LEDs
void SetLEDs(void)
{


    // LED 1 (pin 16)
    if (StrContains(HTTP_req, "LED1=1")) {
        LED_state[0] = 1;  // save LED state
        digitalWrite(16, HIGH);
    }
    else if (StrContains(HTTP_req, "LED1=0")) {
        LED_state[0] = 0;  // save LED state
        digitalWrite(16, LOW);
    }
    // LED 2 (pin 9)
    if (StrContains(HTTP_req, "LED2=1")) {
        LED_state[1] = 1;  // save LED state
        digitalWrite(9, HIGH);
    }
    else if (StrContains(HTTP_req, "LED2=0")) {
        LED_state[1] = 0;  // save LED state
        digitalWrite(9, LOW);
    }
    // LED 3 (pin 8)
    if (StrContains(HTTP_req, "LED3=1")) {
        LED_state[2] = 1;  // save LED state
        digitalWrite(8, HIGH);
    }
    else if (StrContains(HTTP_req, "LED3=0")) {
        LED_state[2] = 0;  // save LED state
        digitalWrite(8, LOW);
    }
}

// send the XML file with analog values, switch status
//  and LED status
void XML_response(EthernetClient cl)
{
    int analog_val;            // stores value read from analog inputs
    int count;                 // used by 'for' loops
    int sw_arr[] = {2, 3, 5};  // pins interfaced to switches
    
    cl.print("<?xml version = \"1.0\" ?>");
    cl.print("<inputs>");

    // LED1
    cl.print("<LED>");
    if (LED_state[0]) {
       cl.print("on");
    }
    else {
        cl.print("off");
    }
    cl.println("</LED>");
   
    // LED2  
    cl.print("<LED>"); 
    if (LED_state[1]) {
         cl.print("on");
    }
    else {
        cl.print("off");
    }
     cl.println("</LED>");
  
    // LED3
    cl.print("<LED>");
    if (LED_state[2]) {
        cl.print("on");
    }
    else {
        cl.print("off");
    }    
    cl.println("</LED>");
    // LED4
    
    cl.print("</inputs>");
}

// 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;
    }
}

// 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;
}
4

Senza controllare a lungo lo Sketch: Il Tuo problema é che usi troppa RAM.

Questo perché non usi la macro F() nei print /println e perché usi stringhe.

Ciao Uwe

5

Quindi cosa mi consiglieresti di fare per "alleggerire" ko sketch?

6

In effetti un bel taglio alla ram potresti darlo usando un po' di flash.

Però il problema di base è che non cè nulla nel tuo programma che analizzi la request che fa il client al server.
Quando il browser chiede ad arduino un file nel pacchetto di richiesta ci sono molte informazioni tra le quali appunto il nome del file e l'estensione

esempio

POST /foo.php HTTP/1.1
Host: localhost
User-Agent: Mozilla/5.0 (Windows; U; Windows NT 6.1; en-US; rv:1.9.1.5) Gecko/20091102 Firefox/3.5.5 (.NET CLR 3.5.30729)
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: en-us,en;q=0.5
Accept-Encoding: gzip,deflate
Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7
Keep-Alive: 300
Connection: keep-alive
Referer: http://localhost/test.php
Content-Type: application/x-www-form-urlencoded
Content-Length: 43

quel programma non è in grado di inviare file su richiesta, è vero che arduino spedisce index.htm, ma non è il browser a chiedere espressamente quel file, viene inviato automaticamente quando vede una connessione, però puoi dire al client di andare a prendere l'immagine su qualche sito a un link ben definito, come caricare ad esempio l'interprete javascript e altre parti utili sempre prelevate esternamente, in questo caso il peso delle immagini hanno poca importanza dato che le gestirà il pc o comunque un computer più potente di arduino..
Oppure cercare googlando un po' webserversd, webduinosd, tinywebserver, ecc
Dipende dalle tue conoscenze sul protocollo http, ti servirà un po' di javascript e html, però dubito che sulla UNO ci farai grandi cose hai troppa poca ram e velocità insufficiente per gestire SD, ethernet, e processi vari di base dello sketch.
Non è escluso che mentre arduino è impegnato a inviarti i dati o a leggere da SD si perda qualche commutazione su qualche pin e salti delle parti di controllo.

Intanto quei client.print e serial.print che hanno stringhe fisse puoi caricarli su flash come ti hanno detto post indietro, usando

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

http://playground.arduino.cc/Main/Printf

poi se togli Serial.begin(9600); e tutti i serialprint che non ti servono avrai qualche risorsa in più
ciao