Glide Symfony Laravel Package

Getting Started

Minimal Steps

1. Installation

   composer require league/glide-symfony league/glide
   

   Ensure your composer.json includes Symfony 5.4+ and PHP 8.0+ constraints.

2. Enable the Bundle Add to config/bundles.php:

   return [
       // ...
       League\Glide\Symfony\GlideBundle::class => ['all' => true],
   ];
   

3. Basic Configuration Create config/packages/glide.yaml:

   glide:
       source: '%kernel.project_dir%/public/uploads' # Local path or S3 bucket
       cache: '%kernel.cache_dir%/glide'           # Cache directory
       drivers:
           local:
               adapter: 'local'
               directory: '%kernel.project_dir%/public/uploads'
       http_driver: 'local' # or 's3', 'rackspace', etc.
   

4. Route the Endpoint Add to config/routes.yaml:

   glide:
       resource: "@GlideSymfonyBundle/Resources/config/routing.yaml"
       prefix: /glide
   

5. First Use Case: Dynamic Thumbnails Generate a URL in a controller:

   use League\Glide\Symfony\Glide;
   
   public function showProduct(Glide $glide, string $productId): Response
   {
       $imagePath = "products/{$productId}/image.jpg";
       $url = $glide->url($imagePath, [
           'width' => 300,
           'height' => 300,
           'fit' => 'crop',
           'format' => 'webp'
       ]);
       return $this->render('product/show.html.twig', ['imageUrl' => $url]);
   }
   

   Use in Twig:

   <img src="{{ imageUrl }}" alt="Product">
   

Implementation Patterns

Core Workflows

1. Image Processing Pipeline

• Upload → Process → Serve:
  1. User uploads image via VichUploaderBundle or manual upload.
  2. Store raw image in configured storage (e.g., S3).
  3. Generate Glide URLs dynamically in templates/controllers.
  4. Glide serves optimized images on-demand or via cache.

Example with VichUploaderBundle:

// Controller
public function upload(UploadHandler $handler): Response
{
    $handler->setUploadRoot($this->getParameter('kernel.project_dir').'/public/uploads');
    // ...
}

// Twig
<img src="{{ path(handler.result.imageUrl, {
    'width': 200,
    'height': 200,
    'fit': 'crop'
}) }}">

2. Responsive Images

Use Twig extensions or controller logic to generate multiple variants:

{# srcset for responsive images #}
<img src="{{ imageUrl|glide({width: 800}) }}"
     srcset="{{ imageUrl|glide({width: 400}) }} 400w,
              {{ imageUrl|glide({width: 800}) }} 800w"
     sizes="(max-width: 600px) 400px, 800px">

3. Cloud Storage Integration

Configure S3 in glide.yaml:

glide:
    drivers:
        s3:
            adapter: 'aws'
            key: '%env(AWS_ACCESS_KEY_ID)%'
            secret: '%env(AWS_SECRET_ACCESS_KEY)%'
            bucket: 'my-app-images'
            region: 'us-east-1'
    http_driver: 's3'

4. Caching Strategies

• Symfony Cache Integration:

  glide:
      cache: '%kernel.cache_dir%/glide'
  

  Clear cache via:

  php bin/console cache:clear
  

• HTTP Caching: Add headers in middleware:

  $response->setPublic();
  $response->setMaxAge(3600); // Cache for 1 hour
  

Integration Tips

Symfony Ecosystem

• Twig Integration: Create a custom Twig extension for reusable filters:

  // src/Twig/GlideExtension.php
  class GlideExtension extends \Twig\Extension\AbstractExtension
  {
      public function getFunctions()
      {
          return [
              new \Twig\TwigFunction('glide_url', [$this->glide, 'url']),
          ];
      }
  }
  

  Register in services.yaml:

  services:
      App\Twig\GlideExtension:
          tags: ['twig.extension']
  

• ApiPlatform: Use Glide URLs in serializers:

  use League\Glide\Symfony\Glide;
  
  class ProductOutput
  {
      public function __construct(private Glide $glide) {}
  
      public function __invoke(Product $product, Operation $operation, array $context): array
      {
          return [
              'image' => $this->glide->url($product->getImagePath(), ['width' => 200]),
          ];
      }
  }
  

• Doctrine ORM: Store Glide URLs in DB for reuse:

  // Entity
  class Product
  {
      #[ORM\Column(type: 'string', nullable: true)]
      private ?string $glideThumbnailUrl;
  
      public function setGlideThumbnailUrl(Glide $glide): self
      {
          $this->glideThumbnailUrl = $glide->url($this->imagePath, ['width' => 150]);
          return $this;
      }
  }
  

Performance Optimization

• Lazy Loading: Use loading="lazy" in Twig:

  <img src="{{ imageUrl }}" loading="lazy" alt="...">
  

• Pre-Signed URLs (S3): Generate time-limited URLs for private images:

  $url = $glide->url($imagePath, [
      'width' => 300,
      'preset' => 'private',
      'expires' => time() + 3600 // 1 hour
  ]);
  

Security

• Endpoint Protection: Secure /glide with middleware:

  // src/EventListener/GlideSecurityListener.php
  class GlideSecurityListener
  {
      public function onKernelRequest(RequestEvent $event): void
      {
          $request = $event->getRequest();
          if ($request->getPathInfo() === '/glide') {
              if (!$request->isXmlHttpRequest() && !$request->headers->has('X-API-Key')) {
                  $event->setResponse(new Response('Forbidden', 403));
              }
          }
      }
  }
  

  Register in services.yaml:

  services:
      App\EventListener\GlideSecurityListener:
          tags: ['kernel.event_listener', { event: 'kernel.request', method: 'onKernelRequest' }]
  

Gotchas and Tips

Pitfalls

1. Storage Paths:

   • Issue: Incorrect source path in glide.yaml causes 404 errors.
   • Fix: Use absolute paths (e.g., %kernel.project_dir%/public/uploads) and verify permissions (chmod -R 755).

2. Cache Invalidation:

   • Issue: Glide cache isn’t cleared after image updates.
   • Fix: Manually clear cache or use Symfony’s cache system:

     php bin/console cache:pool:clear glide
     

3. S3 Permissions:

   • Issue: Glide fails silently with S3 errors.
   • Fix: Enable debug mode in glide.yaml:

     glide:
         debug: true
     

     Check Symfony logs for AWS Error.

4. Memory Limits:

   • Issue: Large images exceed PHP’s memory_limit.
   • Fix: Increase limit in php.ini or optimize Glide filters (e.g., avoid redundant resizing).

5. URL Generation:

   • Issue: glide->url() returns malformed URLs.
   • Fix: Ensure http_driver matches your storage backend (e.g., s3 for AWS).

6. Symfony Cache Conflicts:

   • Issue: Glide cache conflicts with Symfony’s cache.
   • Fix: Use separate cache directories or disable Symfony cache for Glide:

     glide:
         cache: '%kernel.cache_dir%/glide'
     framework:
         cache:
             pools:
                 glide: ~ # Disable Symfony cache for Glide
     

Debugging Tips

1. Enable Debug Mode:

   glide:
       debug: true
   

   Logs detailed