Googleのモバイルフレンドリーテストのデバイス判定が適切にされないとき

Googleのモバイルフレンドリーテストの際に、mobile用のViewが適切に読み込まれていないことに気付きました。これはページランクに影響が出る可能性大なので早急に解決すべき問題。

k0kubunさんのrack-user_agentを使って、RailsのAction Pack Variantsを用いてViewリソースの出し分けを行っている状態で、この問題が起きました。

検索してもあんまりヒットしなかったので記事にしたら助かる人がいるかなと思ったので記事にしてみます。

検索してみると、以下の記事で同じ現象が。

www.suzukikenichi.com

ということで、User Agentの判定ミスかなと思い設定を見てみましたが、GoogleのロボットのUser Agentが分からない(そして変わる可能性もあるとGoogleが公式ページで言及していた。と思う。)ので、そちらからこれ以上できることはなさそうだなと思いました。

すべての Googlebot ユーザー エージェントは、自身を特定の携帯端末と見なすため、そうした携帯端末の場合とまったく同様に扱う必要があります。たとえば、スマートフォン用 Googlebot が自身を iPhone と見なしている場合は、iPhone ユーザーに対するのと同じレスポンス(リダイレクト、最適化されたコンテンツなど)を返す必要があります。 https://developers.google.com/webmasters/mobile-sites/mobile-seo/dynamic-serving?hl=ja

GoogleクローラのUser Agentなどの情報。

Google クローラ - Search Console ヘルプ

うーん、どうしようかなぁと考えていたら以下のページにたどり着く。

動的な配信  |  Mobile Friendly Websites  |  Google Developers

ということで、Googleの提示するVary HTTP ヘッダーを用いて対応してみます。

以下の記事が参考になったので、Vary HTTPヘッダーて何?て方は読んでみとくのがいいと思います。

web-tan.forum.impressrd.jp

ということでnginxでgzipのvary http headerの設定をonにします。

Set Vary: Accept-Encoding Header (nginx) - Stack Overflow

nginxでのvaryヘッダーに関しては以下も参考に。

qiita.com

これでgoogleの推奨する設定になったかと思います。

余談

gzip圧縮できてるかどうか確認する方法。

qiita.com

関連

totutotu.hatenablog.com