Go Down

Topic: Pagina Web num cartão SD (Read 11781 times) previous topic - next topic

nunoagameiro


Boas. Já fiz várias pesquisas mas não consegui encontrar o que pretendo.

Tenho o Ethernet Shield com o cartão SD, e o que precisava era de criar 2 ou 3 paginas de internet no cartão, e, usando o Arduino como Web Server, visualizar essas mesmas páginas.  Até aqui não hé grande dúvida, pois existem vários exemplos na net. 

É possível, a partir de uma página HTML guardada no cartão SD, enviar sinais para o Arduino, para ligar e desligar, por exemplo, uma relay ?

Obrigado

bubulindo

Sim.

http://www.youtube.com/watch?v=-wSKX5DYMiI
http://www.hobbyist.co.nz/?q=web-switch-tutorial
http://www.samratamin.com/Ardumote_Tutorial.html

O arduino serve uma página Web para o computador, e ao clicar num link, ou num botão, o browser faz um pedido de página ao Arduino e ele através desse pedido, liga ou desliga o relé.

Vê os links que postei.
This... is a hobby.

nunoagameiro


Obrigado.

Acho que não consegui explicar muito bem o que pretendo. Eu consigo processar pedidos para o Arduino através de uma página alocada na memória do Arduino. Já encontrei exemplos que o fazem, com este por exemplo:

Code: [Select]

//simple button GET server code to control servo and arduino pin 5
//for use with IDE 1.0
//open serial monitor to see what the arduino receives
//use the \ slash to escape the " in the html
//for use with W5100 based ethernet shields
//Powering a servo from the arduino usually DOES NOT WORK.
//note that the below bug fix may be required
// http://code.google.com/p/arduino/issues/detail?id=605

#include <SPI.h>
#include <Ethernet.h>

#include <Servo.h>
Servo myservo;  // create servo object to control a servo

byte mac[] = { 0xDE, 0xAD, 0xBE, 0xEF, 0xFE, 0xED }; //physical mac address
byte ip[] = { 192, 168, 1, 3 }; // ip in lan
byte gateway[] = { 192, 168, 1, 1 }; // internet access via router
byte subnet[] = { 255, 255, 255, 0 }; //subnet mask
EthernetServer server(8080); //server port

String readString;

//////////////////////

void setup(){

  pinMode(8, OUTPUT); //pin selected to control
  //start Ethernet
  Ethernet.begin(mac, ip, gateway, subnet);
  server.begin();
  //the pin for the servo co
  //enable serial data print
  Serial.begin(9600);
  Serial.println("server LED test 1.0"); // so I can keep track of what is loaded
}

void loop(){
  // Create a client connection
  EthernetClient client = server.available();
  if (client) {
    while (client.connected()) {
      if (client.available()) {
        char c = client.read();

        //read char by char HTTP request
        if (readString.length() < 100) {

          //store characters to string
          readString += c;
          //Serial.print(c);
        }

        //if HTTP request has ended
        if (c == '\n') {

          ///////////////
          Serial.println(readString); //print to serial monitor for debuging

          client.println("HTTP/1.1 200 OK"); //send new page
          client.println("Content-Type: text/html");
          client.println();

          client.println("<HTML>");
          client.println("<HEAD>");
          client.println("<meta name='apple-mobile-web-app-capable' content='yes' />");
          client.println("<meta name='apple-mobile-web-app-status-bar-style' content='black-translucent' />");
          client.println("<link rel='stylesheet' type='text/css' href='http://homeautocss.net84.net/a.css' />");
          client.println("<TITLE>Computer Automation</TITLE>");
          client.println("</HEAD>");
          client.println("<BODY>");
          client.println("<H1>Computer Automation</H1>");
          client.println("<hr />");
          client.println("<br />");
         
          client.println("<a href=\"/?computer_on\"\">Turn On Computer</a>");
          client.println("<a href=\"/?computer_off\"\">Turn Off Computer</a><br />");       
         

          client.println("</BODY>");
          client.println("</HTML>");

          delay(1);
          //stopping client
          client.stop();

          ///////////////////// control arduino pin
          if(readString.indexOf("?computer_on") >0)//checks for on
          {
            digitalWrite(8, HIGH);    // set pin 4 high
            Serial.println("Led On");
          }
          else{
          if(readString.indexOf("?computer_off") >0)//checks for off
          {
            digitalWrite(8, LOW);    // set pin 4 low
            Serial.println("Led Off");
          }
          }
          //clearing string for next read
          readString="";

        }
      }
    }
  }
}[/size][/size][/size]


