[Questo è il secondo di una serie di articoli relativi allo sviluppo di una semplice web application. Qua la parte 1]
PROGETTARE LA PRIMA APPLICAZIONE
In questa sezione inizieremo ad espandere la nostra applicazione con diverse componenti, inserendo una nuova pagina contenente un form per l’inserimento di dati di input da parte dell’utente, realizzando la nostra prima servlet ed interfacciando un database per la memorizzazione dei dati. Nello specifico, la funzionalità che vogliamo aggiungere alla nostra applicazione è la possibilità di creare degli utenti e di memorizzare le relative informazioni in un database, in modo da averle sempre a disposizione e di potere accedere ad esse in qualsiasi momento.
La prima cosa da fare, quindi, è farci uno schema di questa nuova funzionalità che vogliamo inserire, degli oggetti che ci serviranno per implementarla e delle interazioni tra di essi.
La figura seguente mostra lo schema relativo alla funzionalità di creazione degli utenti della nostra applicazione:
La creazione di un utente passerà quindi attraverso i seguenti steps:
- L’utente arriva sulla homepage
- Dalla homepage l’utente potrà cliccare sul link “Create New User”
- Si aprirà una nuova pagina con un form per l’inserimento dei dati dell’utente
- L’utente clicca il pulsante “create”
- La richiesta http POST viene inviata alla Servlet chiamata AddUser
- La Servlet inserisce i dati relativi all’utente creato nel database
- La Servlet inoltra la richiesta ad una pagina JSP
- La pagina JSP indica che l’utente è stato creato e mostra le sue relative informazioni
CREARE IL FORM DI INPUT
Iniziamo creando la nuova pagina che conterrà il form per l’inserimento dei dati.
Nel nostro progetto Eclipse clicchiamo con il tasto destro sulla cartella WebContent, selezioniamo la voce “New” del menù contestuale e poi scegliamo “HTML file”. Inseriamo nel wizard che ci viene mostrato il nome della nostra nuova pagina, “createuser.html” e poi clicchiamo “Finish” (Per il momento saltiamo la pagina relativa alla scelta della DTD – Document Type Definition da utilizzare).
Inseriamo nella pagina appena creata il codice per la realizzazione dei campi del form in cui l’utente dovrà introdurre i dati per la sua registrazione. Avendo definito l’oggetto UTENTE come composto da 3 valori di tipo stringa, andiamo ad inserire nella nostra pagina web le rispettive aree di testo ed il pulsante per l’invio alla nostra servlet delle informazioni contenute nel form.
La figura seguente mostra la nuova pagina create all’interno del progetto Eclipse ed il suo codice sorgente, contenente il form per l’inserimento dati.
Ora che abbiamo creato la nuova pagina possiamo lanciare nuovamente l’applicazione e vedere se la pagina viene raggiunta dal link posizionato in homepage e visualizzata correttamente.
Se quanto abbiamo fatto è corretto, il risultato che otteniamo è quello rappresentato nella figura seguente:
CREARE LA PRIMA SERVLET
Il prossimo passo consiste nel creare la servlet che si occuperà di processare la richiesta di creazione di un nuovo utente, che verrà mappata (approfondiremo questo concetto tra pochissimo) sull’indirizzo di destinazione precedentemente specificato nell’attributo “action” del tag “form” ed invocata una volta che l’utente preme il pulsante “create”.
Per fare questo clicchiamo con il tasto destro del mouse sul nostro progetto, selezioniamo “New” dal menù contestuale e poi selezioniamo ancora “Servlet”, come illustrato in figura:
A questo punto si apre il wizard di Eclipse illustrato nella figura seguente, nel quale:
- Il campo “Source folder” è già pre-compilato con il percorso della nostra cartella dei file sorgenti, cioè “/WebTest/src” e manteniamo questo valore.
- Inseriamo il nome del package che abbiamo appena creato, in cui vogliamo quindi inserire la classe della nostra servlet: com.dede.app1st.controller
- Inseriamo il nome della classe della nostra Servlet, che chiameremo AddUser
- Il campo “Superclass” è già pre-compilato con il nome della classe che deve essere estesa dalla nostra Servlet
Clicchiamo su “Next” e procediamo con la creazione della nostra Servlet: inseriamo una descrizione della nostra servlet nel campo denominato appunto “Description” ed inseriamo l’URL sul quale la nostra servlet verrà mappata. Quest’ultima operazione richiede un po’ di attenzione, in quanto l’URL inserito deve corrispondere a quello che abbiamo indicato nell’attributo “action” del tag “form” nella nostra pagina web createuser.html.
Per cui, dobbiamo invocare il metodo getParameter() sull’oggetto request una volta per ciascuno dei parametri di cui vogliamo recuperare il valore. Il valore che dobbiamo passare come parametro è quello del “name” che abbiamo assegnato ai componenti del form. Per recuperare, ad esempio, il valore che l’utente ha inserito nel campo “firstname” dobbiamo utilizzare il codice seguente:
First Name: <% String fName = request.getParameter("firstname"); out.print(fName); %>
La figura seguente mostra il codice della nostra JSP modificato per recuperare i dati presenti nella richiesta e mostrare una pagina di avvenuta creazione dell’utente con tali dati:
A questo punto proviamo ad eseguire nuovamente la nostra applicazione. Quindi dalla toolbar di Eclipse o dal menu contestuale selezioniamo “Run as” e poi “Run on server”. Ci aspettiamo che appaia all’interno di Eclipse la homepage della nostra applicazione, come avevamo già visto nel paragrafo “LA PRIMA ESECUZIONE DEL PROGETTO” .
Clicchiamo nuovamente sul link “Create new user”, inseriamo i dati per la creazione dell’utente e poi sottomettiamo il form.
La richiesta viene indirizzata all’url su cui è mappata la nostra servlet e forwardata alla pagina JSP che la processa e, come previsto, ci mostra il messaggio di avvenuta creazione dell’utente ed i relativi valori degli attributi.
Bene, il risultato è quello che ci aspettavamo, quindi abbiamo la nostra prima servlet e la nostra JSP funzionanti ed in grado di processare le richieste.
Il prossimo step sarà quello di introdurre un ulteriore livello nella nostra architettura, rappresentato da un database relazionale che ci permetterà di salvare e rendere persistenti i dati della nostra applicazione, quindi nello specifico di salvare in tabella le informazioni relative ai nostri utenti. Raffineremo anche l’implementazione del paradigma MVC, introducendo di fatto il Model dei nostri oggetti “User”, sul quale finora abbiamo sorvolato, recuperando in modo diretto le informazioni dalla request e concentrandoci solo sul loro interscambio.
Vai alla terza parte: Creare una semplice web application con JAVA, Eclipse, Tomcat, Hibernate e PostgreSQL – Parte #3
Leggi anche:
Pingback: Creare una Servlet: ANNOTATIONS (Servlet 3.0) VS. XML (fino a Servlet 2.5) | Dede Blog
Pingback: Creare una semplice web application con JAVA, Eclipse, Tomcat, Hibernate e PostgreSQL – Parte #3 | Dede Blog
Pingback: Creare una semplice web application con JAVA, Eclipse, Tomcat, Hibernate e PostgreSQL – Parte #1 | Dede Blog
grazie…preziosissimo…
Pingback: Java Creare Login - ITACCEDI
Pingback: Java Creare Login » Accedi.Biz