Ottenere dati dal file Node.js e visualizzarlo nella pagina HTML/JS

Question

Sono nuovo di Node.js e questo è il mio primo progetto con esso. Ho creato un file node.js denominato test.js. Ha un array dire a.

Ora voglio creare un file HTML che chiama questo test.js sull'evento click del pulsante. Quindi recupera i dati da quel file e pubblicali su una tabella nel file HTML.

Ho già scritto il file node.js e posso vedere i risultati su console.log (a). Ma non riesco a capire come inviare questo array all'HTML quando lo chiederanno.

Nel frattempo, ho cercato su Google un codice. La richiesta raggiunge il server ma ottengo sempre la risposta di errore dal server. Perchè così?

lato client -

function fetch() { 
    $.ajax({ 
    type: 'POST', 
    url: "http://127.0.0.1:8888", 
    data: 'China', 
    datatype: 'json', 
    success: function (data) { 
     alert("hi"); 
     var ret = jQuery.parseJSON(data); 
     $('#q').html(ret.msg); 
    }, 
    error: function (xhr, status, error) { 
     alert("hii"); 
    } 
}); 

lato server:

http.createServer(function(request, response) { 
    console.log("Request received"); 
    response.writeHeader(200, {"Content-Type": "application/json"}); 
    request.on('data', function (chunk) { 
     console.log(chunk.toString('utf8')); 
        consol.log(result); 
     response.write(JSON.stringify({data : result})); 
    });  
    response.end(); 
}).listen(8888); 

posso vedere la Cina sulla console.But io non tornare la matrice risultato al client. Qui il risultato è un array e ottengo il suo valore sulla console. Solo che non lo rispondo al cliente. Qualsiasi aiuto ?

Answer 1

Si dovrebbe iniziare impostando un server per servire le richieste. Io uso expressjs per questo - http://expressjs.com/

Ciò consentirà di eseguire nodejs come applicazione Web.

Imposta un percorso in veloce JS per servire i vostri dati - http://expressjs.com/api.html#express

var express = require('express'); 
var app = express(); 

app.get('/data', function(req, res){ 
    res.send('hello world'); //replace with your data here 
}); 

app.listen(3000); 

Aprire un browser e digitare http://MY_SERVER_ADDR:3000/data e si dovrebbe vedere l'output lì.

Successivamente, sarà necessario allegare un gestore pari al file HTML che attiverà una richiesta $ .get() quando viene attivata. Aggiungi l'url precedente ai tuoi dati nella tua chiamata $ .get e fai qualcosa con esso.

$('.my_selector').click(function(){ 
    $.get('http://MY_SERVER_ADDR:3000/data', {}, function(data){ 
     console.log(data) 
    }); 
}); 

Questo dovrebbe farti andare.

Answer 2

Dopo aver affrontato la stessa domanda, ho scoperto che questo è esattamente il punto in cui un motore di template entra nell'immagine del nodo. EJS l'ha risolto per me, ma ce ne sono molti altri disponibili. Questo article confronta 10 motori di modello.