O que pretendia agora, era colocar a página completa no cartão SD. Por exemplo, colocar no cartão um 'index.html', onde tinha um link para uma segunda página, e nessa página ter a possibilidade de accionar a relé.

bubulindo

E exactamente o que é que não sabes fazer?

Postaste um exemplo que faz o que pretendes, se queres que a página saia do cartão SD, escreves isto:
Code: [Select]
client.println("<HTML>");
          client.println("<HEAD>");
          client.println("<meta name='apple-mobile-web-app-capable' content='yes' />");
          client.println("<meta name='apple-mobile-web-app-status-bar-style' content='black-translucent' />");
          client.println("<link rel='stylesheet' type='text/css' href='http://homeautocss.net84.net/a.css' />");
          client.println("<TITLE>Computer Automation</TITLE>");
          client.println("</HEAD>");
          client.println("<BODY>");
          client.println("<H1>Computer Automation</H1>");
          client.println("<hr />");
          client.println("<br />");
         
          client.println("<a href=\"/?computer_on\"\">Turn On Computer</a>");
          client.println("<a href=\"/?computer_off\"\">Turn Off Computer</a><br />");       
         

          client.println("</BODY>");
          client.println("</HTML>");

sem os client.println(), num index.html e usas a biblioteca SD para aceder ao cartão puxar o ficheiro index.html para memória, e responder ao computador que fez o pedido. :\
This... is a hobby.

nunoagameiro

Pfuiu. Já funciona  :)  Muito obrigado pela ajuda. Agora é HTML e uma limpeza ao código do arduino.

Code: [Select]

#include <SPI.h>
#include <SdFat.h>
#include <SdFatUtil.h>
#include <Ethernet.h>

/************ ETHERNET STUFF ************/
byte mac[] = { 0xDE, 0xAD, 0xBE, 0xEF, 0xFE, 0xED }; //physical mac address
byte ip[] = { 192, 168, 1, 3 }; // ip in lan
byte gateway[] = { 192, 168, 1, 1 }; // internet access via router
byte subnet[] = { 255, 255, 255, 0 }; //subnet mask
EthernetServer server(8080); //server port
char rootFileName[] = "index.htm";


/************ SDCARD STUFF ************/
Sd2Card card;
SdVolume volume;
SdFile root; 
SdFile file;
String readString;

// store error strings in flash to save RAM
#define error(s) error_P(PSTR(s))

void error_P(const char* str) {
  PgmPrint("error: ");
  SerialPrintln_P(str);
  if (card.errorCode()) {
    PgmPrint("SD error: ");
    Serial.print(card.errorCode(), HEX);
    Serial.print(',');
    Serial.println(card.errorData(), HEX);
  }
  while(1);
}

