Come inviare i dati da ARDUINO ad una pagina HTML

Buonasera a tutti,
da giorni sto lavorando al mio primo progetto con arduino. ho un piccolo impiantino fotovoltaico off grid. composto da un pannello da 100w, una batteria, un regolatore di carica ed un inverter. l'idea era quella di poter controllare i parametri della produzione e dei consumi e di permettermi di accendere o spegnere inverter e l'illuminazione a 12volt. per fare questo ho acquistato diversi sensori tra cui quello di voltaggio (per controllare la tensione della batteria) due sensori di corrente (per controllare la corrente prodotta e consumata) e due relè per spegnere ed accendere le luci e l'inverter.
Premetto che non ho mai programmato ed ho fatto tutto da autodidatta, sono arrivato ad un punto in cui riesco a leggere tutti i valori perfettamente tramite porta seriale. Quindi ieri ho fatto una pagina carica in html, e ho pensato di mandare i valori che leggo tramite serial monitor a questa pagina in modo da poter vedere i dati e comandare il mio arduino uno ovunque mi trovi.

come hardware ho:

Arduino uno
Scheda ethernet w5100

qualche anima pia mi aiuta a fare comunicare la pagina html con il mio arduino.

posto a seguire le immagini sia dei valori che ho con serial monitor.
sia la pagina html come l'ho preparata.

grazie a tutti

Buona sera,
essendo il tuo primo post, nel rispetto del regolamento, ti chiedo cortesemente di presentarti QUI (spiegando bene quali conoscenze hai di elettronica e di programmazione ... possibilmente evitando di scrivere solo una riga di saluto) e di leggere con attenzione il su citato REGOLAMENTO ... Grazie. :slight_smile:

Guglielmo

appena fatto i saluti, grazie mille

Scaricati QUESTO insieme di librerie e prova a guardare gli esempi e la documentazione di "Webbino", un modulo per fare pagine web su Arduino integrate con i dati acquisiti.

E' scritto da un assiduo utente del forum (SukkoPera) che può darti tutto l'aiuto :wink:

Guglielmo

La grande Webbino e io ne sono un utilizzatore :smiley:

Ragazzi nessun aiuto?

Ti consiglio di dare un'occhiata a questo post, il 159.

Poi comunque dovresti avere una micro SD da inserire nella ethernet shield e su quella micro SD deve esserci questa pagina HTML che vuoi usare :wink: Il nome di questo file deve essere al massimo 7+3 caratteri, ovvero ad esempio, index.htm
Dove vuoi inserire dei determinati valori, devi metterci dei tag, che so tipo : #DATA# scritto in maiuscolo e poi dopo nel codice andrai a definire quel #DATA#
Ma per prima cosa devi avere una micro SD con una pagina HTML come la vuoi tu. La puoi scrivere anche nel Note di windows e puoi prendere anche quella hai attualmente :wink: Vai sulla tua pagina attuale nel broswer e poi con F12 e 'copy outer html' puoi copiare il tuo codice e inserirlo in Note e avrai la copia della tua pagina attuale.

