{"id":24851,"date":"2021-05-22T10:58:00","date_gmt":"2021-05-22T07:58:00","guid":{"rendered":"https:\/\/themewp.inform.click\/?p=24851"},"modified":"2021-10-18T03:11:29","modified_gmt":"2021-10-18T00:11:29","slug":"ridimensiona-l-immagine-in-laravel-usando-la-libreria-di-immagini-di-intervento","status":"publish","type":"post","link":"https:\/\/themewp.inform.click\/it\/ridimensiona-l-immagine-in-laravel-usando-la-libreria-di-immagini-di-intervento\/","title":{"rendered":"Ridimensiona l’immagine in Laravel usando la libreria di immagini di intervento"},"content":{"rendered":"

Recentemente uno dei nostri lettori ha chiesto come ridimensionare l’immagine in Laravel. Il ridimensionamento delle immagini \u00e8 un’attivit\u00e0 normale per gli sviluppatori. Gli sviluppatori dovrebbero farlo correttamente. \u00c8 una buona pratica ridimensionare le immagini in base alle dimensioni del contenitore. Ti aiuta a migliorare la velocit\u00e0 della pagina. In questo articolo, studiamo come ridimensionare l’immagine in Laravel usando la libreria Intervention Image.<\/p>\n

La<\/a> libreria di immagini di intervento<\/a> fornisce un modo semplice per ridimensionare le immagini. Questa libreria utilizza GD Library e Imagick per la manipolazione delle immagini sotto il cofano.<\/p>\n

Perch\u00e9 dovrebbe ridimensionare le immagini?<\/h3>\n

Prendiamo l’esempio di una galleria. Mentre lavoriamo su una galleria, normalmente mostriamo la piccola miniatura nell’elenco. Quando qualcuno fa clic sulla miniatura, mostriamo un’immagine originale. Qui, le miniature sono la versione ridimensionata dell’immagine originale.<\/p>\n

Supponiamo che la dimensione dell’immagine originale sia 500 500 e che il contenitore delle miniature sia di dimensioni 200 200. In questo caso, dovresti ridimensionare l’immagine originale in base alla dimensione del contenitore della miniatura. Usare un’immagine di grandi dimensioni nel contenitore piccolo \u00e8 una cattiva pratica. Influisce sulle prestazioni del sito web.<\/p>\n

Questo \u00e8 un esempio del perch\u00e9 dovremmo ridimensionare le immagini. Ce ne sono anche molti altri. Detto questo, diamo un’occhiata a come ridimensionare l’immagine in Laravel usando la libreria Intervention Image.<\/p>\n

Installazione<\/h3>\n

Per iniziare, devi installare la libreria Intervention Image nel tuo progetto Laravel. Dovresti avere Composer<\/a> installato sul tuo sistema. Apri il terminale nella directory principale del tuo progetto ed esegui il comando seguente:<\/p>\n

composer require intervention\/image<\/code><\/pre>\n
Dopo aver installato la libreria, apri il config\/app.php<\/code>file e aggiungi le seguenti righe al suo interno.<\/p>\n
Aggiungi il fornitore di servizi di questo pacchetto $providers<\/code>all’array.<\/p>\n
InterventionImageImageServiceProvider::class<\/code><\/pre>\n
Quindi aggiungi la facciata $aliases<\/code>all’array.<\/p>\n
'Image' => InterventionImageFacadesImage::class<\/code><\/pre>\n
Ridimensiona immagine in Laravel<\/h3>\n
Per ridimensionare l’immagine, dobbiamo prima scrivere il codice per caricare un’immagine. Quindi, prima crea una directory in cui memorizzeremo le immagini. Vai al terminale ed esegui il comando:<\/p>\n
php artisan storage:link<\/code><\/pre>\n
Questo comando crea una directory di "archiviazione" nella cartella "pubblica". Nella cartella "archiviazione", memorizzeremo una versione completa e una miniatura delle immagini.<\/p>\n
Quindi, crea un modulo nel file di visualizzazione. Sto anche aggiungendo il codice per il messaggio di successo nel file blade.<\/p>\n
@if (session('success'))\n\u00a0\u00a0\u00a0\u00a0<div class=\"alert alert-success\">\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0{{ session('success') }}\n\u00a0\u00a0\u00a0\u00a0<\/div>\n@endif\n<form action=\"{{ url('PASS_ACTION_URL') }}\" 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\">\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
Sostituisci il segnaposto "PASS_ACTION_URL" con il tuo percorso.<\/p>\n
Nel controller \u00e8 necessario aggiungere la facciata ‘Immagine’ di una libreria che abbiamo aggiunto nel config\/app.php<\/code>file.<\/p>\n
<?php\n\u00a0\nnamespace AppHttpControllers;\n\u00a0\nuse IlluminateHttpRequest;\nuse Image;\n\u00a0\nclass ImageController extends Controller\n{\n\u00a0\n}<\/code><\/pre>\n
Aggiungendo la facciata, siamo in grado di chiamare le funzioni della libreria Intervention Image. Nel codice sottostante, caricher\u00f2 l’immagine in due posti. Uno \u00e8 l’immagine originale nella cartella ‘profile_images’. Il secondo si trova nella directory ‘profile_images\/thumbnail’. Caricher\u00f2 prima l’immagine originale nella cartella delle miniature e poi la ridimensioner\u00f2.<\/p>\n
public function store(Request $request)\n{\n\u00a0\u00a0\u00a0\u00a0if($request->hasFile('profile_image')) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/get filename with extension\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$filenamewithextension = $request->file('profile_image')->getClientOriginalName();\n\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/get filename without extension\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$filename = pathinfo($filenamewithextension, PATHINFO_FILENAME);\n\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/get file extension\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$extension = $request->file('profile_image')->getClientOriginalExtension();\n\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/filename to store\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$filenametostore = $filename.'_'.time().'.'.$extension;\n\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/Upload File\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$request->file('profile_image')->storeAs('public\/profile_images', $filenametostore);\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$request->file('profile_image')->storeAs('public\/profile_images\/thumbnail', $filenametostore);\n\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/Resize image here\n\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$img = Image::make($thumbnailpath)->resize(400, 150, function($constraint) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$constraint->aspectRatio();\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0});\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$img->save($thumbnailpath);\n\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0return redirect('image')->with('success', \"Image uploaded successfully.\"); \/\/change the route as per your flow\n\u00a0\u00a0\u00a0\u00a0}\n}<\/code><\/pre>\n
Qui sto ridimensionando l’immagine in modo proporzionale. In questo modo, manterrai le proporzioni e l’immagine non verr\u00e0 tagliata. Ho superato la larghezza come 400 e l’altezza come 150. Puoi modificare questi valori secondo le tue esigenze.<\/p>\n
Se stai cercando un ritaglio duro, sostituisci le righe sottostanti<\/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
Con<\/p>\n
$img = Image::make($thumbnailpath)->resize(100, 100)->save($thumbnailpath);<\/code><\/pre>\n
Dopodich\u00e9, otterrai la miniatura con una dimensione di 100*100.<\/p>\n
Spero che tu possa imparare a ridimensionare l’immagine in Laravel usando la libreria di immagini di intervento. Per favore condividi i tuoi pensieri e suggerimenti nella sezione commenti qui sotto.<\/p>\n
articoli Correlati<\/h4>\n