void setup() {
  Serial.begin(9600);

  PgmPrint("Free RAM: ");
  Serial.println(FreeRam()); 
 
  // initialize the SD card at SPI_HALF_SPEED to avoid bus errors with
  // breadboards.  use SPI_FULL_SPEED for better performance.
  pinMode(10, OUTPUT);                       // set the SS pin as an output (necessary!)
  digitalWrite(10, HIGH);                    // but turn off the W5100 chip!

pinMode(8, OUTPUT); //pin selected to control

  if (!card.init(SPI_HALF_SPEED, 4)) error("card.init failed!");
 
  // initialize a FAT volume
  if (!volume.init(&card)) error("vol.init failed!");

  PgmPrint("Volume is FAT");
  Serial.println(volume.fatType(),DEC);
  Serial.println();

  if (!root.openRoot(&volume)) error("openRoot failed");

  // list file in root with date and size
  PgmPrintln("Files found in root:");
  root.ls(LS_DATE | LS_SIZE);
  Serial.println();

  // Recursive list of all directories
  PgmPrintln("Files found in all dirs:");
  root.ls(LS_R);

  Serial.println();
  PgmPrintln("Done");
   
  // Debugging complete, we start the server!
  Ethernet.begin(mac, ip);
  server.begin();
}

// How big our line buffer should be. 100 is plenty!
#define BUFSIZ 100

void loop()
{

  char clientline[BUFSIZ];
  char *filename;
  int index = 0;
  int image = 0;
 
  EthernetClient client = server.available();
    if (client) {
    // an http request ends with a blank line
    boolean current_line_is_blank = true;
   
    // reset the input buffer
    index = 0;
   
      while (client.connected()) {
        if (client.available()) {
          char c = client.read();
         
          //read char by char HTTP request
        if (readString.length() < 100) {

          //store characters to string
          readString += c;
          //Serial.print(c);
         
        }
        // If it isn't a new line, add the character to the buffer
        //if (c == '\n') {
        if (c != '\n' && c != '\r') {
         
          Serial.println(readString); //print to serial monitor for debuging
           
          clientline[index] = c;
          index++;
          // are we too big for the buffer? start tossing out data
          if (index >= BUFSIZ)
            index = BUFSIZ -1;
           
          // continue to read more data!
          continue;
        }
         
        // got a \n or \r new line, which means the string is done
        clientline[index] = 0;
        filename = 0;
       
        // Print it out for debugging
        Serial.println(clientline);
       
        // Look for substring such as a request to get the root file
        if (strstr(clientline, "GET / ") != 0) {
          filename = rootFileName;
        }
        if (strstr(clientline, "GET /") != 0) {
          // this time no space after the /, so a sub-file
         
          if (!filename) filename = clientline + 5; // look after the "GET /" (5 chars)
          // a little trick, look for the " HTTP/1.1" string and
          // turn the first character of the substring into a 0 to clear it out.
          (strstr(clientline, " HTTP"))[0] = 0;
         
          // print the file we want
          Serial.println(filename);
         
          if (! file.open(&root, filename, O_READ)) {
            client.println("HTTP/1.1 404 Not Found");
            client.println("Content-Type: text/html");
            client.println();
            client.println("<h2>File Not Found!</h2>");
            break;
          }
         
          Serial.println("Opened!");
         
          client.println("HTTP/1.1 200 OK");
          if (strstr(filename, ".htm") != 0)
             client.println("Content-Type: text/html");
         else if (strstr(filename, ".css") != 0)
             client.println("Content-Type: text/css");
         else if (strstr(filename, ".png") != 0)
             client.println("Content-Type: image/png");
          else if (strstr(filename, ".jpg") != 0)
             client.println("Content-Type: image/jpeg");
         else if (strstr(filename, ".gif") != 0)
             client.println("Content-Type: image/gif");
         else if (strstr(filename, ".3gp") != 0)
             client.println("Content-Type: video/mpeg");
         else if (strstr(filename, ".pdf") != 0)
             client.println("Content-Type: application/pdf");
         else if (strstr(filename, ".js") != 0)
             client.println("Content-Type: application/x-javascript");
         else if (strstr(filename, ".xml") != 0)
             client.println("Content-Type: application/xml");
         else
             client.println("Content-Type: text");

          client.println();
         
          int16_t c;
          while ((c = file.read()) >= 0) {
              // uncomment the serial to debug (slow!)
              //Serial.print((char)c);
              client.print((char)c);
          }
          file.close();
        } else {
          // everything else is a 404
          client.println("HTTP/1.1 404 Not Found");
          client.println("Content-Type: text/html");
          client.println();
          client.println("<h2>File Not Found!</h2>");
           }
        break;
      }
    }
    // give the web browser time to receive the data
    delay(1);
    client.stop();
   
    ///////////////////// control arduino pin
          if(readString.indexOf("?computer_on") >0)//checks for on
          {
            digitalWrite(8, HIGH);    // set pin 4 high
            Serial.println("Led On");
          }
          else{
          if(readString.indexOf("?computer_off") >0)//checks for off
          {
            digitalWrite(8, LOW);    // set pin 4 low
            Serial.println("Led Off");
          }
          }
          //clearing string for next read
          readString="";
  }
}

