Go Down

Topic: [RISOLTO]Bottone ajax  (Read 603 times) previous topic - next topic

cri_pava

Mar 07, 2018, 12:32 am Last Edit: Mar 24, 2018, 07:08 pm by cri_pava
di nuovo buona sera a tutti

adesso che sono riuscito a mettere in rete il mio leonardo ho bisogno di creare la pagina web .

Ho cercato in internet ma non ho trovato esattamente quello che cerco.

In poche parole vorrei un semplice pulsante che una volta premuto mandi in high un pin per 1.5 secondi

Vorrei che fosse in ajax

Senza cheda sd (possibilmente)

E che una volta inviato high di 1.5 secondi tutto sia di nuovo pronto per essere premuto un numero infito di volte

E' possibile ?

SOLUZIONE

Buonasera a tutti. Copiando un po uqa e la per il web , e soprattutto grazie ai consigli dei maestri di questo forum sono arrivato a una soluzione abbastanza soddisfacente!!

Ve la posto qui in modo che se servisse , spero sia di aiuto a qualcuno

questo il codice arduino:
Code: [Select]
#include <SPI.h>
#include <Ethernet2.h> // Ethernet2.h per schede che mondano il chip w5500 tipo arduino leonardo eth o la arduino shield 2
// #include <Ethernet.h>  per le schede di rete che usano il chip w5100 tipo la shield ethernet 1 di arduino
#include <SD.h>

// Indirizzo MAC della scheda di rete arduino
byte mac[] = { 0xB8, 0x27, 0xEB, 0x0B, 0xE6, 0x06 };

IPAddress ip(192, 168, 0, 168);     //Impostazioni di rete Per la connessione , da modificare secondo la propria rete
IPAddress gateway(192, 168, 0, 1); 
IPAddress subnet(255, 255, 255, 0);
EthernetServer server(80);          // Il servere web arduino e' raggiungibile sulla porta 80
File webFile;

String HTTP_req;         
void setup()
{
   
HTTP_req.reserve(700); // da usare solo con scheda con poca memoria ram tipo la mia arduino leonardo eth. Dedida una certa quantita di memoria ram alla stringa dove viene salvata la richiesta http

Serial.begin(9600);       // per la diagnostica
 
  // inizializzazione sd
    Serial.println("Initializing SD card...");
    if (!SD.begin(4)) {
        Serial.println("ERROR - SD card initialization failed!");
        return;    //avvio fallito
    }
    Serial.println("SUCCESS - SD card initialized.");
    // controllo del file index.htm
    if (!SD.exists("index.htm")) {
        Serial.println("ERROR - Can't find index.htm file!");
        return;  // index non trovato
    }
    Serial.println("SUCCESS - Found index.htm file.");
                 // tutto e' andato a buon fine
   
 
    Ethernet.begin(mac, ip, gateway, subnet);  // Avvio connessisone
    server.begin();                             
    Serial.print("il server e' all'indirizzo ");
    Serial.print(Ethernet.localIP());
   
    pinMode(7, OUTPUT);        // il rele per il telecomdo e' collegato al pin 7
    digitalWrite(7, LOW);      // di default il bottone non viene premuto

}

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
        HTTP_req.reserve(700);
        HTTP_req += c;  // save the HTTP request 1 char at a time
        // 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");
          client.println("Content-Type: text/html");
          client.println("Connection: keep-alive");
          client.println();
          // AJAX request for switch state
          if (HTTP_req.indexOf("opengate") > -1) {

            digitalWrite(7, HIGH); // il bottone viene premuto
            delay(1500);           // nel mio caso il bottone doveve essere mantenuto premuto per circa 1,5 sec
            digitalWrite(7, LOW);  // il bottone viene rilasciato
          }
          else { 
            // web page request
                        // send web page
                        webFile = SD.open("index.htm");        // apri la pagina web
                        if (webFile) {
                            while(webFile.available()) {
                                client.write(webFile.read()); // invia la pagina web al client
                            }
                            webFile.close();
                        }
          }
          // display received HTTP request on serial port
          Serial.print(HTTP_req);
          HTTP_req = "";            // finished with request, empty string
          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)
}



Questa la pagina web da inserire nella scheda sd

