Passare variabile da lato client a lato server e viceversa

di McDuck37 il
12 risposte
Pochi posts
Iscritto da
apr, 2020
Messaggi
42
Salve, volevo sapere come si fa a passare una variabile creata nel lato client con javascript al lato server in NodeJS cosi da poterla salvare in un db per poi riutilizzarla in altre pagine lato client. Grazie per l'attenzione

12 Risposte

  • Avatar di Alka
    Utente Famoso
    Iscritto da
    nov, 2014
    Messaggi
    3504
    Hai due alternative: o crei un elemento <form> che invii i dati al tuo endpoint Node.JS in ascolto, inserendo il valore all'interno di un campo del suddetto form, oppure invii il dato tramite JavaScript (magari in formato JSON) usando la Fetch API oppure l'oggetto XHR.

    Ad esempio: 
    
var xhr = new XMLHttpRequest();
xhr.open("POST", yourUrl, true);
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.send(JSON.stringify({
    value: value
}));
    Ciao!
  • Pochi posts
    Iscritto da
    dic, 2018
    Messaggi
    13
    Qui trovi un esempio completo :
  • Pochi posts
    Iscritto da
    apr, 2020
    Messaggi
    42

    Alka ha scritto:

    Hai due alternative: o crei un elemento <form> che invii i dati al tuo endpoint Node.JS in ascolto, inserendo il valore all'interno di un campo del suddetto form, oppure invii il dato tramite JavaScript (magari in formato JSON) usando la Fetch API oppure l'oggetto XHR.

    Ad esempio: 
    
var xhr = new XMLHttpRequest();
xhr.open("POST", yourUrl, true);
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.send(JSON.stringify({
    value: value
}));
    Ciao!
    Puoi farmi un esempio pratico di cosa scrivi nel javascript lato client e nell'endpoint con il metodo del fetch API oppure con l'oggetto xhr per passare una variabile numerica, che viene generata solo dopo un certo intervallo di tempo nel client grazie a setTimeout, nel server e quindi in Mongoose?
  • Avatar di Alka
    Utente Famoso
    Iscritto da
    nov, 2014
    Messaggi
    3504

    McDuck37 ha scritto:

    Puoi farmi un esempio pratico di cosa scrivi nel javascript lato client e nell'endpoint con il metodo del fetch API oppure con l'oggetto xhr per passare una variabile numerica, che viene generata solo dopo un certo intervallo di tempo nel client grazie a setTimeout, nel server e quindi in Mongoose?
    Il cosiddetto "esempio pratico" che mi stai chiedendo è praticamente tutto il lavoro.

    Al netto che puoi trovare esempi ovunque, una parte di codice te l'ho già postata: tu cosa hai scritto?
    Hai iniziato a implementare qualcosa lato server?

    Se non sai nemmeno da dove iniziare, qui non si tratta di esporre un dubbio o una problematica, ma di acquisire le informazioni necessarie per realizzare quanto devi.

    Qualche spunto è stato fornito, quindi puoi iniziare a cercare informazioni più approfondite: se qualcosa non è chiaro, puoi sempre chiedere delucidazioni, ma non ho il tempo di produrre un esempio calzante esattamente sullo scenario che hai proposto di quello che ti serve.
  • Pochi posts
    Iscritto da
    apr, 2020
    Messaggi
    42

    Alka ha scritto:

    McDuck37 ha scritto:

    Puoi farmi un esempio pratico di cosa scrivi nel javascript lato client e nell'endpoint con il metodo del fetch API oppure con l'oggetto xhr per passare una variabile numerica, che viene generata solo dopo un certo intervallo di tempo nel client grazie a setTimeout, nel server e quindi in Mongoose?
    Il cosiddetto "esempio pratico" che mi stai chiedendo è praticamente tutto il lavoro.

    Al netto che puoi trovare esempi ovunque, una parte di codice te l'ho già postata: tu cosa hai scritto?
    Hai iniziato a implementare qualcosa lato server?

    Se non sai nemmeno da dove iniziare, qui non si tratta di esporre un dubbio o una problematica, ma di acquisire le informazioni necessarie per realizzare quanto devi.

    Qualche spunto è stato fornito, quindi puoi iniziare a cercare informazioni più approfondite: se qualcosa non è chiaro, puoi sempre chiedere delucidazioni, ma non ho il tempo di produrre un esempio calzante esattamente sullo scenario che hai proposto di quello che ti serve.
    Grazie, in effetti mi mancano un po di argomenti ma mettiamo che ho queste due cose su server e su client:

    //client ('/')

    <script>
    function addizione(a,b,c){
    c = a+b
    }

    var a
    var b
    var c

    setTimeout(addizione(a,b,c),2000)
    </script>

    //e sul server questo, tralasciando i vari moduli e gli endpoint della connessione al server e get ecc:

    app.post('/',(req,res)=>{

    })

    Cosa devo scrivere nell'endpoint e nello script per far si che nell' endpoint riesco ad indicare "c" per poi farci quello che voglio?
  • Avatar di Alka
    Utente Famoso
    Iscritto da
    nov, 2014
    Messaggi
    3504
    Affrontiamo un problema alla volta: partiamo dall'invio lato client.

    Il codice per l'invio tramite XHR te l'ho già scritto nella prima risposta: prova a rileggerla e a integrare lo snippet all'interno della tua implementazione, sostituendo ovviamente il valore con quello che ti interessa.

    Ciao!
  • Pochi posts
    Iscritto da
    apr, 2020
    Messaggi
    42
    //client ('/')

    <script>
    function addizione(a,b,c){
    c = a+b
    }
    var a
    var b
    var c

    setTimeout(addizione(a,b,c),2000)

    var xhr = new XMLHttpRequest();
    xhr.open("POST", 'url del json', true);
    xhr.setRequestHeader('Content-Type', 'application/json');
    xhr.send(JSON.stringify({
    value: c
    }));
    </script>

    //server

    app.post('/',(req,res)=>{

    })

    Cosi? Ma devo anche aggiungere al progetto un file JSON che funge da intermediario fra il client e il server, sul quale scrivere e leggere il dato che voglio passare quindi?
  • Avatar di Alka
    Utente Famoso
    Iscritto da
    nov, 2014
    Messaggi
    3504

    McDuck37 ha scritto:

    Cosi?
    Innanzitutto, il codice va formattato usando l'apposito pulsantino del forum (< />), altrimenti non si capisce nulla.

    Poi, è chiaro che l'invio del valore deve essere effettuato *dopo* che tale valore è stato calcolato, quindi non puoi mettere la chiamata all'invio appena dopo il setTimeout(), altrimenti il valore verrà inviato quando ancora non è definito, essendo che il calcolo viene eseguito dopo qualche secondo.

    Il codice dell'invio dovrà essere inserito appena dopo il punto in cui il valore di "c", che è ciò che ti interessa inviare, viene determinato.

    McDuck37 ha scritto:

    Ma devo anche aggiungere al progetto un file JSON che funge da intermediario fra il client e il server, sul quale scrivere e leggere il dato che voglio passare quindi?
    Non capisco cosa intendi. Non serve nessun file JSON. Se parli del fatto che si usi JSON per inviare il dato, puoi anche semplificare la chiamata, ma presumo che lato NodeJS qualsiasi infrastruttura accetti un pacchetto JSON in arrivo e lo interpreti senza sforzo... in fondo, stiamo usando JavaScript anche sul server!

    Ciao!
  • Pochi posts
    Iscritto da
    apr, 2020
    Messaggi
    42
    Ho provato ad implementare questo in fetch in quanto in generale fetch mi sembra più facile: 
    