ginatto

Como exatamente o código chamará um arquivo .html do cartão SD?

E exactamente o que é que não sabes fazer?

Postaste um exemplo que faz o que pretendes, se queres que a página saia do cartão SD, escreves isto:
Code: [Select]
client.println("<HTML>");
          client.println("<HEAD>");
          client.println("<meta name='apple-mobile-web-app-capable' content='yes' />");
          client.println("<meta name='apple-mobile-web-app-status-bar-style' content='black-translucent' />");
          client.println("<link rel='stylesheet' type='text/css' href='http://homeautocss.net84.net/a.css' />");
          client.println("<TITLE>Computer Automation</TITLE>");
          client.println("</HEAD>");
          client.println("<BODY>");
          client.println("<H1>Computer Automation</H1>");
          client.println("<hr />");
          client.println("<br />");
         
          client.println("<a href=\"/?computer_on\"\">Turn On Computer</a>");
          client.println("<a href=\"/?computer_off\"\">Turn Off Computer</a><br />");       
         
 
          client.println("</BODY>");
          client.println("</HTML>");

sem os client.println(), num index.html e usas a biblioteca SD para aceder ao cartão puxar o ficheiro index.html para memória, e responder ao computador que fez o pedido. :\

luisilva

Como exatamente o código chamará um arquivo .html do cartão SD?

