0% ont trouvé ce document utile (0 vote)
89 vues2 pages

Upload et affichage d'images de films

Ce TP décrit les étapes pour réaliser l'upload et l'affichage d'images de films. Il explique comment ajouter un champ photo à l'entité Film, uploader une image via un formulaire, stocker l'image sur le disque et l'afficher pour un film spécifique.

Transféré par

Yùš Rą Màhjõùß
Copyright
© © All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd
0% ont trouvé ce document utile (0 vote)
89 vues2 pages

Upload et affichage d'images de films

Ce TP décrit les étapes pour réaliser l'upload et l'affichage d'images de films. Il explique comment ajouter un champ photo à l'entité Film, uploader une image via un formulaire, stocker l'image sur le disque et l'afficher pour un film spécifique.

Transféré par

Yùš Rą Màhjõùß
Copyright
© © All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd

TP4 : Upload d’image

Ce TP a pour objectif de réaliser l’upload d’une image d’un film pendant son ajout puis
l’affichage de l’image dans une vue.
Etape 1 : Uploade et affichage d’une image d’un film
Upload de l’image
On commence par ajouter un attribut photo dans l’entité Film :

Ceci a pour conséquence d’ajouter une colonne photo dans la table film au prochain reload
du projet.
Ensuite on va ajouter dans le formulaire d’ajout d’un produit ajout.html :
L’attribut enctype dans la balise form :

Un input de type file pour uploader une fichier image :

Dans le contrôleur FilmController, on va définir le chemin du dossier dans lequel seront


uplodées les photos.

System.getProperty("user.dir") : retourne le chemin sur disque de la racine du


projet courant (chemin du répertoire du projet)
Le chemin des images est complété jusqu’à le dossier photos (à créer) sous static.
Toujours dans le contrôleur, on va modifier le code de l’action add comme suit :

L’action prend comme argument le paramètre file de type MultipartFile envoyé avec la
requête HTTP.

A. Ajroud 1 1MPSWM ISITCOM (22/23)


On récupère dans fileName le nom original de la photo.
On définit une variable de type Path fileNameAndPath à partir du chemin
uploadDirectory avec le nom de la photo.
Ensuite on génère physiquement la photo dans son emplacement en effectuant son écriture
à partir de son fichier binaire.
Enfin avant de créer le film f on définit la valeur de son attribut photo.
On doit importer les classes utilisées à partir des packages suivants :

Test l’upload d’une image d’un film.


Affichage de l’image d’un produit
On va ajouter pour chaque film un lien hypertexte Détails dont le clic doit afficher la photo, le
titre, la description, les acteurs de ce film. Voici le code pour afficher la photo :

Pour les films qui n’ont pas de photo, on peut afficher, en remplacement, une autre image
standard placé dans le dossier photos en faisant le test suivant :

Etape 3 : Effectuer les modifications nécessaires dans la vue et l’action de modification


d’un film en tenant (ou pas) compte de l’upload d’images

A. Ajroud 2 1MPSWM ISITCOM (22/23)

Vous aimerez peut-être aussi