Magento Open Source / Adobe Commerceの商品画像に関するアレコレ〜その2

前回はMagento Open Source / Adobe Commerceの商品画像周りのTipsをいくつか取り上げました。
今回はその続編として、

  • 商品画像の差し替え
  • リサイズ後画像の更新

について解説したいと思います。

「商品画像の差し替え」というオペレーション

商品画像が変更になったので、新しいファイルに差し替える

という作業自体は特段珍しくもなく、むしろ日常業務の一部であると言ってもよいでしょう。

商品点数があまり多くないサイトや、商品画像のファイル名について命名規則を決めていないサイトにとってはあまり問題にならない話かもしれません。
ところが多くの商品を抱えるサイトの場合では、より効率的に商品情報と商品画像を管理する必要があることから、商品画像のファイル名に明確な命名規則を定めるケースがほとんどです。

このような運用の場合、商品画像差し替え作業の多くは「同じファイル名での画像差し替え」という形になります。
一見単純に

  • 新しいファイルをアップロードしなおす
  • ファイルシステムに新しいファイルを配置する

という作業に見えますが、Magento Open Source / Adobe Commerceでは一筋縄で行かない作業になっているのです。

商品画像を差し替える場合の手順

商品画像を差し替える場合、次のような操作を行うことが多いのではないでしょうか。

  1. 該当の商品の管理画面を開く
  2. 「画像とビデオ」セクションを開く
  3. アップロード済みの画像リストから、差し替えたい画像を消す
  4. 新しい画像をアップロードする
  5. 商品情報を調整し、保存する

しかし、この手順は実は正しくありません。
この操作をすると、次の問題が発生します。

新しい商品画像が異なるファイル名でサーバー上にアップロードされてしまう

Magento Open Source / Adobe Commerceは1.xの時代から、「同じ名前のファイルがアップロードされると、自動的に枝番をファイル名に追加する」という仕様を持っています。
これは不具合ではなく、標準としての「仕様」です。

商品番号と商品画像のファイル名に厳格な命名規則を定めているサイトの場合、Magentoのこの仕様はトラブルの温床になります。
REST APIでファイルをアップロードする場合でもこの問題は変わらないため、問題は管理画面経由だけではないのです。

もし、管理画面やREST API経由で正しく商品画像を同じファイル名で差し替えたい場合は、以下のような手順を踏む必要があります。

  1. 該当の商品の管理画面を開く
  2. 「画像とビデオ」セクションを開く
  3. アップロード済みの画像リストから、差し替えたい画像を消す
  4. 商品情報を調整し、保存する
  5. 新しい画像をアップロードする
  6. 商品情報を調整し、保存する

1回商品情報を保存したあとで、新しい画像をアップロードするというところがポイントです。
こうすることで、古い画像は確実にディスク上から削除され、新しい画像が別名でアップロードされるということもありません。

画像差し替えに潜む罠

商品画像を差し替える場合、前述の手順で行う方法と、ファイルシステム上のファイルを直接更新する方法の2通りがあります。
正直なところ、正しく差し替えができるのであればどちらの方法を用いても良いと思います。

ただし、どちらのパターンを採用したとしても、以下の問題は残り続けます。

リサイズ後画像が新しいものに変わらない

Magentoが商品一覧や商品ページに表示させている画像は、前回も解説したとおり9種類のパラメータを用いてリサイズ処理を行ったものです。
アップロードされた画像そのものを使用するわけではありません。

リサイズ処理自体は商品画像のアップロード時もしくは画像URLの要求時に行われますが、既にリサイズ済みの画像が存在する場合には再リサイズは行われません。
そのため、

  • 同じファイル名でのファイル差し替え（一旦削除して再アップロード）
  • 単純にファイルの上書き

では再リサイズは起きません。
更新後のファイルで再リサイズを強制したい場合は、

  1. すでに存在するリサイズ後の画像をディスク上から探す
  2. 見つかった画像を物理的に削除する
  3. 改めてリサイズ処理を実行する

という手順が必要です。
この作業を行わない限り、せっかく商品画像を差し替えたとしても、商品一覧画面や商品詳細画面に表示される画像が新しいものに変わりません。

残念なことに、Magentoフレームワーク本体には前述の処理が用意されていません。
導入サイトごとに画像ファイルの命名規則などを踏まえた機能実装が必要になってきます。

ストレージの構成に注意しよう

特に注意しなければならないのは、NFSやAWSのEFSといったネットワークストレージを利用している場合です。
サーバーに直接ディスクが接続されている場合とは異なり、ディスク性能が大幅に劣るケースが良く見られます。
読み取り性能ではさほど差がない場合でも、書き込み性能が実は大きく劣るケースは珍しくなく、画像の再リサイズのような

  1. 画像を探す
  2. 画像を消す
  3. リサイズし直す

といった処理の場合にはディスク性能の低さから、処理がなかなか終わらないといった事象になることがあります。

また、AWS EFSの場合にはIOPSを予めリザーブしておかないと、バーストクレジットが枯渇してしまうトラブルに発展する可能性もあります。
商品画像の再リサイズ処理を組み込む前に今の設定がどうなっているか、念の為確認しておくと良いでしょう。

まだ続きます

まだここで終わりではありません。
次回は再リサイズ後の画像がうまく表示されない最後の原因について解説します。