<h1>pagina</h1>
<script>
    var a = 42;

    const requestOptions = {
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify({data: a})
};
fetch('/', requestOptions)
    .then(response => response.json())
    .then(data =>console.log(data));
</script>
    e questo sul server: 
    
const express = require('express')

const app = express()


app.get('/',(req,res)=>{
    res.sendFile('boh.html')
})

app.post('/',(req,res)=>{
    console.log(req.body)
})

const port = process.env.PORT || 3000;
app.listen(port, ()=>{
    console.log(`server attivato sulla porta: ${port}`);
})
    ma per quel console.log(req.body) nel terminale mi da undefined

    Alka ha scritto:

    Mi autoquoto:
    Innanzitutto, il codice va formattato usando l'apposito pulsantino del forum (< />), altrimenti non si capisce nulla.
    Fatto. Chiedo scusa
  • Avatar di Alka
    Utente Famoso
    Iscritto da
    nov, 2014
    Messaggi
    3504
    Mi autoquoto:
    Innanzitutto, il codice va formattato usando l'apposito pulsantino del forum (< />), altrimenti non si capisce nulla.
  • Avatar di Alka
    Utente Famoso
    Iscritto da
    nov, 2014
    Messaggi
    3504

    McDuck37 ha scritto:

    Ho provato ad implementare questo in fetch in quanto in generale fetch mi sembra più facile: [...]
    ma per quel console.log(req.body) nel terminale mi da undefined
    [...]
    Strano l'effetto che ottieni. Prova a dare una occhiata a questo esempio che è più completo.

    Per capire meglio, dovrei copiare/incollare il codice e fare delle prove.
  • Pochi posts
    Iscritto da
    apr, 2020
    Messaggi
    42

    Alka ha scritto:

    McDuck37 ha scritto:

    Ho provato ad implementare questo in fetch in quanto in generale fetch mi sembra più facile: [...]
    ma per quel console.log(req.body) nel terminale mi da undefined
    [...]
    Strano l'effetto che ottieni. Prova a dare una occhiata a questo esempio che è più completo.

    Per capire meglio, dovrei copiare/incollare il codice e fare delle prove.
    Grazie per il tuo tempo. Pima che rispondessi ho trovato questa soluzione aggiungendo alla pagine del server questa riga di codice 
    app.use(express.json({limit: '1mb'}))
    . Dopodiché scrivendo req.body.data ho potuto leggere e salvare senza problemi la mia variabile nel database con Mongoose. Adesso, come da titolo, dovrei fare il viceversa ovvero "buttare" delle variabili lato server in eventuali html che invio con res.sendFile. Cosa posso utilizzare?
Devi accedere o registrarti per scrivere nel forum
12 risposte