Node.js: come realizzare un semplice server web utilizzando i moduli http e url di Node
In un articolo precedente ci siamo occupati di introdurre Node.js, un framework per realizzare applicazioni in Javascript lato server, e di NPM, il gestore dei modulo di Node.
Adesso occupiamoci di codice di programmazione: vediamo un esempio di codice node.js con cui andiamo a creare un vero e proprio, anche se semplice, server web utilizzando il modulo http di node.js, che visualizzerà nel browser il classico "Hello World".
Crea un file "esempio.js" ed inserisci al suo interno questo codice:
var http = require('http');
var server = http.createServer(function (req, res) {
res.writeHead(200, {'Content-Type': 'text/plain'});
res.end('Hello World\n');
})
server.listen(1337, '127.0.0.1');
console.log('Server in attesa su http://127.0.0.1:1337/');Volendo possiamo scriverlo così:
var http = require('http');
http.createServer(function (req, res) {
res.writeHead(200, {'Content-Type': 'text/plain'});
res.end('Hello World\n');
}).listen(1337, '127.0.0.1');
console.log('Server in attesa su http://127.0.0.1:1337/');Eseguiamo il codice da terminale (se usi Windows puoi utilizzare, ad esempio, WIndows Power Shell) digitando
# node esempio.jsNella console log apparirà "Server in attesa su http://127.0.0.1:1337/"
Il server web che abbiamo creato è in ascolto sull'interfaccia 127.0.0.1 (la localhost) e alla porta 1337
Adesso apri il browser, alla url "http://localhost:1337" (oppure http://localhost:1337): il browser contatterà il server Node, che è in esecuzione locale proprio alla porta 1337, ed apparirà a video la frase "Hello Word!"
Vediamo il codice nel dettaglio:
La prima riga include il modulo http di node.js, e l'abbiamo assegnato alla variabile http. La funzione require, infatti, consente di richiamare delle librerie esterne al nostro codice, in questo caso la libreria http che ci restituirà i metodi necessari per creare il nostro web server. Esistono tante librerie, alcune già incluse dentro Node, mentre altre sono scaricabili usando l’NPM, il gestore di pacchetti di Node.js
Abbiamo quindi creato l'oggetto "http" (var http), e grazie a questo invochiamo il metodo createServer, che ritornerà un oggetto di tipo httpServer, e che prende come parametro in ingresso una funzione di callback.
Questa funzione di callback verrà invocata (dal motore V8) ad ogni apertura del browser, nel momento in cui un visitatore si connetterà alla url "http://localhost:1337", ed assumerà come parametri:
- request: è la richiesta HTTP del visitatore (è un oggetto della classe http.ServerRequest) che contiene tutte le informazioni della richiesta del visitatore, ad esempio il suo IP, l’url che vuole visitare, se ha passato paramentri in GET o POST, ....
- response: è l’oggetto che conterrà la risposta restituita dal server al browser del visitatore (è una istanza della classe http.ServerResponse).
Nel nostro esempio abbiamo impostato nel metodo writeHead (nell’header HTTP della risposta) il codice HTTP 200 (OK) ed il Content-Type "text/plain".
Successivamente, al metodo end, passiamo la stringa da ritornare al client cioè "Hello Word".
Definito il comportamento del nostro server web, sfruttando il metodo listen, possiamo finalmente metterlo in ascolto passando il numero di porta (1337) e l'ip dell’interfaccia di rete da utilizzare (127.0.0.1).
Adesso interrompi l’esecuzione dello script, utilizzando CTRL + C su Windows o CTRL + D su Mac e Linux. Se adesso riapri la url nel browser la pagina non sarà più contattabile.
La funzione di callback uno dei concetti più importanti di Node.js, e lo userai moltissimo.
Restituire codice HTML
Nel nostro esempio abbiamo restituito del testo non html, infatti negli header di risposta abbiamo impostato un "Content-Type" di tipo "text/plain".
Per restituire una pagina in formato htm, il "Content-Type" deve essere di tipo "text/html" per cui il nostro codice deve essere modificato così
res.writeHead(200, {"Content-Type": "text/html"});ed il testo di risposta lo indichiamo utlizzando i tag html, così:
res.end('<p>Questo è un paragrafo <strong>HTML</strong>!</p>');Ecco il codice completo
var http = require('http');
http.createServer(function (req, res) {
res.writeHead(200, {'Content-Type': 'text/html'});
res.end('<p>Ecco un paragrafo <strong>HTML</strong>!</p>');
}).listen(1337, '127.0.0.1');
console.log('Server in attesa su http://127.0.0.1:1337/');Dopo avere aggiornato il file "esempio.js" esegui il codice da terminale
# node esempio.jsed apri il browser web alla solita url "http://127.0.0.1:1337"e vedrai il codice formattato.
Tuttavia, un vero codice html, deve contenere anche i tag head, body, il doctype, i meta tag... per cui scriviamo un codice html corretto
var http = require('http');
http.createServer(function (req, res) {
res.writeHead(200, {'Content-Type': 'text/html'});
res.write('<!DOCTYPE html>'+
'<html>'+
'<head>'+
'<meta charset="utf-8" />'+
'<title>Pagina Node.js!</title>'+
'</head>'+
'<body>'+
'<p>Ecco un paragrafo <strong>HTML</strong>!</p>'+
'</body>'+
'</html>');
res.end();
}).listen(1337, '127.0.0.1');
console.log('Server in attesa su http://127.0.0.1:1337/');Adesso abbiamo finalmente un codice http valido.
Riapri il browser e testa questo codice.
Gestione di pagine differenti
Provate ad aprire queste url
http://127.0.0.1:1337/pagina1
http://127.0.0.1:1337/cartella/pagina2
Qualunque pagina apriamo, sotto la nostra url, vedremo sempre la stessa frase di risposta.
Vediamo di sopperire a questo limite, gestendo pagine diverse.
Abbiamo bisogno di sapere quale pagina il visitatore ha richiesto, e per fare questo si utilizza il modulo url di Node che richiamiamo così
var url = require("url");e, grazie al modulo url, andiamo a recuperare il nome della pagina richiesta, in questo modo
url.parse(req.url).pathname;Ecco il codice completo
var http = require('http');
var url = require("url");
http.createServer(function (req, res) {
// la pagina chiamata dall'utente
var page = url.parse(req.url).pathname;
console.log(page);
res.writeHead(200, {'Content-Type': 'text/html'});
res.write('<!DOCTYPE html>'+
'<html>'+
'<head>'+
'<meta charset="utf-8" />'+
'<title>Pagina Node.js!</title>'+
'</head>'+
'<body>'+
'<p>Ecco un paragrafo <strong>HTML</strong>!</p>'+
'</body>'+
'</html>');
res.end();
}).listen(1337, '127.0.0.1');
console.log('Server in attesa su http://127.0.0.1:1337/');Ricora di interrompere l'esecuzione dello script, se è ancora in esecuzione, e rilanciarlo per vedere la nuova pagina.
Ad esempio, apriamo la pagina "http://127.0.0.1:1337/cartella/pagina2": nella console log apparirà questo
/cartella/pagina2
/favicon.icoVedrai la path che hai aperto aperta, cioè "/cartella/pagina2", ed anche "/favicon.ico" perchè la gran parte dei browser cerca di recuperare, anche se non è presente, la “favicon cioè una piccola immagine che rappresenta il sito web e che normalmente si trova nella root del sito.
Adesso che sappiamo come recupare la pagina aperta, possiamo aprire il nostro orizzonte di sviluppo di questa app, introducendo degli "if" per gestire pagine differenti.
Gestiamo la root (/), la "/pagina1", la "/cartella/pagina2", ed il caso in cui si apra una url diversa da queste.
var http = require('http');
var url = require("url");
http.createServer(function (req, res) {
// la pagina chiamata dall'utente
var page = url.parse(req.url).pathname;
console.log(page);
res.writeHead(200, {'Content-Type': 'text/html'});
res.write('<!DOCTYPE html>'+
'<html>'+
'<head>'+
'<meta charset="utf-8" />'+
'<title>Pagina Node.js!</title>'+
'</head>'+
'<body>');
if (page == '/') {
res.write('Sei nella home page');
}
else if (page == '/pagina1') {
res.write('Sei nella pagina 1');
}
else if (page == '/cartella/pagina2') {
res.write('Sei nella pagina 2');
}
else {
res.write('Non puoi accedere a questa pagina');
}
res.write('</body>'+
'</html>');
res.end();
}).listen(1337, '127.0.0.1');
console.log('Server in attesa su http://127.0.0.1:1337/');Dopo avere riavviato lo script da terminale, apri queste url e vedrai risposte differenti
http://127.0.0.1:1337/
http://127.0.0.1:1337/pagina1
http://127.0.0.1:1337/cartella/pagina2
http://127.0.0.1:1337/altrapagina
Gestione di parametri ricevuti in GET
Proviamo ad aprire una delle nostre pagina con appesi alcuni parametri, ad esempio
http://127.0.0.1:1337/pagina1?nome=Mario&cognome=rossi
La parte successiva al punto interrogativo si chiama querysting
nome=Mario&cognome=rossie i parametri "nome" e "cognome", con i relativi valori, sono passati alla nostra url in modalità GET
Per recuperare la querystring utilizziamo questo codice
url.parse(req.url).queryModichiamo il codice così
var http = require('http');
var url = require("url");
http.createServer(function (req, res) {
// la pagina chiamata dall'utente
var page = url.parse(req.url).pathname;
console.log(page);
// la querystring
var qstr = url.parse(req.url).query;
console.log(qstr);
res.writeHead(200, {'Content-Type': 'text/html'});
res.write('<!DOCTYPE html>'+
'<html>'+
'<head>'+
'<meta charset="utf-8" />'+
'<title>Pagina Node.js!</title>'+
'</head>'+
'<body>');
if (page == '/') {
res.write('Sei nella home page');
}
else if (page == '/pagina1') {
res.write('Sei nella pagina 1');
}
else if (page == '/cartella/pagina2') {
res.write('Sei nella pagina 2');
}
else {
res.write('Non puoi accedere a questa pagina');
}
res.write('</body>'+
'</html>');
res.end();
}).listen(1337, '127.0.0.1');
console.log('Server in attesa su http://127.0.0.1:1337/');Rilancia lo script da terminale, ed apri ad esempio questa url
http://127.0.0.1:1337/pagina1?nome=Mario&cognome=rossi
Nella conosole log vedrai
nome=Mario&cognome=rossiAdesso che abbiamo recuperato la querystring, l'ultimo step è splittare i singoli parametri, nel nostro caso "nome" e "cognome"
Per farlo utilizziamo il modulo querystring di Node.
var querystring = require('querystring');E grazie a questo modulo, e con il metodo parse, otteniamo i singoli parametri ricevuti in get
var params = querystring.parse(url.parse(req.url).query);Abbiamo un array di parametri, e quindi, per ottenerne i singoli valori, dobbiamo indicare params['nome'] per ottenere il nome, e params['cognome'] per ottenere il cognome
Ecco il codice completo
var http = require("http");
var url = require("url");
var querystring = require("querystring");
http.createServer(function (req, res) {
// la pagina chiamata dall'utente
var page = url.parse(req.url).pathname;
console.log(page);
// la querystring
var qstr = url.parse(req.url).query;
console.log(qstr);
// otteniamo i singoli parametri
var params = querystring.parse(qstr);
res.writeHead(200, {'Content-Type': 'text/html'});
res.write('<!DOCTYPE html>'+
'<html>'+
'<head>'+
'<meta charset="utf-8" />'+
'<title>Pagina Node.js!</title>'+
'</head>'+
'<body>');
if(params['nome']){
res.write('Il tuo nome: '+params['nome']+'<br />');
}
if(params['cognome']){
res.write('Il tuo cognome: '+params['cognome']+'<br />');
}
if (page == '/') {
res.write('Sei nella home page');
}
else if (page == '/pagina1') {
res.write('Sei nella pagina 1');
}
else if (page == '/cartella/pagina2') {
res.write('Sei nella pagina 2');
}
else {
res.write('Non puoi accedere a questa pagina');
}
res.write('</body>'+
'</html>');
res.end();
}).listen(1337, '127.0.0.1');
console.log('Server in attesa su http://127.0.0.1:1337/');Rilancia lo script da terminale, ed apri questa url
http://127.0.0.1:1337/pagina1?nome=Mario&cognome=rossi
A video apparirà
Il tuo nome: Mario
Il tuo cognome: Mario
Sei nella pagina 1NOTA: nel codice ho inserito degli "if" per verificare l'esistenza dei parametri "nome" e "cognome": così facendo stampo a video i relativi valori solo se i parametri sono presenti nella url. Se no avessi utilizzato questi "if" a video e non passassi i parametri, a video apparirebbero degli "undefined" al posto del valore non passato nella url.
Il tuo nome: undefined
Il tuo cognome: undefined
Sei nella pagina 1E con questo abbiamo ultimato il nostro esempio.
