Liip Imagine Bundle behind a reverse proxy. How to fix the redirects to https

TL;DR;

The problem

When you use the Liip Imagine Bundle behind a reverse proxy (e.g., Traefik), the generated URLs for the final cached images are not correct. The generated URLs redirect to HTTP instead of HTTPS

It may cause a few issues:

The browser may block the image because of mixed content
The image may not be displayed because the browser does not follow the redirect
Google Search may not index the image because of the redirect

The solution

The solution is to use the imagine_filter_cache instead of imagine_filter.

What is the difference?

imagine_filter generates the URL to the image with the filter applied
imagine_filter_cache generates the URL to the final cached image.

Important: In case of using imagine_filter_cache you need to warm the cache.

Step 1: Warm the cache

php bin/console liip:imagine:cache:resolve path1

path1 - the path to the image from public directory

With Commands: https://symfony.com/bundles/LiipImagineBundle/current/commands.html

With a queue: https://symfony.com/bundles/LiipImagineBundle/current/optimizations/resolve-cache-images-in-background.html

Step 2: Change the template

Use

imagine_filter_cache

instead of

imagine_filter

Example

    <img src="{{ vich_uploader_asset(app, 'logo') | imagine_filter_cache('preview_app_logo_filter') }}" alt="{{ app.name }}">

That`s it. Now the generated URLs will be correct.