Por exemplo, como está feito:
Code: [Select]
void loop()
{

  char clientline[BUFSIZ];
  char *filename;
  int index = 0;
  int image = 0;

  EthernetClient client = server.available();
  if (client) {
    // an http request ends with a blank line
    boolean current_line_is_blank = true;

    // reset the input buffer
    index = 0;

    while (client.connected()) {
      if (client.available()) {
        char c = client.read();

        //read char by char HTTP request
        if (readString.length() < 100) {

          //store characters to string
          readString += c;
          //Serial.print(c);

        }
        // If it isn't a new line, add the character to the buffer
        //if (c == '\n') {
        if (c != '\n' && c != '\r') {

          Serial.println(readString); //print to serial monitor for debuging

            clientline[index] = c;
          index++;
          // are we too big for the buffer? start tossing out data
          if (index >= BUFSIZ)
            index = BUFSIZ -1;

          // continue to read more data!
          continue;
        }

        // got a \n or \r new line, which means the string is done
        clientline[index] = 0;
        filename = 0;

        // Print it out for debugging
        Serial.println(clientline);

        // Look for substring such as a request to get the root file
        if (strstr(clientline, "GET / ") != 0) {
          filename = rootFileName;
        }
        if (strstr(clientline, "GET /") != 0) {
          // this time no space after the /, so a sub-file

          if (!filename) filename = clientline + 5; // look after the "GET /" (5 chars)
          // a little trick, look for the " HTTP/1.1" string and
          // turn the first character of the substring into a 0 to clear it out.
          (strstr(clientline, " HTTP"))[0] = 0;

          // print the file we want
          Serial.println(filename);

          if (! file.open(&root, filename, O_READ)) {
            client.println("HTTP/1.1 404 Not Found");
            client.println("Content-Type: text/html");
            client.println();
            client.println("<h2>File Not Found!</h2>");
            break;
          }

          Serial.println("Opened!");

          client.println("HTTP/1.1 200 OK");
          if (strstr(filename, ".htm") != 0)
            client.println("Content-Type: text/html");
          else if (strstr(filename, ".css") != 0)
            client.println("Content-Type: text/css");
          else if (strstr(filename, ".png") != 0)
            client.println("Content-Type: image/png");
          else if (strstr(filename, ".jpg") != 0)
            client.println("Content-Type: image/jpeg");
          else if (strstr(filename, ".gif") != 0)
            client.println("Content-Type: image/gif");
          else if (strstr(filename, ".3gp") != 0)
            client.println("Content-Type: video/mpeg");
          else if (strstr(filename, ".pdf") != 0)
            client.println("Content-Type: application/pdf");
          else if (strstr(filename, ".js") != 0)
            client.println("Content-Type: application/x-javascript");
          else if (strstr(filename, ".xml") != 0)
            client.println("Content-Type: application/xml");
          else
            client.println("Content-Type: text");

          client.println();

          int16_t c;
          while ((c = file.read()) >= 0) {
            // uncomment the serial to debug (slow!)
            //Serial.print((char)c);
            client.print((char)c);
          }
          file.close();
        }
        else {
          // everything else is a 404
          client.println("HTTP/1.1 404 Not Found");
          client.println("Content-Type: text/html");
          client.println();
          client.println("<h2>File Not Found!</h2>");
        }
        break;
      }
    }
    // give the web browser time to receive the data
    delay(1);
    client.stop();

    ///////////////////// control arduino pin
    if(readString.indexOf("?computer_on") >0)//checks for on
    {
      digitalWrite(8, HIGH);    // set pin 4 high
      Serial.println("Led On");
    }
    else{
      if(readString.indexOf("?computer_off") >0)//checks for off
      {
        digitalWrite(8, LOW);    // set pin 4 low
        Serial.println("Led Off");
      }
    }
    //clearing string for next read
    readString="";
  }
}

KINGofHS147

Olá, tenho uma dúvida quanto a interligação entre o cartão e a página criada. Não consigo fazer "conversar" entre os dois componentes. Você poderia ajudar? Tenho o código feito mas queria passar os botões para um index.htm que seria acessado no cartão.

Código abaixo:

#include <SPI.h>
#include <Ethernet.h>
byte mac[] = {0xDE, 0xAD, 0xBE, 0xEF, 0xFE, 0xED};
IPAddress ip(192,168,1,110);
EthernetServer server(80);
void setup() {
  Serial.begin(9600);
 
  Ethernet.begin(mac, ip);
  server.begin();
  Serial.print("server is at ");
  Serial.println(Ethernet.localIP());
   pinMode(9, OUTPUT);
   digitalWrite(9, LOW);
  pinMode(8, OUTPUT);
  digitalWrite(8, LOW);
  pinMode(7, OUTPUT);
  digitalWrite(7, LOW);

 
}

