Unidad PHP | PHP-CS-Fixer | Cobertura | Descargas | Liberar |
---|---|---|---|---|
Este paquete proporciona un conjunto de herramientas de abstracción de manipulación de imágenes para proyectos basados en Symfony.
Conjuntos de filtros: utilizando cualquier lenguaje de configuración compatible con Symfony (como YML y XML), puede crear definiciones de conjuntos de filtros que especifiquen rutinas de transformación. Estas definiciones incluyen un conjunto de filtros y postprocesadores , así como otros parámetros opcionales.
Filtros: las transformaciones de imágenes se aplican mediante filtros . El paquete proporciona un conjunto de filtros integrados que implementan las transformaciones más comunes; los ejemplos incluyen miniatura, escala, recorte, voltear, quitar y marca de agua. Para transformaciones más avanzadas, puede crear fácilmente sus propios filtros personalizados.
Postprocesadores: la modificación del archivo de imagen binaria resultante (creado a partir de sus filtros ) es manejada por postprocesadores . Los ejemplos incluyen JPEG Optim, Moz JPEG, Opti PNG y PNG Quant. Al igual que los filtros, puedes crear fácilmente tus propios postprocesadores personalizados.
Suponga que definió un conjunto de filtros my_thumb
, que se puede configurar para realizar cualquier cantidad de transformaciones diferentes. La invocación más simple sería canalizar la ruta de su imagen al filtro imagine_filter
Twig proporcionado.
< img src = " {{ asset( ' /relative/path/to/image.jpg ' ) | imagine_filter( ' my_thumb ' ) }} " />
Este proyecto se publica con un Código de conducta para colaboradores. Al participar en este proyecto, usted acepta cumplir con sus términos.
Gracias a los numerosos contribuyentes que han dedicado su tiempo y código a este proyecto.
Este paquete utiliza la biblioteca PHP Imagine independiente para transformaciones de imágenes.
Este paquete se bifurcó de AvalancheImagineBundle con el objetivo de hacer que el código sea más extensible. Consulte AvalancheImagineBundle#25 para obtener información adicional sobre el razonamiento de esta bifurcación.
El uso de este paquete es similar a todos los paquetes de Symfony. Se deben realizar los siguientes pasos
Las instrucciones de configuración detalladas se pueden encontrar en el capítulo de instalación de la documentación.
Puede encontrar información detallada sobre todas las opciones de configuración disponibles en el capítulo de configuración de la documentación.
Generalmente, este paquete funciona aplicando conjuntos de filtros a imágenes desde dentro de una plantilla. Sus conjuntos de filtros se definen dentro del archivo de configuración de la aplicación (a menudo app/config/config.yml
) y se componen de una colección de filtros , postprocesadores y otros parámetros opcionales.
Aprenderemos más sobre los postprocesadores y otros parámetros disponibles más adelante, pero por ahora centrémonos en cómo definir un conjunto de filtros simple compuesto por unos pocos filtros .
Antes de comenzar, se necesita una pequeña cantidad de configuración para garantizar que nuestros cargadores de datos y solucionadores de caché funcionen correctamente. Utilice el siguiente texto estándar en su archivo de configuración.
# app/config/config.yml
liip_imagine :
# configure resolvers
resolvers :
# setup the default resolver
default :
# use the default web path
web_path : ~
# your filter sets are defined here
filter_sets :
# use the default cache configuration
cache : ~
Con la configuración básica implementada, comenzaremos con un ejemplo que cumple con un caso de uso común: crear miniaturas. Supongamos que queremos que a las miniaturas resultantes se les apliquen las siguientes transformaciones:
Agregando a nuestro texto estándar de arriba, necesitamos definir un conjunto de filtros (al que llamaremos my_thumb
) con dos filtros configurados: los filtros thumbnail
y background
.
# app/config/config.yml
liip_imagine :
resolvers :
default :
web_path : ~
filter_sets :
cache : ~
# the name of the "filter set"
my_thumb :
# adjust the image quality to 75%
quality : 75
# list of transformations to apply (the "filters")
filters :
# create a thumbnail: set size to 120x90 and use the "outbound" mode
# to crop the image when the size ratio of the input differs
thumbnail : { size : [120, 90], mode : outbound }
# create a 2px black border: center the thumbnail on a black background
# 4px larger to create a 2px border around the final image
background : { size : [124, 94], position : center, color : '#000000' }
Ahora ha creado un conjunto de filtros llamado my_thumb
que realiza una transformación de miniatura. El filtro thumbnail
ajusta el tamaño de la imagen al ancho y alto deseados (en este ejemplo, 120x90 px), y su opción mode: outbound
hace que la imagen resultante se recorte si la proporción de entrada difiere. El filtro background
da como resultado un borde negro de 2 píxeles al crear un lienzo negro de 124 x 94 píxeles de tamaño y colocar la miniatura en su centro.
Nota: Un conjunto de filtros puede tener cualquier número de filtros definidos. Es posible que las transformaciones simples solo requieran un único filtro , mientras que las transformaciones complejas pueden tener un número ilimitado de filtros definidos para ellas.
Hay varios filtros adicionales, pero por ahora puede usar el filtro my_thumb
recién definido configurado inmediatamente dentro de una plantilla.
Para una plantilla basada en Twig, utilice:
< img src = " {{ asset( ' /relative/path/to/image.jpg ' ) | imagine_filter( ' my_thumb ' ) }} " />
O, para una plantilla basada en PHP, utilice:
<img src=" <?php $ this ['imagine']->filter('/relative/path/to/image.jpg', 'my_thumb') ?> " />
Detrás de escena, el paquete aplica los filtros a la imagen sobre la marcha cuando se atiende la solicitud de la primera página. Luego, la imagen transformada se almacena en caché para solicitudes posteriores. La ruta final de la imagen almacenada en caché sería similar a /media/cache/my_thumb/relative/path/to/image.jpg
.
Nota: *Al utilizar el entorno dev
, es posible que las imágenes no se representen correctamente a través del asistente de plantilla. Esto suele deberse a que intercept_redirect
está habilitado en la configuración de su aplicación. Para garantizar que las imágenes se representen, se recomienda desactivar esta opción:
# app/config/config_dev.yml
web_profiler :
intercept_redirects : false
En algún momento, es posible que tengas definido un filtro que cumpla con el 99% de tus escenarios de uso. En lugar de definir un nuevo filtro para el 1% de los casos erróneos, puede optar por alterar el comportamiento de un filtro en tiempo de ejecución pasando al asistente de plantilla una matriz de opciones.
Para una plantilla basada en Twig, utilice:
{% set runtimeConfig = { " thumbnail " : { " size " : [ 50 , 50 ] }} %}
< img src = " {{ asset( ' /relative/path/to/image.jpg ' ) | imagine_filter( ' my_thumb ' , runtimeConfig ) }} " />
O, para una plantilla basada en PHP, utilice:
<?php
$ runtimeConfig = array (
" thumbnail " => array (
" size " => array ( 50 , 50 )
)
);
?>
<img src=" <?php $ this [ ' imagine ' ]-> filter ( ' /relative/path/to/image.jpg ' , ' my_thumb ' , $ runtimeConfig ) ?> " />
En algún momento necesitarás resolver la ruta de la imagen devuelta por este paquete para una imagen filtrada. Esto se puede lograr fácilmente utilizando el binario de la consola de Symfony o mediante programación desde un controlador u otro fragmento de código.
Puede resolver la URL de una imagen utilizando el comando de la consola liip:imagine:cache:resolve
. El único argumento requerido es una o más rutas de imagen relativas (que deben estar separadas por un espacio).
$ php bin/console liip:imagine:cache:resolve relative/path/to/image1.jpg relative/path/to/image2.jpg
Además, puede utilizar la opción --filter
para especificar qué filtro desea resolver (si se omite la opción --filter
, se resolverán todos los filtros disponibles).
$ php bin/console liip:imagine:cache:resolve relative/path/to/image1.jpg --filter=my_thumb
Puede resolver la URL de la imagen en su código utilizando el método getBrowserPath
del servicio liip_imagine.cache.manager
. Suponiendo que ya tiene el servicio asignado a una variable llamada $imagineCacheManager
, ejecutaría:
$ imagineCacheManager -> getBrowserPath ( ' /relative/path/to/image.jpg ' , ' my_thumb ' );
A menudo, es necesario realizar esta operación en un controlador. Suponiendo que su controlador hereda del controlador Symfony base, puede aprovechar el método get
heredado para solicitar el servicio liip_imagine.cache.manager
, desde el cual puede llamar getBrowserPath
en una ruta de imagen relativa para obtener su ubicación resuelta.
/** @var CacheManager */
$ imagineCacheManager = $ this -> get ( ' liip_imagine.cache.manager ' );
/** @var string */
$ resolvedPath = $ imagineCacheManager -> getBrowserPath ( ' /relative/path/to/image.jpg ' , ' my_thumb ' );
Este paquete proporciona un conjunto de filtros integrados y también puede definir fácilmente sus propios filtros. Consulte el capítulo de filtros de nuestra documentación.
Si necesita utilizar sus "conjuntos de filtros" definidos desde su controlador, puede recuperar FilterService de este paquete del contenedor de servicios para hacer el trabajo pesado por usted.
<?php
class MyController extends Controller
{
public function indexAction ()
{
/** @var FilterService */
$ imagine = $ this
-> container
-> get ( ' liip_imagine.service.filter ' );
// 1) Simple filter, OR
$ resourcePath = $ imagine -> getUrlOfFilteredImage ( ' uploads/foo.jpg ' , ' my_thumb ' );
// 2) Runtime configuration
$ runtimeConfig = [
' thumbnail ' => [
' size ' => [ 200 , 200 ]
],
];
$ resourcePath = $ imagine -> getUrlOfFilteredImageWithRuntimeFilters (
' uploads/foo.jpg ' ,
' my_thumb ' ,
$ runtimeConfig
);
// ..
}
}
?>
De forma predeterminada, el directorio web/
de Symfony está registrado como raíz de datos desde donde cargar recursos. Para muchas instalaciones esto será suficiente, pero en ocasiones puede que necesites cargar imágenes desde otras ubicaciones. Para hacer esto, debe establecer el parámetro data_root
en su configuración (a menudo ubicado en app/config/config.yml
).
liip_imagine :
loaders :
default :
filesystem :
data_root : /path/to/source/images/dir
A partir de la versión 1.7.2
, puede registrar varias rutas raíz de datos y el localizador de archivos buscará en cada una el archivo solicitado.
liip_imagine :
loaders :
default :
filesystem :
data_root :
- /path/foo
- /path/bar
A partir de la versión 1.7.3
solicita que las rutas de recursos públicos de todos los paquetes registrados se registren automáticamente como raíces de datos. Esto le permite cargar recursos desde las carpetas Resources/public
que residen dentro de los paquetes cargados. Para habilitar esta función, establezca la opción de configuración bundle_resources.enabled
en true
.
liip_imagine :
loaders :
default :
filesystem :
bundle_resources :
enabled : true
Si desea registrar algunas de las carpetas Resource/public
, pero no todas, puede hacerlo poniendo en la lista negra los paquetes que no desea registrar o en la lista blanca de los paquetes que sí desea registrar. Por ejemplo, para incluir en la lista negra (no registrar) los paquetes "FooBundle" y "BarBundle", utilizaría la siguiente configuración.
liip_imagine :
loaders :
default :
filesystem :
bundle_resources :
enabled : true
access_control_type : blacklist
access_control_list :
- FooBundle
- BarBundle
Alternativamente, si desea incluir en la lista blanca (solo registrar) los paquetes "FooBundle" y "BarBundle", deberá utilizar la siguiente configuración.
liip_imagine :
loaders :
default :
filesystem :
bundle_resources :
enabled : true
access_control_type : whitelist
access_control_list :
- FooBundle
- BarBundle
Las ubicaciones de las imágenes deben ser legibles para su servidor web. En un sistema que admita setfacl
(como Linux/BSD), utilice
HTTPDUSER= ` ps axo user,comm | grep -E ' [a]pache|[h]ttpd|[_]www|[w]ww-data|[n]ginx ' | grep -v root | head -1 | cut -d -f1 `
sudo setfacl -R -m u: " $HTTPDUSER " :rwX -m u: ` whoami ` :rwX /path/to/source/images/dir
sudo setfacl -dR -m u: " $HTTPDUSER " :rwX -m u: ` whoami ` :rwX /path/to/source/images/dir
Consulta la documentación de Permisos de Symfony para conocer los comandos compatibles con macOS y otros entornos.
Debe otorgar acceso de lectura a Apache agregando lo siguiente a su configuración de Apache VHost
< VirtualHost *:80>
<!-- Rest of directives like DocumentRoot or ServerName -->
Alias /FavouriteAlias /path/to/source/images/dir
< Directory " /path/to/source/images/dir " >
AllowOverride None
Allow from All
</ Directory >
</ VirtualHost >
Alternativamente, puede colocar la directiva en un archivo separado dentro de su proyecto e incluirla dentro de su configuración de Apache VHost. Por ejemplo, puede crear el archivo app/config/apache/photos.xml
y agregar lo siguiente a su archivo VHost
< VirtualHost *:80>
<!-- Rest of directives like DocumentRoot or ServerName -->
Include "/path/to/your/project/app/config/apache/photos.xml"
</ VirtualHost >
Este método mantiene el archivo con el resto de su código, lo que le permite cambiarlo fácilmente o crear diferentes archivos de configuración dependientes del entorno.
Una vez que haya configurado Apache correctamente, la ruta relativa a una imagen con la siguiente ruta absoluta /path/to/source/images/dir/logo.png
debe ser /FavouriteAlias/logo.png
.
Para obtener información más detallada sobre las características de este paquete, consulte la documentación.