Un esempio di web application per la gestione utenti realizzata con Spring Boot, Spring Security, Spring Data JPA e JSF (Parte 1)

In questo articolo descriverò come realizzare una web application che utilizza Spring Security per la gestione dei suoi utenti. L’applicazione permetterà a chiunque di registrarsi scegliendo una username, una password e inserendo la propria email. Nell’applicazione saranno presenti delle pagine pubbliche, visibili a tutti gli utenti, e delle pagine private che saranno accessibili ai soli utenti registrati. L’applicazione potrà essere utilizzata come punto di partenza per la realizzazione di un sistema di gestione delle utenze più complesso.

L’articolo è suddiviso in tre parti: nella prima parte descriverò come installare l’applicazione, come lanciarne l’esecuzione e il suo funzionamento. Nella seconda parte dell’articolo descriverò nel dettaglio la sua implementazione e vedremo come l’utilizzo di Spring Boot e di Spring Security semplificano la scrittura del codice sorgente. Infine, nella terza parte dell’articolo, descriverò come eseguire l’applicazione nel cloud, in particolare descriverò come creare due distinti container Docker, uno contenente la nostra applicazione e l’altro il server MySql e spiegherò come utilizzarli con un provider di servizi cloud.

L’applicazione è basata su Spring Boot e utilizza il progetto Spring Security per le operazioni di autenticazione e autorizzazione, Spring Data JPA per semplificare l’accesso al database e la sua interfaccia utente è realizzata utilizzando PrimeFaces e BootFaces. Le informazioni relative agli utenti registrati sono salvate in un database MySql ma il sistema descritto nell’articolo è del tutto generico e permette di utilizzare un qualunque altro meccanismo di memorizzazione delle utenze.

Il codice sorgente dell’applicazione è presente su GitHub all’indirizzo:

 https://github.com/thespringside/gestioneUtenti.git

Download del progetto

Se sul proprio computer è installato Git è possibile copiare in locale il progetto eseguendo il seguente comando (da una finestra dei comandi di Windows o da una finestra Terminal in Linux):

git clone https://github.com/thespringside/gestioneUtenti.git

questo comando crea una directory gestioneUtenti  e salva al suo interno i file del progetto.

Se non si vuole utilizzare Git è anche possibile effettuare direttamente il download del file .zip contenente l’intero progetto: a tale scopo basta aprire nel browser la pagina del progetto presente su GitHub al seguente indirizzo:

https://github.com/thespringside/gestioneUtenti

in questa pagina è possibile selezionare il bottone ‘Dowload ZIP‘ come evidenziato nella figura seguente:

gitHub

In questo caso il browser scaricherà il file gestioneUtenti-master.zip che dovrà essere decompresso in una directory di appoggio.

Creazione del database

L’applicazione utilizza un database MySql per memorizzare i dati degli utenti (username, password, data creazione, ecc.): è necessario quindi che sia installato in locale un server MySql. Accedendo tramite un qualunque client MySql al server, possiamo creare un database di nome gestioneutenti. Utilizzando, per esempio, la console MySql è possibile utilizzare il seguente comando:

create database gestioneutenti;

si deve poi selezionare il database appena creato tramite il comando:

use gestioneutenti;

e infine creare la seguente tabella utente destinata a contenere le informazioni degli utenti:

CREATE TABLE utente (
   id bigint(20) NOT NULL AUTO_INCREMENT,
   data_creazione datetime,
   email varchar(60),
   password varchar(60),
   role varchar(20),
   username varchar(30),
   PRIMARY KEY (id)
) ENGINE=InnoDB;

 

Esecuzione dell’applicazione

Vediamo ora come eseguire l’applicazione appena scaricata. Ci sono due possibili strade:

  1. esecuzione dell’applicazione tramite Maven
  2. esecuzione dell’applicazione tramite Eclipse

La prima soluzione è la più veloce e permette di lanciare direttamente l’applicazione dalla finestra dei comandi utilizzando il comando mvn del tool Maven, mentre la seconda soluzione prevede che il progetto sia prima importato in Eclipse e poi che l’applicazione sia compilata ed eseguita all’interno dell’IDE.

1- esecuzione dell’applicazione tramite Maven

Se si ha Maven installato sul proprio computer, una volta effettuato il download del progetto è possibile spostarsi all’interno della directory in cui è stata salvata l’applicazione e lanciarla tramite il seguente comando:

mvn spring-boot:run

Al termine della fase di inizializzazione, l’applicazione sarà disponibile al seguente indirizzo:

http://localhost:8080/

2 – esecuzione dell’applicazione tramite Eclipse

Per semplificare lo sviluppo dell’applicazione ho utilizzato il progetto Lombok. Questo progetto permette di semplificare la scrittura delle classi java tramite l’utilizzo di apposite annotazioni che consentono di evitare di scrivere i metodi getter e settertoString e, soprattutto, i metodi equalshashCode che assumono un ruolo particolarmente importante quando si utilizza un framework come JPA (Java Persistence API).

Per poter utilizzare Lombok in Eclipse è necessario prima installarlo: a tale scopo basta effettuare il download del file lombok.jar ed eseguire il comando:

java -jar lombok.jar

Questo comando lancia l’installer di Lombok che tenta di determinare i diversi IDE installati sul computer, in ogni caso è sempre possibile premere il bottone ‘Specify location…‘ per scegliere manualmente il percorso in cui è installato Eclipse sul proprio file system, come evidenziato nella figura seguente:

lombok