void loop() {
  EthernetClient client = server.available();
  if (client) {
    Serial.println("new client");
     
    boolean currentLineIsBlank = true;
 
    String vars;
    int varled1_OnOff = 0;
    int varled2_OnOff = 0;
    int varled3_OnOff = 0;
   
    while (client.connected()) {
      if (client.available()) {
        char c = client.read();
        Serial.write(c);
        vars.concat(c);     
       
        if (vars.endsWith("/led1_on")) varled1_OnOff = 1;
        if (vars.endsWith("/led1_off")) varled1_OnOff = 2;
        if (vars.endsWith("/led2_on")) varled2_OnOff = 1;
        if (vars.endsWith("/led2_off")) varled2_OnOff = 2;
        if (vars.endsWith("/led3_on")) varled3_OnOff = 1;
        if (vars.endsWith("/led3_off")) varled3_OnOff = 2;
        if (c == '\n' && currentLineIsBlank) {
          client.println("HTTP/1.1 200 OK");
          client.println("Content-Type: text/html");
          client.println("Connnection: close");
          client.println();
          client.println("<!DOCTYPE HTML>");
          client.println("<html>");
 
          client.println("<br>");
          client.println("<h1><center> Soares - Remote Automation</h1><hr>");
          client.println("<form method=get name=form><center>");
          client.println("<html><header><style>input {height:100px; width:300px }</style></header><body><form method=get>");
         
                 client.println("<input type=button value=Ligar-branca ");
                 client.println(" onclick=\"document.location='/led1_on'\" />");
                 client.println("<input type=button value=Desligar ");
                 client.println(" onclick=\"document.location='/led1_off'\" />");
                 client.println("<br>");                 
                 client.println("<input type=button value=Ligar-amarela ");
                 client.println(" onclick=\"document.location='/led2_on'\" />");
                 client.println("<input type=button value=Desligar ");
                 client.println(" onclick=\"document.location='/led2_off'\" />");
                 client.println("<br>");
                 client.println("<input type=button value=Ligar-ventilador ");
                 client.println("onclick=\"document.location='/led3_on'\" />");
                 client.println("<input type=button value=Desligar ");
                 client.println(" onclick=\"document.location='/led3_off'\" />");
                 client.println("<br>");
           
                 
          if (varled1_OnOff == 1)
               {
                  digitalWrite(9, HIGH);
                  client.println("Led 1 Ligado");
                }
       
        if (varled1_OnOff == 2)
               {
                  digitalWrite(9, LOW);
                  client.println("Led 1 desligado");                                 
                }
                     
          if (varled2_OnOff == 1)
               {
                  digitalWrite(8, HIGH);
                  client.println("Led 2 Ligado");                                 
                }
         
          if (varled2_OnOff == 2)
                {
                  digitalWrite(8, LOW);
                  client.println("Led 2 Desligado");                 
               }
               
               
          if (varled3_OnOff == 1)
               {
                  digitalWrite(7, HIGH);
                  client.println("Led 3 Ligado");
                                 
 
                }
          if (varled3_OnOff == 2)
                {
                  digitalWrite(7, LOW);
                  client.println("Led 3 Desligado");
                 
               }
                 
         
         
          client.println("</html>");
          break;
        }
        if (c == '\n') {
          currentLineIsBlank = true;
        }
        else if (c != '\r') {
          currentLineIsBlank = false;
        }
      }
    }
    delay(1);
    client.stop();
    Serial.println("client disonnected");
  }
}

tecdiego

KINGofHS147 o que você quer fazer?
Pela página do SDcard alimentar a página que está no Arduino?
Ou a página do Arduino alimentar a página do SDcard?

Te aconselho a usar JQuery e Ajax! Ajuda bastante.
A página no SDcard faz requisições via AJAX e o Arduino trata essa requisições e retorna em html para alimentar a página do SDcard!

KINGofHS147

Ola tecdiego, gostaria de alimentar o arduino com a pagina armazenada no cartão. Tentei fazer com AJAX mas ainda não consegui, você poderia me ajudar? Esse é meu e-mail lucassilveira_soares@hotmail.com

tecdiego

Você realmente precisa fazer pela página do sdcard? Não tem como criar uma página que faça isso tudo?
Deixa eu te explicar algumas coisas:

1 - Para se trabalhar com o FORM seria ideal um servido php, porém com o arduino conseguimos trabalhar, a página principal requisita ao Arduino e o mesmo trata essas informações e retorna para a página principal as informações necessárias!

Vou criar um post no meu blog para isso, porém só não prometo que será em breve! Mas farei o possível.

Manda suas dúvidas por aqui, elas podem ser dúvidas de outas pessoas! fico a disposição pelo email fisdiego@gmail.com

Go Up