Un esempio di pagine HTML da poter usare te lo metto in allegato. Ovviamente non centra niente con il tuo argomento, è giusto per farti vedere cosa intendo per TAG. Su quell'allegato che ti metto è usato il $ per i TAG e non il #
Se userai parecchi colori sulle tue pagine ti consiglio di usare il dollaro e dovrai cambiare la definizione del TAG sul file 'webbino_config.h' e 'webbino_common.h' (sono file che trovi all'interno della libreria di Webbino)

So che magari ti sembrerà tanta roba ma è più facile a dirsi che a farsi :wink:

Esempio.zip (1.66 KB)

Grazie mille, quello che mi sfugge è il seguente passaggio:

nel mio sketch caricato su arduino tramite seriale ottengo a video il valore della temperatura nel seguente modo:

Serial.print("\t TEMPERATURA INTERNA: ");
Serial.print(temperature,2);

ho caricato su sd un file index.htm

con la parola #temperatura#

come dico alla pagina html di prendere il valore da Serial.print(temperature,2); ?

e sopratutto come dico al arduino di aprire il file html contenuto in sd?

È tutto spiegato nel post 159 linkato da @As_Needed. Dai un'occhiata lì e poi ci risentiamo.

Spero che nel file non c'è scritto SOLO esclusivamente #temperatura# che comunque al massimo DEVE essere:

#TEMPERATURA#

:slight_smile:

Prima cosa devi configurare webbino per quello che vuoi fare tu:

  1. Vai in webbino_config.h e vedrai che ci sarà una riga che ha queste diciture, che devono diventare così:
#define WEBBINO_USE_WIZ5100
//~ #define WEBBINO_USE_ENC28J60
//~ #define WEBBINO_USE_ESP8266

(Questo perché tu usi la ethernet shield con WIZ5100)

Poi usando l'SD, devi scommentare sempre in quel file, questa riga, così:

#define WEBBINO_ENABLE_SD

E commentare così questa:

//~ #define WEBBINO_ENABLE_SDFAT

Stessa cosa in webbino_common.h


Prima di incominciare a visualizzare qualcosa, ti consiglio di guardare gli esempi :slight_smile: (Lo so che dà gusto vedere i risultati :smiley: )

Per prima cosa carica un esempio così e vedi se ti vede quella pagina che dici di aver creato, per ora lascia perdere i TAGS :

#include <Webbino.h>
#include <avr/pgmspace.h>

#define SD_SS 4
WebServer webserver;

#include <WebServer_WIZ5100.h>
NetworkInterfaceWIZ5100 netint;
EthernetServer server(80);

/******************************************************************************
   DEFINITION OF TAGS
 ******************************************************************************/

#define REP_BUFFER_LEN 32
static char replaceBuffer[REP_BUFFER_LEN];
PString subBuffer (replaceBuffer, REP_BUFFER_LEN);

static PString& evaluate_ip (void *data __attribute__ ((unused))) {
  subBuffer.print (netint.getIP ());

  return subBuffer;
}

static PString& evaluate_netmask (void *data __attribute__ ((unused))) {
  subBuffer.print (netint.getNetmask ());

  return subBuffer;
}

static PString& evaluate_gw (void *data __attribute__ ((unused))) {
  subBuffer.print (netint.getGateway ());

  return subBuffer;
}

static PString& evaluate_mac_addr (void *data __attribute__ ((unused))) {
  const byte *buf = netint.getMAC ();

  for (byte i = 0; i < 6; i++) {
    if (buf[i] < 16)
      subBuffer.print ('0');
    subBuffer.print (buf[i], HEX);

    if (i < 5)
      subBuffer.print (':');
  }

  return subBuffer;
}

static PString& evaluate_ip_src (void *data __attribute__ ((unused))) {
  if (netint.usingDHCP ())
    subBuffer.print (F("DHCP"));
  else
    subBuffer.print (F("MANUAL"));

  return subBuffer;
}

static PString& evaluate_webbino_version (void *data __attribute__ ((unused))) {
  subBuffer.print (WEBBINO_VERSION);

  return subBuffer;
}

static PString& evaluate_uptime (void *data __attribute__ ((unused))) {
  unsigned long uptime = millis () / 1000;
  byte d, h, m, s;

  d = uptime / 86400;
  uptime %= 86400;
  h = uptime / 3600;
  uptime %= 3600;
  m = uptime / 60;
  uptime %= 60;
  s = uptime;

  if (d > 0) {
    subBuffer.print (d);
    subBuffer.print (d == 1 ? F(" day, ") : F(" days, "));
  }

  if (h < 10)
    subBuffer.print ('0');
  subBuffer.print (h);
  subBuffer.print (':');
  if (m < 10)
    subBuffer.print ('0');
  subBuffer.print (m);
  subBuffer.print (':');
  if (s < 10)
    subBuffer.print ('0');
  subBuffer.print (s);

  return subBuffer;
}

static PString& evaluate_free_ram (void *data __attribute__ ((unused))) {
  extern int __heap_start, *__brkval;
  int v;

  subBuffer.print ((int) &v - (__brkval == 0 ? (int) &__heap_start : (int) __brkval));

  return subBuffer;
}



// Max length of these is MAX_TAG_LEN (24)
static const char subMacAddrStr[] PROGMEM = "NET_MAC";
static const char subIPAddressStr[] PROGMEM = "NET_IP";
static const char subNetmaskStr[] PROGMEM = "NET_MASK";
static const char subGatewayStr[] PROGMEM = "NET_GW";
static const char subNetConfSrcStr[] PROGMEM = "NET_CONF_SRC";
static const char subWebbinoVerStr[] PROGMEM = "WEBBINO_VER";
static const char subUptimeStr[] PROGMEM = "UPTIME";
static const char subFreeRAMStr[] PROGMEM = "FREERAM";

static const var_substitution subMacAddrVarSub PROGMEM = {subMacAddrStr, evaluate_mac_addr, NULL};
static const var_substitution subIPAddressVarSub PROGMEM = {subIPAddressStr, evaluate_ip, NULL};
static const var_substitution subNetmaskVarSub PROGMEM = {subNetmaskStr, evaluate_netmask, NULL};
static const var_substitution subGatewayVarSub PROGMEM = {subGatewayStr, evaluate_gw, NULL};
static const var_substitution subNetConfSrcVarSub PROGMEM = {subNetConfSrcStr, evaluate_ip_src, NULL};
static const var_substitution subWebbinoVerVarSub PROGMEM = {subWebbinoVerStr, evaluate_webbino_version, NULL};
static const var_substitution subUptimeVarSub PROGMEM = {subUptimeStr, evaluate_uptime, NULL};
static const var_substitution subFreeRAMVarSub PROGMEM = {subFreeRAMStr, evaluate_free_ram, NULL};

static const var_substitution * const substitutions[] PROGMEM = {
  &subMacAddrVarSub,
  &subIPAddressVarSub,
  &subNetmaskVarSub,
  &subGatewayVarSub,
  &subNetConfSrcVarSub,
  &subWebbinoVerVarSub,
  &subUptimeVarSub,
  &subFreeRAMVarSub,
  NULL
};


/******************************************************************************
   MAIN STUFF
 ******************************************************************************/

// Avoid some bug reports :)
#if !defined (WEBBINO_ENABLE_SD) && !defined (WEBBINO_ENABLE_SDFAT)
#error Please enable WEBBINO_ENABLE_SD or WEBBINO_ENABLE_SDFAT in webbino_config.h
#endif


void setup() {
  Serial.begin (9600);
  Serial.println (F("Using Webbino " WEBBINO_VERSION));

  byte mac[] = {
    0xDE, 0xAD, 0xBE, 0xEF, 0xFE, 0xED
  };
  byte ip[] = {
    192, 168, 1, 51//l'ip usato dalla scheda ethernet              //////////////////////////////////////////////////////////////////////
  };                                                               //////////////////////////////////////////////////////////////////////
  byte gw[] = {                                                    //////////////////////////////////////////////////////////////////////
    192, 168, 1, 1//il vostro ip del modem o router                //GW E MASK SONO VISIBILI NELLE IMPOSTAZIONI DI RETE DEL VOSTRO PC////
  };                                                               //////////////////////////////////////////////////////////////////////
  byte mask[] = {                                                  //////////////////////////////////////////////////////////////////////
    255, 255, 255, 0//la net mask                                  //////////////////////////////////////////////////////////////////////
  };                                                               //////////////////////////////////////////////////////////////////////
  //netint.begin (mac);
  netint.begin (mac, ip, gw, mask);

  Serial.print (F("Initializing SD card..."));
  if (!webserver.enableSD (SD_SS)) {
    Serial.println (F(" failed"));
    while (42)
      ;
  }
  Serial.println (F(" done"));

  Serial.println (F("Trying to get an IP address through DHCP"));
  if (!webserver.begin (netint, NULL, substitutions)) {
    Serial.println (F("Failed to get configuration from DHCP"));
    while (42)
      ;
  }
  else {
    Serial.println (F("DHCP configuration done:"));
    Serial.print (F("- IP: "));
    Serial.println (netint.getIP ());
    Serial.print (F("- Netmask: "));
    Serial.println (netint.getNetmask ());
    Serial.print (F("- Default Gateway: "));
    Serial.println (netint.getGateway ());
  }
}

void loop() {
  webserver.loop ();

}

In questo esempio che ti ho creato, nel setup c'è scritto dove devi inserire IP etc della tua configurazione.

P.S. Ho visto adesso la risposta di Sukko e ovviamente ha ragione, come ti avevo linkato sta tutto lì :wink: Io comunque ti ho consigliato di fare questa prova prima dei TAG almeno ti fai la base del tuo codice. (Ah comunque Sukko, il link non si clicca, almeno a me.)

Fixato, tnx ;).

SukkoPera:
Fixato, tnx ;).

Complimenti per il Faraday Member (l'ho visto adesso) :smiley:

Ah grazie! Non so nemmeno quando lo sono diventato :D.

SukkoPera:
Ah grazie! Non so nemmeno quando lo sono diventato :D.

Ahahah

non riesco a trovare da nessuna parte il file:

webbino_config.h

come mai?

.h è l'estensione del file, il file si chiama webbino_config e webbino_common
Si trovano entrambi nella directory della libreria webbino

come si può vedere da foto, non ho webbino_config.h

Forse Sukko ha omesso quel file negli ultimi aggiornamenti, ma la cosa importante che hai il common, modifica quello.

sono andato su webbino_common.h

e sono riuscito a fare il primo passaggio che mi dicevi:

#define WEBBINO_USE_WIZ5100
//~ #define WEBBINO_USE_ENC28J60
//~ #define WEBBINO_USE_ESP8266

ma non trovo #define WEBBINO_ENABLE_SD

Hai scaricato il master o il branch di Webbino? Quello giusto è il branch!