Code: [Select]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  <link rel="icon" href="/favicon.ico" type="image/ico">
  <style>
 
    body {
   text-align:center;
   vertical-align:middle;
   height: 100%;
   }
    div {
     
    width:100%;
    height:100%;
    position:absolute;
    top:40%;
    margin: 0 0 0 0;
    text-align:center;
    vertical-align:middle;
    }
 
   button {
    width: 4em;
    height: 1.5em;
      font-size:4em;
     
     }
     
     #opened{
     font-size:2em;
     color: #32CD32;
     }
     #notopened{
     font-size:3em;
     color: #FF0000;
     }
     #error{
     font-size:5em;
     color: #FF0000;
     font-weight: bold;
     
     }
   
 
    </style>
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    <meta name="generator" content="PSPad editor, www.pspad.com">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script>
    function Openthegate() {
             nocache = "&nocache="+ Math.random() * 1000000;
             var request = new XMLHttpRequest();
             request.onreadystatechange = function() {
          if (this.readyState == 4) {
            if (this.status == 200) {
                 document.getElementById("opened").innerHTML = "Aperto";
                 
            }}}
            request.open("POST", "opengate" + nocache, true);
            request.send(null);
            }
         </script>
    <title></title>
    </head>
    <body>
          <div >
            <button type="button"  onclick="Openthegate()">Apri</button>
            <p id="opened"></p>
          </div>
    </body>
  </html>


SUGGERIMENTI

Questo script usa una certa quantita di memoria ram , percio evitate di fare come me e di prendere uan scheda che avesse solo 2k , o rischiate di incorrere nei miei stessi problemi. Io ho tamponato con la funzione reserve() . Ma se potete usate una scheda con piu ram


Non so perche ma non tutte le schede sd , seppur di 8 o 16 gb, funzionano. Percio fate un paio di prove con varie schede in caso non partisse subito la sd

Buona serata a tutti

uwefed

perché in ajax?

Ciao Uwe

nid69ita

https://startingelectronics.org/tutorials/arduino/ethernet-shield-web-server-tutorial/web-server-read-switch-automatically-using-AJAX/
my name is IGOR, not AIGOR

cri_pava

perché in ajax?

Ciao Uwe
Perche vorrei che non la pagina non si ricaricasse una volta premuto il bottone
Perche non mi piace il fatto di lavorare con le variabil che passano nell'url

https://startingelectronics.org/tutorials/arduino/ethernet-shield-web-server-tutorial/web-server-read-switch-automatically-using-AJAX/
scusa ma non e' quello ceh vorrei fare io. Questo lo avevo gia visto.
Quello che vorrei fare io e' una volta premuto il bottone via web (non un bottone reale) venisse mandato un high di 1.5 secondi su un pin e poi di nuovo low , fino alla nuova pressione del bottone e cosi' via

Non so se mi sono sp[iegato male

nid69ita

#4
Mar 07, 2018, 02:11 pm Last Edit: Mar 07, 2018, 02:20 pm by nid69ita
Si, ora ho capito.
Comunque è un qualcosa che riguarda più HMTL/Ajax che Arduino. Devi avere una pagina html con evento onclick() su un bottone, quel click attiva una funzione java-script  tipo GetSwitchState di quel link,
che poi chiama          request.open(\"GET\", \"ajax_switch\",true);         
come spiegato qui: https://www.w3schools.com/xml/ajax_intro.asp

In Arduino intercetti quel "ajax_switch"   o altra parola che decidi ed agisci di conseguenza

my name is IGOR, not AIGOR

uwefed

Quote
Perche non mi piace il fatto di lavorare con le variabil che passano nell'url
Questo non necessita l' uso di ajax.
Se non vuoi usare GET allora usa POST e la trasmissione delle variabili avviene in modo nascosto.
ciao Uwe

cri_pava

Questo non necessita l' uso di ajax.
Se non vuoi usare GET allora usa POST e la trasmissione delle variabili avviene in modo nascosto.
ciao Uwe
sono d'accordo con te , ma comunque la pagina si ricarica. io non vprrei che lei si ricaricasse


Si, ora ho capito.
Comunque è un qualcosa che riguarda più HMTL/Ajax che Arduino. Devi avere una pagina html con evento onclick() su un bottone, quel click attiva una funzione java-script  tipo GetSwitchState di quel link,
che poi chiama          request.open(\"GET\", \"ajax_switch\",true);        
come spiegato qui: https://www.w3schools.com/xml/ajax_intro.asp

In Arduino intercetti quel "ajax_switch"   o altra parola che decidi ed agisci di conseguenza


uuuu

grazie del suggerimento. Un po complicatina come cosa  :smiley-eek:

Spero di riuscirci

Vi tengo informati  ;)

Se qualcun'altro a qualche suggerimento . e' ben accetto

Go Up