Come inviare richiesta get con ajax in locale

Ciao a tutti , sono nuovo sia del forum che della programmazione in web , vorrei chiedervi una mano.
Devo creare una pagina web che mi permetta di inviare una richiesta di tipo GET ,dunque passando dei dati tramite url, ad una pagina presente in locale sul mio pc , con cui avviene la comunicazione con una specie di scheda arduino (nello specifico è un particle photon) che crea una connessione di tipo http con la pagina.
La pagina locale corrisponde all'indirizzo ip del dispositivo , dunque ad es. 192.168.1.100.
In poche parole accedo da browser alla pagina 192.168.1.100 inserendoci i valori che devo andare a recuperare in arduino , in questo modo 192.168.1.100/valore1&valore2 e poi mando sempre a questa pagina i valori calcolati , fin qui va bene e riesco a farlo.
Ho omesso di dire che il tutto avviene tramite connessione wifi perche il dispositivo supporta solo questa tipologia.
Il problema è che non ho idea di come fare da pagina web ,cioe inviare la richiesta GET dalla mia pagina , http://sistemaallagamento.altervista...loacqua=valore , e inviarla proprio all'indirizzo
192.168.1.100 su cui mi collego con arduino.Leggendo sul web ho visto che è possibile utilizzare Ajax ma provando alcuni esempi non ho risolto nulla.Spero di essere stato chiaro , grazie

[mzanella]

Se ho ben compreso, hai uno spazio web qui su AlterVista, ed un dispositivo personale, connesso al tuo router domestico, il quale ha indirizzo IP 192.168.1.100 nella tua LAN. Questo dispositivo risponde a richieste HTTP GET nella forma http://192.168.1.100/valore1&valore2.
Ciò che vuoi creare è una pagina nel tuo spazio AlterVista che invii una richiesta HTTP GET al suddetto dispositivo.

Il primo problema è l'indirizzo IP del tuo dispositivo: 192.168.1.100 è un indirizzo locale, è raggiungibile solo dall'interno della LAN, ovvero solo da chi è fisicamente connesso (via ethernet o wifi) allo stesso router. In sintesi, questo vuol dire che una pagina web come quella che descrivi funzionerebbe solo se visualizzata da un computer all'interno della stessa LAN del dispositivo, e che l'interrogazione deve avvenire necessariamente lato client, quindi tramite AJAX.

Per ovviare parzialmente a questo problema puoi realizzare l'inoltro delle porte nel tuo router, in modo che il dispositivo sia visibile anche dall'esterno, a patto di conoscere l'IP pubblico del router (che generalmente è dinamico, quindi cambia ad ogni connessione...). Prima di intraprendere questa strada, valuta se è davvero ciò di cui hai bisogno!

