iphone6sのchromeで画像が表示されない原因と対処方

iphone6sに入れたchromeから、このウェブサイトの画像が表示されない現象に気づきました。
他のウェブサイトでも同様の現象があり、原因と対処法が分かりましたので記録しておきます。

▼目次(クリック・タップできます)
  1. 現象が発生した環境
  2. 原因
  3. 対策方法



現象が発生した環境

確認したのはこの環境です。
iphone6s
iOS 9.2.1
ブラウザ Google Chrome

Safariではこの現象が出ません。
PCの Google Chromeでも出ません。
Androidスマホは未検証。

ウェブサイト側は、
サーバーがXserverで、
mod_pagespeed設定 が ON になっている。

原因

iOS版のChromeで、2016/03/17現在のバージョンでは、mod_pagespeed設定によって変換された画像表示にバグ(?)がある模様。

将来的には問題なくなると思われますが、iPhoneでChromeを使う方も増えてきていますので暫定対策を打ちました。

対策方法

該当ドメインの、.htaccess ファイルに次の一文を最下部に追加するだけです。

ModPagespeedDisableFilters convert_jpeg_to_webp

これで、jpegがwebpに変換されなくなりますので、iPhone版Chromeでもしっかり画像が表示される様になりました。