文件Commerce設定指南

設定遠端儲存裝置的影像大小調整

Last update: Wed Aug 16 2023 00:00:00 GMT+0000 (Coordinated Universal Time)

建立對象：

  • Experienced
  • Admin
  • Developer

依預設，Adobe Commerce支援在應用程式端調整影像大小。 不過，透過啟用「遠端儲存」模組，您可以使用Nginx將影像大小調整解除安裝到伺服器端，藉此節省磁碟資源並最佳化磁碟使用量。

下圖顯示Nginx如何擷取、調整影像大小以及將其儲存在快取中。 調整大小是由URL中包含的引數（例如高度和寬度）所決定。

調整影像大小

TIP
如需雲端基礎結構專案的Adobe Commerce，請參閱 在雲端基礎結構上為Commerce設定遠端儲存

在Adobe Commerce中設定URL格式

若要在伺服器端調整影像大小，您必須設定Adobe Commerce以提供影像的高度、寬度和位置(URL)引數。

若要設定Commerce以調整伺服器端影像大小：

  1. 在 管理員 面板，按一下 Stores > Settings > Configuration > General > Web.

  2. 在右窗格中，展開 Url options.

  3. 在 目錄媒體URL格式 部分，清除 Use system value.

  4. 選取 Image optimization based on query parameters 中的URL 目錄媒體URL格式 欄位。

  5. 按一下 Save Config.

  6. 繼續前往 Nginx設定.

設定Nginx

若要繼續設定伺服器端影像調整大小，您必須準備 nginx.conf 檔案並提供 proxy_pass 您所選介面卡的值。

啟用Nginx調整影像大小：

  1. 安裝 Nginx影像濾鏡模組.

    code language-shell 
    load_module /etc/nginx/modules/ngx_http_image_filter_module.so;

  2. 建立 nginx.conf 根據包含範本的檔案 nginx.conf.sample 檔案。 例如：

    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. [可選] 設定 proxy_pass 您特定介面卡的值。

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