Non introdurremo ancora l'interazione con un server di dati per non appesantire l'esposizione, utilizzeremo una struttura dati in memoria per memorizzare le utenze, ma struttureremo il codice in maniera tale da non dover modificare la parte di gestione delle varie richieste presenti nel modulo delle rotte degli utenti: come? Ma utilizzando un altro bel raviolone :).
Prima di mettere il naso nel codice, navigate l'applicazione aggiornata su heroku per capire dove vogliamo andare a parare: https://whispering-peak-1284.herokuapp.com.
Provate a fare il login con username ivan e password saracino, che ha un profilo admin, notate come il menu presenti funzionalità (da implementare) di amministrazione.
Fate il logout per pulire la sessione e entrate nella pagina di registrazione, inserendo una vostra utenza; verrete rediretti alla pagina di login con un opportuno messaggio per effettuare l'autenticazione con le credenziali appena create: rifate il login e notate come cambia il menu e i messaggi di benvenuto presenti nell'header.
Ad ogni riavvio della applicazione, ovviamente tutte le utenze create non ci saranno più, rimarrà valido solo l'utente admin ivan saracino.
Per capire come abbiamo strutturato il codice, date un'occhiata al seguente diagramma di oggetti
Vi ricordo che moduli nel contesto javascript non sono altro che oggetti che espongono particolari proprietà che possono essere anche funzioni.
Il diagramma in alto non dice altro che il modulo app utilizza il modulo delle rotte utenti che a sua volta utilizza il modulo serviziUtenze: grazie a questa separazione di responsabilità tra moduli diversi sarà facile tenere sotto controllo la complessità del nostro progetto.
Il modulo app ha la responsabilità di configurare l'intera applicazione, tramite, ad esempio, l'utilizzo di moduli particolari di express per la gestione delle sessioni o il parsing del corpo delle richieste http: per poter effettuare il post dei form, dovremo includere nel codice del modulo app le seguenti istruzioni
var bodyParser = require('body-parser');
...
app.use(bodyParser.urlencoded({ extended: true }));
Il modulo utenti ha la responsabilità di definire le funzioni da eseguire per gestire le varie funzionalità legate agli utenti quali il login e la registrazione.
var express = require('express');
var router = express.Router();
var serviziBiblioteca = require('../servizi/serviziUtenze');
router.route('/login')
.get(function(request,response) {
response.render('login');
})
.post(function(request,response){
var utente = serviziBiblioteca.login(
request.body.username,
request.body.password
);
if (utente) {
request.session.utente = utente;
response.render('home');
}
else {
response.render(
'login',
{ loginFallito : 'Utente non abilitato'}
);
}
});
router.route('/registrazione')
.get(function(request,response) {
response.render('registrazione');
})
.post(function(request,response) {
var utente = {};
utente.username = request.body.username;
utente.password = request.body.password;
utente.email = request.body.email;
utente.profilo = 'semplice';
serviziBiblioteca.registra(utente);
response.render('login', {
registrazioneOk: 'Ora puoi effettuare il login!'});
});
router.route('/logout')
.get(function(request,response) {
request.session.destroy(function() {
response.redirect('/');
});
});
module.exports = router;
Prendiamo ad esempio la richiesta /utente/login e osserviamo come nel caso di una richiesta get venga semplicemente renderizzata la pagina login.jade, mentre nel caso di una richiesta di tipo post venga utilizzato il modulo serviziUtenze per effettuare la vera e propria autenticazione.
Per estrarre i parametri dalla richiesta post, basta usare un codice del tipo request.body.nomeparametro.
Nel modulo serviziUtenze risiede la logica di business vera e propria, in questo caso abbiamo creato un modulo che espone due metodi login e registra che utilizzano un array di oggetti in memoria come base dati delle utenze inizializzato con l'utente admin ivan saracino.
module.exports = (function(){
var utentiRegistrati = [
{
username : 'ivan',
password: 'saracino',
email: 'ivan.saracino@gmail.com',
profilo: 'admin'
}
];
var login = function(username,password) {
var utentiLoggati = utentiRegistrati.filter(function(utente) {
return utente.username === username &&
utente.password === password;
});
return utentiLoggati[0];
};
var registra = function(utente) {
utentiRegistrati.push(utente);
console.log(utentiRegistrati);
};
return {
login : login,
registra : registra
};
})();
Per la generazione del menu dinamico, osserviamo il file menu.jade incluso nel layout
if (!session.utente)
ul(class='nav nav-pils')
li(role='presentation')
a(href='/utente/login') Login
li(role='presentation')
a(href='/utente/registrazione') Registrati!
else
ul(class='nav nav-pils')
li(role='presentation')
a(href='/utente/logout') Logout
if (session.utente.profilo === 'semplice')
li(role='presentation')
a(href='#') link semplice 1
li(role='presentation')
a(href='#') link semplice 2
else
li(role='presentation')
a(href='#') link admin 1
li(role="presentation")
a(href='#') link admin 2
Non abbiamo implementato una validazione dei parametri passati al server, nel prossimo post vedremo come affrontare questo argomento tramite l'utilizzo di un middleware opportuno.
Come al solito, ho aggiornato su github il progetto installato su heroku, in modo che possiate avere sempre tutto il codice a disposizione, in questo post è spiegato come utilizzare github.
Dopo aver fatto il pull del progetto, ricordatevi di eseguire npm install nella cartella di progetto per installare la dipendenza aggiuntiva per il modulo body-parser : se volete eseguire il programma in locale digitate node app.js e puntate il browser all'indirizzo http://localhost:5000.
Alla prox
Ivan
