CARICARE L’IMMAGINE DEL PRODOTTO
Una delle funzionalità più utili in un progetto è quella di memorizzare lato server dei file. Nel nostro caso faremo in modo da inviare al server delle immagini di prodotto, immagini in formato png. La pagina jsp interessata sarà la pagina del dettaglio articolo. Come ricorderai abbiamo fino adesso predisposto un’immagine segnaposto, ora daremo all’utente la possibilità, nel momento in cui crea un articolo, di aggiungere anche un’immagine del prodotto visualizzata nel dettaglio articolo. Il nostro obbiettivo è quello di fare in modo che quando esista un’immagine coerente con il codice del prodotto al posto dell’immagine segnaposto vedremo la nuova immagine. Ti riporto le modifiche da effettuare nella pagina del dettaglio articolo.
IsFileOk è una variabile booleana che se valorizzata a true indica la presenza di un’immagine di prodotto avente estensione .png da visualizzare. È importante sottolineare che il nome dell’immagine deve essere lo stesso del codice articolo. Viceversa, se false verrà visualizzata l’immagine segnaposto. Questa variabile booleana come vedremo verrà passata alla pagina jsp dal controller. Creiamo una nuova cartella all’interno di images e chiamiamola Articoli. Questo è il codice da inserire nel controller.
Come vedi nei parametri è stata inserita la HttpServletRequest per recuperare la root directory, poi è stata inizializzata una variabile booleana IsFileOk a false. Se l’articolo esiste, più avanti vedremo come creare quell’eccezione personalizzata, lo recuperiamo e in un blocco try catch andiamo a recuperare il path dell’immagine. Creiamo poi un nuovo file avente come percorso il percorso dell’immagine se esiste e valorizziamo la variabile booleana con il metodo exists() della classe File che restituisce true se il file esiste, false in caso contrario. Passiamo infine la variabile booleana alla vista tramite il modello.
NB: Attenzione al PathImages che su macOS è il seguente:
private final String PathImages = “static/images/Articoli/”;
Su Windows e su Linux potrebbe differire il simbolo della barra che suddivide il percorso. Vai in debug se non visualizzi l’immagine.
INVIARE UN FILE AL SERVER WEB
Adesso daremo la possibilità all’utente di inserire un file immagine dalla vista di inserimento articolo. Il primo passo è quello di aggiungere una nuova dipendenza al file pom.xml.
Per abilitare l’upload di qualsiasi tipo di file sul server dobbiamo creare una nuova classe di configurazione, MultipartResolverConfig.java. Come primo passo quando abbiamo a che fare con una classe di configurazione dobbiamo aggiungere la notazione @Configuration, ciò dirà all’IOC di caricare tale classe all’avvio dell’applicazione.
Ho creato un nuovo Bean in cui ho specificato tutte le costanti definite precedentemente, poi all’interno di un blocco try catch ho determinato l’upload temp directory e eseguito materialmente l’upload sul server, infine ho restituito il resolver. Questo Bean ci permetterà di fare il trasferimento del file nella directory temporanea. Poi dalla directory temporanea i file dovranno essere scritti nella directory primaria quella dove i file dovranno essere effettivamente inseriti, cioè nella cartella Articoli sotto images. Questo sarà il lavoro che farà un’altra parte della nostra applicazione. Adesso apportiamo una modifica alla classe di dominio dove ho aggiunto il campo privato private MultipartFile Immagine; e i rispettivi getter e setter. Tecnicamente questa è la variabile che conterrà la nostra immagine. Adesso andiamo a modificare il controller nel metodo di inserimento nuovo articolo.
MODIFICHE APPORTATE AL CONTROLLER
Ho inserito una nuova variabile di tipo MultipartFile che ottengo dalla proprietà getImmagine() della classe di dominio. Il codice va inserito dopo aver verificato se ci sono errori di validazione, le prime due righe servono ad ottenere il path dell’immagine se presente la terza riga all’interno del try è la più importante e serve a fare il trasferimento del file dalla directory temporanea alla nostra cartella Articoli. Ultima modifica al controller è quella dell’initializeBinder dove dobbiamo aggiungere “immagine”.
enctype=“multipart/form-data” aggiunto a livello di form indica che questo form può effettuare il trasferimento di file. Per testare il funzionamento usa l’immagine che hai a disposizione all’interno di images/Articoli spostala in un nuovo percorso e crea un nuovo prodotto avente lo stesso codice dell’immagine, io l’ho chiamato C000001 fai l’upload in modo da trasferire l’immagine nella directory temporanea e quando salvi l’immagine passerà dalla cartella temporanea alla directory Articoli. Una volta fatto l’inserimento vai nel dettaglio dell’articolo, dovresti vedere l’immagine dei sofficini Findus.
GESTIONE DELLE ECCEZIONI
Prova ad aprire il dettaglio di un articolo, nell’url digita un codice di prodotto inesistente. Quello che ottieni è una schermata di errore internal server error http status 500. Di sicuro non è una schermata bella a vedersi né professionale. Ora faremo in modo di creare una eccezione personalizzata che informi l’utente che il codice prodotto digitato non esiste. Creiamo un nuovo package
com.xantrix.webapp.exception e aggiungiamo la classe NoInfoArtFoundException.java.
Come vedi la classe estende la RuntimeException. È una classe molto semplice che non necessita di spiegazioni, l’unica cosa è la notazione @ResponseStatus il cui value specifica che laddove si entrerà in una pagina con un elemento non trovato allora interverrà questa classe. Andiamo nel controller e creiamo un nuovo metodo.
Sarà esattamente questo metodo a gestire il nostro errore, per farlo dobbiamo inserire una specifica notazione @ExceptionHandler che prende come argomento la classe appena creata. Il ModelAndView è una variante del Model che abbiamo usato fino adesso, come vedi è del tutto simile, si impostano i valori da passare alla vista con addObject, si imposta la vista con setViewName e infine si restituisce l’oggetto. L’eccezione viene gestita nel dettaglio articolo, qualora il recordset trovato sia null o empty lanciamo l’eccezione. Adesso dobbiamo creare la nuova vista noInfoArt, quindi si modifica il tiles.xml e si crea la nuova vista di cui riporto il codice.
RESTITUIRE I DATI IN FORMATO JSON O XML
Fino a questo punto della trattazione abbiamo sempre restituito i dati in formato html. Non siamo vincolati solo a questo formato, infatti possiamo restituire la risposta anche in formato JSON o XML. Il formato JSON è il formato più usato per l’interscambio dei dati, il formato XML un po’ più datato viene usato sempre come formato di interscambio ma nei Web Service. Il primo passo è quello di aggiungere nuove dipendenze al file POM.XML
Il passo successivo è quello di modificare il nostro file di configurazione principale, procediamo con l’inserire due nuovi Bean che si occuperanno della conversione nei formati desiderati.
Nel metodo setClassesToBeBound abbiamo specificato per il momento la sola classe Articoli. Il passo successivo sarà quello di specificare il ViewResolver, come ci ricorderemo è il ViewResolver che trasforma i dati del modello nel formato che vogliamo, la parte più importante di questo codice è quando nella classe ArrayList andiamo ad aggiungere i due Bean appena creati. Modificata la classe di configurazione facciamo una piccola modifica alla classe Articoli, in cima alla classe usiamo la notazione @XmlRootElement che specifica la radice per la conversione XML. Nel campo privato MultiPartFile Immagine usiamo la notazione @JsonIgnore in quanto questo campo non dovrà essere visualizzato. L’ultima notazione da inserire è nel getter dell’immagine ed è la @XmlTransient. Una volta fatte queste modifiche recati nel dettaglio di un articolo e visualizza i dati o nel formato JSON o XML.
DOWNLOAD CODICE DELL’ARTICOLO
Il progetto AlphaShopV4.zip è per il DBMS SQL Server mentre AlphaShopV5.zip è per MySQL.
Scrivi un commento