.htaccess でWEBPの分岐が機能しない
解決したいこと
.htaccessで /assets/
フォルダに来たJPEG・PNGを /assets/avif/
のAVIFもしくは /assets/webp/
のWEBPにリダイレクトしてさせていてHTTPのAcceptヘッダーを元に分岐させています。avifへのリダイレクトはいけたのですが対応していないiPhone SE(第一世代,iOS15.8.2)のSafariだと対応していないのにも関わらずAVIFへリダイレクトされ画像が正常に表示できません。有識者の方教えてください。
発生している問題・エラー
画像が表示されず、直リンで見ても四角い何もない画像が出るだけ。
該当するソースコード
.htaccess
<IfModule mod_mime.c>
AddType image/webp .webp
AddType image/avif .avif
</IfModule>
<IfModule mod_rewrite.c>
RewriteEngine On
# /assets/ディレクトリ内のリクエストのみ処理
RewriteCond %{REQUEST_URI} ^/assets/ [NC]
# AVIFサポートのチェック
RewriteCond %{HTTP_ACCEPT} image/avif
# JPEG画像に対するリクエストをAVIFにリダイレクト
RewriteCond %{REQUEST_FILENAME} (.*)\.jpg$ [NC]
RewriteCond %{DOCUMENT_ROOT}/assets/avif/$1.avif -f
RewriteRule ^assets/(.*)\.jpg$ /assets/avif/$1.avif [L,T=image/avif]
# PNG画像に対するリクエストをAVIFにリダイレクト
RewriteCond %{REQUEST_FILENAME} (.*)\.png$ [NC]
RewriteCond %{DOCUMENT_ROOT}/assets/avif/$1.avif -f
RewriteRule ^assets/(.*)\.png$ /assets/avif/$1.avif [L,T=image/avif]
# WebPサポートのチェック
RewriteCond %{HTTP_ACCEPT} image/webp
# JPEG画像に対するリクエストをWebPにリダイレクト
RewriteCond %{REQUEST_FILENAME} (.*)\.jpg$ [NC]
RewriteCond %{DOCUMENT_ROOT}/assets/webp/$1.webp -f
RewriteRule ^assets/(.*)\.jpg$ /assets/webp/$1.webp [L,T=image/webp]
# PNG画像に対するリクエストをWebPにリダイレクト
RewriteCond %{REQUEST_FILENAME} (.*)\.png$ [NC]
RewriteCond %{DOCUMENT_ROOT}/assets/webp/$1.webp -f
RewriteRule ^assets/(.*)\.png$ /assets/webp/$1.webp [L,T=image/webp]
</IfModule>
<IfModule mod_headers.c>
Header append Vary Accept env=REDIRECT_accept
</IfModule>
自分で試したこと
端末のキャッシュクリアや画像の変更、ChatGPTなどに質問
0