Il secondo problema è quello di scrivere il codice JavaScript per la richiesta AJAX, supponendo che tu sia nella stessa LAN del dispositivo (o che abbia effettuato l'inoltro delle porte). Il primo consiglio è di usare la libreria jQuery, semplifica notevolmente il codice:

$.get("http://192.168.1.100/valore1&valore2", function (data) {
  alert("Data Loaded: " + data);
});

function (data) {...} è la funzione di callback che verrà invocata quando la richiesta sarà portata a termine. Al suo interno potrai utilizzare data, la risposta fornita dal tuo dispositivo (vedi jQuery.get()).

Innanzitutto grazie per la risposta , diciamo che per il primo problema voglio che la pagina sia raggiungibile solo da dispositivi connessi al mio router quindi presenti nella mia LAN.

HO provato velocemente il codice postato da te ma non sembra connettersi

[mzanella]

Hai ispezionato la console del browser? Riporta errori?

Oltre alla console, puoi usare il metodo fail di jQuery per avere informazioni in più sull'errore:

$.get("http://192.168.1.100/valore1&valore2", function (data) {
  alert("Data Loaded: " + data);
})
.fail(function (jqXHR, textStatus) {
  alert("Request failed: " + textStatus);
});

No la console del browser non mi da errori , ti dico cosa ho fatto :
1.ho creato un nuovo file.js e ci ho incollato il codice di sopra
2.ho scaricato il file jquery.min.js ma non ho idea di dove metterlo , se caricarlo su altervista o meno

aprendo il file mi stampa il codice inserito

Ho fatto un'altra prova , caricando lo script di jquery in una pagina html. All'apertura della pagina mi appare una finestra con scritto error , e nella console mi dice :
Failed to load resource: net::ERR_CONNECTION_TIMED_OUT

[mzanella]

ho scaricato il file jquery.min.js ma non ho idea di dove metterlo , se caricarlo su altervista o meno

Devi "includerlo" nella pagina web che stai creando, così come devi "includere" il file file.js con il codice, in questo modo (assunto che entrambi i file JavaScript siano nella stessa cartella del file HTML):

<!DOCTYPE html>
<html>
    <head>
         ...
        <script src="jquery.min.js"></script>
        <script src="file.js"></script>
    </head>
    ...
</html>

Failed to load resource: net::ERR_CONNECTION_TIMED_OUT

A quale risorsa si riferisce? L'errore indica che qualcosa (che potrebbe essere o meno lo script, dipende da cos'altro c'è nella pagina) ha inviato ad un server una richiesta, ma quest'ultimo non ha risposto in tempo.

Puoi mostrare il codice della pagina a cui stai lavorando?

Per quanto riguarda l'invio della richiesta get funziona .Mando la richiesta alla pagina 192.168.1.100 e viene presa in esame dal mio server. A questo punto il server sulla pagina 192.168.1.100 deve inviare dei dati , che devono essere raccolti dalla mia pagina web . Purtroppo la funzione che dovrebbe farmi l'alert dei dati di ritorno non prende nulla. In che modo posso recuperare i dati?(forse nel formato json supportato anche dal mio dispositivo sarebbe meglio , ho provato la $getJSON ma non fa nulla)

<!DOCTYPE html>
<html>
<head>

<script type="text/javascript" src="js/jquery-3.1.1.min.js"></script>

</head>
<body>



<script type="text/javascript" >

$.getJSON('http://sistemaallagamento.altervista.org/form.html', data, function (data, status) {
if (status === 200) {
alert(data)
}
});


</script>

</body>
</html>

Ti spiego come lavora il mio arduino lato server :
print("<html><body>Hello ZERYNTH!",valore,a,"</body></html>",stream=client)
,cioe utilizzo codice html tramite lo stream , il problema è prendere il campo valore che stara stampato su 192.168.1.100.
Valore posso anche trasformarla in un formato json ma cmq non riesco a prenderlo

$.getJSON('http://192.168.1.100/valore', data, function (data, status) {

[mzanella]

Valore posso anche trasformarla in un formato json ma cmq non riesco a prenderlo

Sì, facendo in modo che il dispositivo risponda in formato JSON, diventerà più semplice la lettura tramite JavaScript.

Il codice per la richiesta, dopo aver aggiunto il metodo fail per controllare eventuali errori, diventa:

$.getJSON('http://192.168.1.100/valore', function (data, status) {
    alert(data);
})
.fail(function (jqXHR, textStatus) {
  alert("Request failed: " + textStatus);
});

Il resto della pagina non ha problemi.

Se dovessero esserci altri problemi, le cause più comuni sono:

• errori di sintassi nel JSON
• il same origin policy, a causa del quale AJAX non funziona se il dominio presso cui è ospitata la pagina web non coincide con quello presso cui si invia una richiesta

putroppo non funziona mi da come errore nell'alert : request failed.
La pagina 192.168.1.100 contiene questo codice html:
<html>
<body>Hello ZERYNTH!{ "nome" :"valore"}</body></html>
E' sbagliata una sintassi del genere per recuperare il campo valore?

[mzanella]

Quello è HTML, mentre il codice si aspetta un JSON.
Il documento dovrebbe essere nel formato:

{"nome": "valore"}

senza ulteriori tag, inoltre il dispositivo dovrebbe inviare lo header "Content-type: application/JSON". Non conosco Arduino, quindi non so quale sia l'istruzione da usare per questo fine. Se può esserti utile, l'analogo in PHP è:

header('Content-Type: application/json'); 

In realtà jQuery potrebbe essere abbastanza furbo da cavarsela anche senza impostare lo header corretto, ma non rischierei...

Se provo a testare su una qualsiasi pagina html dove metto valori in formato json funziona ,invece sulla pagina 192.168.1.100 mi da errore , con gli stessi valori

[mzanella]

Se provo a testare su una qualsiasi pagina html dove metto valori in formato json funziona

Questo prendilo come un colpo di fortuna, non come la prassi , nel senso che un file JSON ed una pagina HTML sono due entità profondamente diverse.

invece sulla pagina 192.168.1.100 mi da errore

Le altre pagine su cui hai provato si trovano sullo stesso host rispetto a quello in cui risiede la pagina web che stai costruendo? In caso positivo, probabilmente il problema è il same origin policy.
Qualche informazione più specifica sull'errore? Dalla console del browser? Dal textStatus del metodo fail? Se non sai come ottenere informazioni sull'errore, più di qualcuno suggerisce di provare con fiddler.

si ho provato creando una nuova pagina html in altervista mettendoci dentro i valori json

purtroppo l'errore non riesco a trovarlo in quanto la connessione all'ip del dispositivo avviene da mobile per questione di compatibita

cmq l'errore che riscontro spesso è :
Failed to load resource: net::ERR_CONNECTION_TIMED_OUT

[mzanella]

si ho provato creando una nuova pagina html in altervista mettendoci dentro i valori json

Allora temo che il problema sia causato dal fatto che stai cercando di effettuare una richiesta multi-origine (cross-origin).

come potrei risolvere? altrimenti in maniera diversa , dato che il dato che mi serve è presente in 192.168.1.100 , potrei leggere il codice sorgente in qualche modo e prelevarlo lo stesso?