@kotyのブログ

.NETとかJavaとかPythonとか勉強会のこととかを、田舎者SEがつづります。記事のライセンスは"CC BY"でお願いします。

SPAのOpen Graph Protocol 対応について。さらにCloudFrontを経由した場合についてのつらい話。

もう半年以上前になってしまうけど、この話題。

サーバーサイドレンダリング不要論 - Qiita

ogp出すためにUAを見てアプリケーションサーバーに投げたりしてるけどcloudfrontでは既定でUAが書き換えられちゃうのでキャッシュヒット率落ちるのを覚悟の上でUAを通すという辛い状況。

2016/12/24 17:32
b.hatena.ne.jp

client → cloudfront → ELB → EC2(nginx → gunicorn )

という構成。

  • nginxのリバースプロキシにて /api はgunicornにルーティング
  • それ以外は try_filesで /index.html を返すという設定

基本的にはこれで動くのだけど、OGPの生成にはJavaScriptが動く必要があるが、twittterやFBのクローラーJavaScriptを解釈しない。なので、nginxでUser-Agentを見てSNSクローラーだった場合はgunicornに処理を委譲しOGPのみを描画したドキュメントを返すようにした。

if ($http_user_agent ~ "facebookexternalhit") {
    ・・・
    proxy_pass http://127.0.0.1:8000;
    ・・・

ところが、User-AgentはCloudFrontの既定の設定だと"Amazon CloudFront"に書き換えられてしまい、上記の判定ができない。仕方ないので、以下のようにCloudFrontでUser-Agentヘッダを通すよう設定した。*1 f:id:kkotyy:20170801171259p:plain これで判定は通るようになる。しかしUser-Agentを通したことでキャッシュヒット率は落ちる。うむー。SNSクローラーJavaScriptを動かすようになるか、CloudFrontが CloudFront-Is-Crawler-Viewer といったヘッダを用意してくれるとありがたいんだけど。

*1:ちなみに画像にあるようにCloudFront-Is-*ヘッダも使ってみたのだけど、今回の要件には使えなかった