Konfigurera storleksändring av bilder för fjärrlagring

Som standard har Adobe Commerce stöd för storleksändring av bilder på programsidan. Genom att aktivera modulen Fjärrlagring kan du emellertid använda Nginx för att avlasta en bild som ändrar storlek till serversidan, där du kan spara diskresurser och optimera diskanvändningen.

I följande diagram visas hur Nginx hämtar, ändrar storlek på och lagrar bilder i cachen. Storleksändringen bestäms av de parametrar som finns i URL-adressen, till exempel höjd och bredd.

ändra storlek på bild

TIP
Information om Adobe Commerce i molninfrastrukturprojekt finns i Konfigurera fjärrlagring för Commerce i molninfrastrukturen

Konfigurera URL-format i Adobe Commerce

Om du vill ändra storlek på bilder på serversidan måste du konfigurera Adobe Commerce så att det innehåller argument för bildens höjd, bredd och plats (URL).

Så här konfigurerar du Commerce för storleksändring av serversidesbild:

  1. Klicka på Stores > Settings > Configuration > General > Web på panelen Admin.

  2. Expandera Url options i den högra rutan.

  3. I avsnittet URL-format för katalogmedia rensar du Use system value.

  4. Markera URL:en Image optimization based on query parameters i fältet URL-format för katalogmedia.

  5. Klicka på Save Config.

  6. Fortsätt till Nginx-konfigurationen.

Konfigurera Nginx

Om du vill fortsätta att konfigurera storleksändring av bilder på serversidan måste du förbereda filen nginx.conf och ange ett proxy_pass-värde för det valda kortet.

Så här aktiverar du Nginx för att ändra storlek på bilder:

  1. Installera Nginx-bildfiltermodulen.

    code language-shell
    load_module /etc/nginx/modules/ngx_http_image_filter_module.so;
    
  2. Skapa en nginx.conf-fil baserat på den inkluderade mallfilen nginx.conf.sample. Exempel:

    code language-conf
    location ~* \.(jpg|jpeg|png|gif|webp)$ {
        set $width "-";
        set $height "-";
        if ($arg_width != '') {
            set $width $arg_width;
        }
        if ($arg_height != '') {
            set $height $arg_height;
        }
        image_filter resize $width $height;
        image_filter_jpeg_quality 90;
    }
    
  3. [Valfritt] Konfigurera ett proxy_pass-värde för ditt specifika kort.

recommendation-more-help
386822bd-e32c-40a8-81c2-ed90ad1e198c