2013-10-09 18 views
6

Sto imparando Node.js.Invia dati al server Node.js dal modulo HTML

ho questo nel mio server:

var http = require("http"); 
var url = require("url"); 

http.createServer(function(request, response){ 
    response.writeHead(200, {"Content-Type":"text/plain"}); 
    var params = url.parse(request.url,true).query; 

    console.log(params); 

    var a = params.number1; 
    var b = params.number2; 

    var numA = new Number(a); 
    var numB = new Number(b); 

    var numOutput = new Number(numA + numB).toFixed(0); 

    response.write(numOutput); 
    response.end(); 
}).listen(10000); 

Un URL simile a questo: localhost:10000/?number1=50000&number2=1 riecheggia 50001 con il mio browser, in modo che funziona.

Senza usare Express, ho bisogno di inviare quei 2 parametri attraverso un modulo usando HTML.

Come può essere raggiunto?

+1

http://stackoverflow.com/questions/15568851/how-i-can-send-data-from-html-form-to-node-js-function – Andy897

+0

@ Andy897 - già guardato questo. Tuttavia, il mio insegnante non vuole che io usi Express. –

+0

http://stackoverflow.com/questions/8811213/how-to-post-a-form-from-html-into-node-js-file – Andy897

risposta

5

La risposta semplice è <form method="get">. Il browser trasformerà i dati del modulo in parametri di stringa di query che stai già gestendo.

Se è necessario POST, i moduli HTML vengono registrati come corpo della entità di richiesta. Nel nodo, una ClientRequest (la variabile request nell'esempio) emette un evento data ogni volta che un blocco del corpo arriva sul server. Non si riceverà l'intero corpo in una sola volta. Devi bufferizzare fino a quando non hai ricevuto l'intero corpo, quindi analizzare i dati.

Questo è difficile da ottenere a causa di cose come Chunked vs normale Transfer-Encoding e i diversi modi in cui i browser possono inviare i dati del modulo. Vorrei solo usare formidable (che è quello che Express usa comunque dietro le quinte), o almeno studiare come gestisce i messaggi di forma se devi assolutamente implementare il tuo. (E in realtà, farlo solo per scopi didattici – Non posso sottolineare abbastanza che si dovrebbe usare formidabile per tutto ciò che potrebbe finire in produzione.)

2

ho risolto il mio problema in questo modo:

sum.js :

var http = require("http"); 
var url = require("url"); 

http.createServer(function(request, response){ 
    response.writeHead(200, {"Content-Type":"text/plain"}); 
    var params = url.parse(request.url,true).query; 

    console.log(params); 

    var a = params.number1; 
    var b = params.number2; 

    var numA = new Number(a); 
    var numB = new Number(b); 

    var sum = new Number(numA + numB).toFixed(0); 

    response.write(sum); 
    response.end(); 
}).listen(10001); 

Index.HTML:

<html> 
    <head> 
      <title> Pedir random </title> 

      <script type="text/javascript"> 
       function operacion(){ 
         var n1 = document.getElementById("num1").value; 
         var n2 = document.getElementById("num2").value; 

         location.href = "http://localhost:10001" + "?number1=" + n1 + "&number2=" + n2; 
       } 
      </script> 

    </head> 

    <body> 
      <h1>Inserte dos números </h1> 
      <form id="forma1"> 
       <input type="text" id="num1"></input> 
       <input type="text" id="num2"></imput> 
       <input type="button" onClick="operacion()" id="enviar" value="enviar"></input> 
      </form> 
    </body> 

<html> 

non so se è il modo giusto di farlo, ma è risolto le mie esigenze.

+4

C'è zero motivi per usare JavaScript nel browser come questo. Cambialo in '

' e '' e il gioco è fatto. – josh3736

2

Il modulo di giada (supponendo che si sta usando espresso) dovrebbe essere simile a questo:

form(action="/" method="post") 
    input(name="whateverSearch" placeholder="search" autofocus) 

poi passare alla nuova presentato datapoint whateverSearch si utilizza req.body per trovarlo (vedi sotto). Qui, ho preso il punto dati e l'ho registrato nella console, e poi l'ho inviato al DOM, così come il titolo della pagina.

router.post('/', function(req, res) { 
    whateverSearch = req.body.whateverSearch; 
    console.log(whateverSearch); 
    res.render('index', { title: 'MyApp', inputData: whateverSearch}); 
});