liip imagine filter on images stored in private file

191 Views Asked by At

In my Symfony 6.2 i upload images to non public directory in my symfony /var/card-upload. In twig i display this image with

<img class="img-fluid img-thumbnail" src="{{ path('serve_private_image', {'id': card.id}) }}" alt="">

and for server image I have controller

<?php

namespace App\Controller;

use App\Entity\Card;
use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
use Symfony\Component\HttpFoundation\BinaryFileResponse;
use Symfony\Component\Routing\Annotation\Route;

class ServePrivateImageController extends AbstractController
{
    /**
     * Returns a private image for card file for display.
     *
     * @Route("/serve-private-image/{id}", name="serve_private_image", methods="GET")
     * @param Card $card
     * @return BinaryFileResponse
     */
    #[Route(path: '/serve-private-image/{id}', name: 'serve_private_image')]
    public function privateImageServe(Card $card): BinaryFileResponse
    {
        return $this->fileServe($card->getImage());
    }
    /**
     * Returns a private file for display.
     *
     * @param string $path
     * @return BinaryFileResponse
     */
    private function fileServe(string $path): BinaryFileResponse
    {
        $absolutePath = $this->getParameter('card_directory') . '/' . $path;

        return new BinaryFileResponse($absolutePath);
    }
}

now I install liip image bundle for resize images for display

<img class="img-fluid img-thumbnail" src="{{ path('serve_private_image', {'id': card.id}) | imagine_filter('my_thumb') }}" alt="">

but this dont dispaly image

liip imagine config is

# Documentation on how to configure the bundle can be found at: https://symfony.com/doc/current/bundles/LiipImagineBundle/basic-usage.html
liip_imagine:
    # valid drivers options include "gd" or "gmagick" or "imagick"
    driver: "gd"

    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' }
0

There are 0 best solutions below