Contact Info

  • aniuma OÜ Harju maakond, Tallinn, Lasnamäe linnaosa, Sepapaja tn 6, 15551

Cloudflare でページキャッシュを利用した時のデバイス判定(wp_is_mobile)

Cloudflare や Cloud Front といったCDNや、キャッシュ系プラグインを使ってHTMLキャッシュをおこなう時は、wp_is_mobile関数などのデバイス判定が効かなくなります。

Cloud Front であれば CloudFront 配下での User-Agent の判定 | Amimoto Help Center で記載されているとおり、Nginx Mobile Theme プラグイン を導入し User-Agent を判定することで対応できるようです。

https://support.amimoto-ami.com/en/articles/1361104-cloudfront-%E9%85%8D%E4%B8%8B%E3%81%A7%E3%81%AE-user-agent-%E3%81%AE%E5%88%A4%E5%AE%9A

Cloudflare でも上記のように対応することは可能かもれしれませんが Understand Cache by Device Type (Enterprise plans only) – Cloudflare Help Center に書かれているとおり、公式の機能でデバイスタイプを切り分けてキャッシュするにはエンタープライズプランにアップグレードしなければいけません。(費用は見積もり)

https://support.cloudflare.com/hc/en-us/articles/229373388-Understand-Cache-by-Device-Type-Enterprise-plans-only-

解決方法としては WordPressの wp_is_mobile 関数でモバイル判定 | work.log で記載されているように要素であればメディアクエリーを用いたCSSでの表示・非表示切り替え、JavaScript であれば Googleタグマネージャー を利用してスクリプトの読み込みトリガーを設定するとよいでしょう。

https://satori.marketing/marketing-blog/what-is-marketing/gtm-advanced-trigger/

その他にもいい方法があればコメントをいただけると嬉しいです。