{"id":24935,"date":"2021-05-27T12:37:00","date_gmt":"2021-05-27T09:37:00","guid":{"rendered":"https:\/\/themewp.inform.click\/?p=24935"},"modified":"2021-10-18T02:13:21","modified_gmt":"2021-10-17T23:13:21","slug":"telecharger-et-redimensionner-plusieurs-images-dans-laravel","status":"publish","type":"post","link":"https:\/\/themewp.inform.click\/fr\/telecharger-et-redimensionner-plusieurs-images-dans-laravel\/","title":{"rendered":"T\u00e9l\u00e9charger et redimensionner plusieurs images dans Laravel"},"content":{"rendered":"

En dehors de ce blog, je dirige une cha\u00eene YouTube<\/a> o\u00f9 je partage les didacticiels vid\u00e9o. R\u00e9cemment, l’un des abonn\u00e9s de la cha\u00eene YouTube a demand\u00e9 s’il fallait redimensionner plusieurs images dans Laravel. Ils veulent redimensionner plusieurs images en une seule fois. Dans cet article, nous \u00e9tudions comment t\u00e9l\u00e9charger et redimensionner plusieurs images dans Laravel.<\/p>\n

Intervention Image<\/a> est une biblioth\u00e8que open source qui nous permet de manipuler des images. Je vais utiliser cette biblioth\u00e8que pour redimensionner les images.<\/p>\n

\"T\u00e9l\u00e9charger<\/a><\/p>\n

Commencer<\/h3>\n

Pour atteindre notre objectif, vous devez installer et configurer la biblioth\u00e8que d’images d’intervention dans le projet Laravel. Ouvrez le terminal dans le r\u00e9pertoire racine de votre projet et ex\u00e9cutez la commande\u00a0:<\/p>\n

composer require intervention\/image<\/code><\/pre>\n
Une fois la librairie install\u00e9e, ouvrez le config\/app.php<\/code>fichier et ajoutez des prestataires, fa\u00e7ade dedans. Ajoutez les fournisseurs de services de ce package au $providers<\/code>tableau.<\/p>\n
InterventionImageImageServiceProvider::class,<\/code><\/pre>\n
Ajoutez la fa\u00e7ade au $aliases<\/code>tableau.<\/p>\n
'Image' => InterventionImageFacadesImage::class,<\/code><\/pre>\n
Ensuite, nous avons besoin d’un r\u00e9pertoire o\u00f9 nous stockons nos fichiers t\u00e9l\u00e9charg\u00e9s. Laravel Filesystem<\/a> fournit un disque public pour stocker les fichiers. Le disque public contient des fichiers accessibles au public. Vous trouverez les fichiers t\u00e9l\u00e9charg\u00e9s dans le storage\/app\/public<\/code>dossier. Pour acc\u00e9der \u00e0 ces fichiers sur le Web, vous devez cr\u00e9er un lien symbolique de public\/storage<\/code>\u00e0 storage\/app\/public<\/code>.<\/p>\n
Cr\u00e9ez un lien symbolique \u00e0 l’aide de la commande\u00a0:<\/p>\n
php artisan storage:link<\/code><\/pre>\n
Cette commande cr\u00e9erait un dossier de stockage sous le r\u00e9pertoire public. C’est l\u00e0 que nous stockons nos fichiers.<\/p>\n
T\u00e9l\u00e9charger et redimensionner des images dans Laravel<\/h3>\n
Pour t\u00e9l\u00e9charger des fichiers sur un serveur, vous avez besoin d’un formulaire. Cr\u00e9ons un formulaire o\u00f9 vous pouvez s\u00e9lectionner plusieurs fichiers \u00e0 t\u00e9l\u00e9charger sur un serveur. Vous trouverez ci-dessous un exemple de code du formulaire qui ira \u00e0 l’int\u00e9rieur de votre fichier de vue.<\/p>\n
<form action=\"{{ url('ROUTE HERE') }}\" method=\"post\" enctype=\"multipart\/form-data\">\n\u00a0\u00a0\u00a0\u00a0<div class=\"form-group\">\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<label for=\"exampleInputFile\">File input<\/label>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<input type=\"file\" name=\"profile_image[]\" id=\"exampleInputFile\" multiple \/>\n\u00a0\u00a0\u00a0\u00a0<\/div>\n\u00a0\u00a0\u00a0\u00a0{{ csrf_field() }}\n\u00a0\u00a0\u00a0\u00a0<button type=\"submit\" class=\"btn btn-default\">Submit<\/button>\n<\/form><\/code><\/pre>\n
Dans le formulaire, j’ai pris un nom d’entr\u00e9e de fichier comme ‘profile_image[]’ qui envoie un tableau de fichiers au serveur. Aussi, j’ai ajout\u00e9 un attribut ‘multiple’ qui nous permet de s\u00e9lectionner plusieurs fichiers. Remplacez l’espace r\u00e9serv\u00e9 ROUTE_URL par votre valeur r\u00e9elle.<\/p>\n
Comme nous devons t\u00e9l\u00e9charger et redimensionner les images, dans le contr\u00f4leur, ajoutez deux fa\u00e7ades comme suit.<\/p>\n
<?php\n\u00a0\nnamespace AppHttpControllers;\n\u00a0\nuse IlluminateHttpRequest;\nuse Image; \/\/Intervention Image\nuse IlluminateSupportFacadesStorage; \/\/Laravel Filesystem\n\u00a0\nclass ImageController extends Controller\n{\n\u00a0\n}<\/code><\/pre>\n
En ajoutant la fa\u00e7ade, vous pouvez appeler les fonctions de redimensionnement de la biblioth\u00e8que d’images d’intervention. Dans le code ci-dessous, je vais t\u00e9l\u00e9charger les fichiers \u00e0 deux endroits. L’un est l’image originale. Le second se trouve sous le r\u00e9pertoire des vignettes. Nous t\u00e9l\u00e9chargeons d’abord l’image originale dans le dossier des vignettes, puis la redimensionnons.<\/p>\n
public function store(Request $request)\n{\n\u00a0\u00a0\u00a0\u00a0if ($request->hasFile('profile_image')) {\n\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0foreach($request->file('profile_image') as $file){\n\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/get filename with extension\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$filenamewithextension = $file->getClientOriginalName();\n\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/get filename without extension\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$filename = pathinfo($filenamewithextension, PATHINFO_FILENAME);\n\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/get file extension\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$extension = $file->getClientOriginalExtension();\n\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/filename to store\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$filenametostore = $filename.'_'.uniqid().'.'.$extension;\n\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0Storage::put('public\/profile_images\/'. $filenametostore, fopen($file, 'r+'));\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0Storage::put('public\/profile_images\/thumbnail\/'. $filenametostore, fopen($file, 'r+'));\n\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/Resize image here\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$thumbnailpath = public_path('storage\/profile_images\/thumbnail\/'.$filenametostore);\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$img = Image::make($thumbnailpath)->resize(400, 150, function($constraint) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$constraint->aspectRatio();\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0});\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$img->save($thumbnailpath);\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}\n\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0return redirect('ROUTE_URL')->with('success', \"Image uploaded successfully.\");\n\u00a0\u00a0\u00a0\u00a0}\n}<\/code><\/pre>\n
Ici, nous redimensionnons l’image proportionnellement. Ce faisant, nous gardons le rapport hauteur\/largeur et l’image ne sera pas coup\u00e9e. Je passe la largeur \u00e0 400 et la hauteur \u00e0 150. Vous pouvez modifier ces valeurs selon vos besoins.<\/p>\n
Allez-y et testez-le. Vous obtiendrez la version redimensionn\u00e9e des images t\u00e9l\u00e9charg\u00e9es dans le r\u00e9pertoire ‘storage\/profile_images\/thumbnail’.<\/p>\n
Si vous recherchez un recadrage difficile, remplacez les lignes ci-dessous<\/p>\n
$img = Image::make($thumbnailpath)->resize(400, 150, function($constraint) {\n\u00a0\u00a0\u00a0\u00a0$constraint->aspectRatio();\n});\n$img->save($thumbnailpath);<\/code><\/pre>\n
Avec<\/p>\n
$img = Image::make($thumbnailpath)->resize(100, 100)->save($thumbnailpath);<\/code><\/pre>\n
J’esp\u00e8re que vous comprenez comment t\u00e9l\u00e9charger et redimensionner plusieurs images dans Laravel. S’il vous pla\u00eet partager vos pens\u00e9es et suggestions dans la section commentaires ci-dessous.<\/p>\n
Articles Li\u00e9s<\/h4>\n