Cree una miniatura en Laravel usando la biblioteca de imágenes de intervención

Last updated Oct 17, 2021

Contenido

Empezando

Para comenzar, primero debe instalar la biblioteca de imágenes de intervención en Laravel. Abra la terminal en el directorio raíz de su proyecto y ejecute el siguiente comando:

composer require intervention/image

Después de instalar la biblioteca, abra el config/app.phparchivo y agregue las siguientes líneas.

Agregue los proveedores de servicios para este paquete en la $providersmatriz.

InterventionImageImageServiceProvider::class

Agregue la fachada a la $aliasesmatriz.

'Image' => InterventionImageFacadesImage::class

A continuación, para almacenar las imágenes necesitamos crear un directorio. Dirígete a la terminal y ejecuta el comando de la siguiente manera:

php artisan storage:link

Este comando crea un directorio de almacenamiento (enlace simbólico) en la carpeta pública. En esta carpeta, subiré la imagen original y sus miniaturas.

Crea una miniatura en Laravel

Todos configuramos la configuración básica y ahora podemos escribir el código real. Creemos un formulario en su archivo de vista.

<form action="{{ url('PASS_ACTION_URL') }}" method="post" enctype="multipart/form-data">
    <div class="form-group">
        <label for="exampleInputFile">File input</label>
        <input type="file" name="profile_image" id="exampleInputFile">
    </div>
    {{ csrf_field() }}
    <button type="submit" class="btn btn-default">Submit</button>
</form>

En el controlador, debe agregar la fachada de la biblioteca ‘Imagen’ que hemos agregado en el config/app.phparchivo.

<?php
  
namespace AppHttpControllers;
  
use IlluminateHttpRequest;
use Image;
  
class ImageController extends Controller
{
  
}

Al agregar la fachada, podemos llamar a funciones de la biblioteca de imágenes de intervención. En el siguiente código, subiré la imagen en dos lugares. La imagen original va directamente dentro de la storage/profile_imagescarpeta. Las miniaturas se almacenarían en el storage/profile_images/thumbnaildirectorio. Primero cargamos la imagen original en la carpeta de miniaturas y luego la cambiamos de tamaño.

public function store(Request $request)
{
    if($request->hasFile('profile_image')) {
        //get filename with extension
        $filenamewithextension = $request->file('profile_image')->getClientOriginalName();
  
        //get filename without extension
        $filename = pathinfo($filenamewithextension, PATHINFO_FILENAME);
  
        //get file extension
        $extension = $request->file('profile_image')->getClientOriginalExtension();
  
        //filename to store
        $filenametostore = $filename.'_'.time().'.'.$extension;
 
        //small thumbnail name
        $smallthumbnail = $filename.'_small_'.time().'.'.$extension;
 
        //medium thumbnail name
        $mediumthumbnail = $filename.'_medium_'.time().'.'.$extension;
 
        //large thumbnail name
        $largethumbnail = $filename.'_large_'.time().'.'.$extension;
 
        //Upload File
        $request->file('profile_image')->storeAs('public/profile_images', $filenametostore);
        $request->file('profile_image')->storeAs('public/profile_images/thumbnail', $smallthumbnail);
        $request->file('profile_image')->storeAs('public/profile_images/thumbnail', $mediumthumbnail);
        $request->file('profile_image')->storeAs('public/profile_images/thumbnail', $largethumbnail);
  
        //create small thumbnail
        $smallthumbnailpath = public_path('storage/profile_images/thumbnail/'.$smallthumbnail);
        $this->createThumbnail($smallthumbnailpath, 150, 93);
 
        //create medium thumbnail
        $mediumthumbnailpath = public_path('storage/profile_images/thumbnail/'.$mediumthumbnail);
        $this->createThumbnail($mediumthumbnailpath, 300, 185);
 
        //create large thumbnail
        $largethumbnailpath = public_path('storage/profile_images/thumbnail/'.$largethumbnail);
        $this->createThumbnail($largethumbnailpath, 550, 340);
  
        return redirect('image')->with('success', "Image uploaded successfully.");
    }
}

En el código anterior, almaceno la imagen con 3 formatos pequeño, mediano y grande. Después de almacenarlos, estamos llamando al método createThumbnaily pasando el ancho y alto requeridos al método. Definamos esta función a continuación. Esta función debería ir al mismo controlador.

/**
 * Create a thumbnail of specified size
 *
 * @param string $path path of thumbnail
 * @param int $width
 * @param int $height
 */
public function createThumbnail($path, $width, $height)
{
    $img = Image::make($path)->resize($width, $height, function ($constraint) {
        $constraint->aspectRatio();
    });
    $img->save($path);
}

Aquí estamos cambiando el tamaño de la imagen proporcionalmente. Al hacerlo, mantenemos la relación de aspecto y la imagen no se cortará.

Si está buscando un cultivo duro, reemplace las líneas siguientes

$img = Image::make($path)->resize($width, $height, function ($constraint) {
    $constraint->aspectRatio();
});
$img->save($path);

Con

$img = Image::make($path)->resize($width, $height)->save($path);

Espero que entiendas cómo crear una miniatura en Laravel usando la biblioteca de imágenes de intervención. Me gustaría escuchar sus pensamientos en la sección de comentarios a continuación.

Cree una miniatura en Laravel usando la biblioteca de imágenes de intervención

Empezando

Crea una miniatura en Laravel

Artículos relacionados