Dopo aver correttamente installato il progetto Lombok è possibile lanciare Eclipse ed importare il progetto GestioneUtenti precedentemente scaricato da GitHub: a tale scopo si deve selezionare la voce di menù File -> Import… e poi scegliere l’opzione Maven -> Existing Maven Projects, in questo modo Eclipse visualizzerà una finestra di dialogo in cui sarà possibile scegliere la directory in cui è stato precedentemente salvato il progetto GestioneUtenti sul proprio file system. La procedura da seguire è del tutto analoga a quella descritta nell’articolo http://www.thespringside.com/?p=19 dove ho spiegato come importare un progetto Maven generato dal tool Spring Initializr

Al termine dell’importazione è importante cliccare con il tasto destro del mouse sul nome del progetto e scegliere la voce Maven -> Update Project… per permettere ad Eclipse di importare tutte le librerie necessarie al progetto (ricordo che i file .jar utilizzati dall’applicazione sono dichiarati nel file pom.xml). Per eseguire l’applicazione basterà poi premere con il tasto destro del mouse sul nome del file GestioneUtentiApplication.java (presente nella directory src/main/java e appartenente al package com.thespringside.gestioneutenti)  e scegliere  Run As -> Java Application

Terminata la fase di avvio dell’applicazione è possibile visualizzare la sua home page all’indirizzo http://localhost:8080/

Descrizione dell’applicazione

Qualunque sia il metodo seguito per lanciare l’applicazione, la prima pagina visualizzata quando si inserisce nel browser l’indirizzo:  http://localhost:8080/ è la seguente:

 

home

Nell’applicazione ci sono alcune pagine pubbliche e alcune pagine private. Le pagine pubbliche, come la home page, sono accessibili da chiunque, mentre le pagine private possono essere visualizzate solo da utenti che siano registrati nel sistema e dopo che abbiano correttamente effettuato l’operazione di login.

Selezionando il bottone ‘Registrati‘ è possibile effettuare la registrazione di un nuovo utente. L’applicazione visualizza la seguente pagina:

registrazione1

In questa pagina è necessario immettere le seguenti informazioni:

  • username
  • password
  • ripetizione della password immessa
  • e-mail

Si osservi che una volta immessa la username, non appena il campo perde il focus, scatta un evento di validazione per verificare che il valore immesso non sia già utilizzato da un altro utente; in questo caso l’applicazione segnala l’errore come visualizzato nella figura seguente:

erroreUsername

Altre validazioni sono effettuate sui restanti campi. Per esempio, se l’indirizzo e-mail non ha un formato corretto, l’applicazione visualizza il seguente messaggio di errore:

erroreEmail

Se non sono riscontrati errori, dopo la pressione del bottone ‘Registra utente‘, l’applicazione salva le informazioni del nuovo utente nel database e visualizza un messaggio per confermare la sua corretta registrazione:

fineRegistrazione

A questo punto abbiamo un utente registrato nell’applicazione che, quindi, potrà accedere alle pagine protette. Per esempio potrà visualizzare la lista degli utenti registrati nel sistema scegliendo la voce di menù Utenti -> Lista Utenti, come evidenziato nella figura seguente:

menuListaUtenti

Avendo richiesto la visualizzazione di una pagina riservata ai soli utenti registrati, l’applicazione mostra la pagina di login per permettere all’utente di inserire la sua username e password:

login

Una volta immessi la username e la password e premuto il bottone ‘Login‘, l’applicazione verifica che le informazioni immesse si riferiscono ad un utente registrato e, in caso affermativo, visualizza la pagina protetta contenete la lista di tutti gli utenti registrati nel sistema:

listaUtenti

Questa pagina visualizza la lista degli utenti che si sono registrati e, per ciascun utente, la sua username, l’email, la data di creazione e il ruolo assegnato. Ovviamente non è visualizzata la password che l’applicazione salva nel database non in chiaro ma cifrata tramite l’utilizzo dell’algoritmo Bcrypt. L’applicazione assegna in automatico, a ciascun utente, un ruolo chiamato ROLE_USER; l’applicazione è anche predisposta per utilizzare un secondo ruolo chiamato ROLE_ADMIN; questi ruoli non sono attualmente utilizzati ma sono stati introdotti per mostrare come definire i ruoli e come assegnarli ad un utente. Successive estensioni dell’applicazione potrebbero differenziare gli utenti in base ai ruoli assegnati e permettere ad utenti con ruoli diversi di poter accedere a differenti funzionalità.

Sempre nella pagina contenente la lista degli utenti è presente, in alto a destra, il nome dell’utente attualmente connesso e il bottone per effettuare l’operazione di logout, questa operazione è utile se, per esempio, l’utente vuole disconnettersi per poi effettuare il login utilizzando una username diversa.

Per finire, un’ultima osservazione: per realizzare l’applicazione ho utilizzato il progetto BootsFaces che permette facilmente di integrare il famoso framework Bootstrap in applicazioni che utilizzano JavaServer Faces. In questo modo è facile realizzare applicazioni web responsive che utilizzano i componenti e i widget di Bootstrap. Se si visualizza l’applicazione Gestione Utenti in un browser di un dispositivo mobile, si ottiene la seguente visualizzazione che si adatta alle dimensioni del device:

homeMobile

mentre la pagina di registrazione degli utenti sarà visualizzata nel seguente modo:

registrazioneMobile

Nella seconda parte di questo articolo descriverò nel dettaglio l’implementazione di questa applicazione.

A presto

@Copyright Roberto Venanzi – www.thespringside.com

2 thoughts on “Un esempio di web application per la gestione utenti realizzata con Spring Boot, Spring Security, Spring Data JPA e JSF (Parte 1)

  • 26 Aprile, 2016 at 10:16 pm
    Permalink

    Ciao sto studiando spring da poco, a quando i prossimi articoli?

    Reply

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *