Introducting the Fastly to TravelBook

トラベルブックの Fastly導入事例トラベルブック株式会社岩倉誠徳 (Masanori Iwakura)

アジェンダ - 自己紹介 - はじめに - 導入した経緯 - トラベルブックの構成紹介 -
設定例紹介 - 失効済みコンテンツの配信 - Brotliの設定 - HTTP/3(QUIC )の設定 - まとめ

自己紹介岩倉誠徳 (いわくらまさのり) バックエンドメインのWEBエンジニア GitHub: MasanoriIwakura 好きなFastlyの機能：失効済みコンテンツの配信 ※後述

はじめに 2021年11月、トラベルブックはFastlyを導入しました👏👏👏 Brotli, HTTP/3(QUIC)と言った比較的新しい技術も導入したので最後までお付き合いいただけますと幸いです

導入した経緯 • 元々はVarnishをEC2に入れてキャッシュ管理 • 日に日にキャッシュ対象のパスやページが増加 • Varnishサーバーが単一障害点となるリスク冗長化したい！！！スケールを自動化したい！！！

構成紹介

管理方法構成管理：Terraform • AWSの構成管理でも使用している • サービスをソース管理したいサービス管理：VCL • Varnishで使用した実績がある •
Varnishからの移行が比較的容易そう

管理方法死活・ログ監視：Datadog • 既存のシステムでも使用している • ログの表示がとても優秀

設定例紹介

Terraformを使用した管理プロジェクト構成 • modules ◦ VCLの管理 ◦ ログフォーマット管理 ◦ (Compute@Edgeの導入も検討)
• production • staging

Terraformを使用した管理参考: https://registry.terraform.io/providers/fastly/fastly/latest/docs • Fastlyの設定画面で行えることは、ほぼ可能 • 管理画面で存在するのにTerraformから行えない設定には遭遇していない

Datadogへのログ送信 TerraformでDatadogへの送信設定を追加 Fastlyの変数を埋め込み可能

Datadogへのログ送信 Fastlyからログを送信することにより、リアルタイムに状況を可視化例として、 - 200系レスポンスの割合 - エラーレスポンスの割合 - キャッシュのヒット率 -
アクセスしているブラウザ OSの割合などをダッシュボードで確認が可能

Datadogへのログ送信フィルター機能で任意のIPで絞り込んだり、任意のパスで絞り込んだりすることが可能リアルタイムにログを確認することができるため障害発生時や攻撃を受けている時の調査に有効的

Staleについて Staleなし Staleあり TTL+Staleの期間内は常にキャッシュが返却される

Staleの設定で苦戦したポイント [苦戦ポイント] Staleの期間内なのにキャッシュがHITしない？ [原因] 1. TTLの時間が3700秒未満に設定されていた 2. オリジンシールドのStaleを無効化し、POPだけでStaleを有効化していたメモリ持ちになってしまうため LRUが
発生しやすい

改善前の設定アクセスするPOPによってキャッシュのHIT/MISSが変わる

改善後の設定オリジンシールドのStaleが適用される

Purgeについて • All Purge →サービス全体のキャッシュ削除 • URL Purge →指定したURLだけキャッシュ削除 •
Surrogate-Key Purge →独自で指定したキーでキャッシュ削除

Purgeについて hotelのキーを指定→ホテルに関するページ全てのキャッシュを削除 hotel-item-1を指定→特定のページのみ削除

カスタムエラーページについて参考：https://docs.fastly.com/ja/guides/creating-error-pages-with-custom-responses

カスタムエラーページの実現方法 AWSのS3に配置したHTMLを参照するように設定 Fastly側でHTMLを管理する必要なく、最小限の修正でカスタムエラーページを実現

失効済みコンテンツの配信

失効済みコンテンツの配信参考：https://docs.fastly.com/ja/guides/serving-stale-content

失効済みコンテンツの配信次のアクセス時にはキャッシュが適用

失効済みコンテンツの配信ユーザーにはエラーを認識させない！！

Brotliの設定

Brotli(ブロトリ)とは • Googleが開発した圧縮方式 • 他の圧縮形式と比べて高い圧縮率 • Edge, Firefox, Chrome, Safariなど主要ブラウザで対応している

Brotliの実験実際にどれくらい圧縮されるのか、トラベルブックのトップページで実験

Brotliの実験 ※curlコマンドで検証圧縮なし Gzip圧縮 Brotri圧縮

Brotliの実験結果約130KB 約19KB (86%圧縮) 約13KB (90%圧縮) 参考：https://tech.travelbook.co.jp/posts/introducing-fastly/ ページによって結果が異なる場合があるため、あくまでも参考 Brotliの勝利！！

Brotli設定手順 1. FastlyサポートにBrotliを有効化していただく 2. VCLでBrotli圧縮を有効化対応ブラウザ以外では他の圧縮形式にしたいため、Accept-Encodingで判定して未対応の場合はgzip圧縮

HTTP/3の設定

HTTP/3(QUIC)とは？ • HTTP/2に続く新バージョン • Googleが開発したQUICを使用することで高速化(UDP通信)

HTTP/2(TCP+TLS)とHTTP/3(QUIC)の対比やり取りが少ない！

HTTP/3の設定方法 1. FastlyサポートにHTTP/3(QUIC)を有効化していただく 2. Alt-SvcヘッダーをVCLで追加 → h3.alt_svc() 3. HTTP/3用のDNSに切り替え 0RTT
enabled? IPv4 and IPv6 dual stack routing IPv4-only routing Yes dualstack.n.sni.global.fastly.net n.sni.global.fastly.net No dualstack.m.sni.global.fastly.net m.sni.global.fastly.net

HTTP/3の設定確認対応ブラウザからアクセスし、確認 h3(HTTP/3)になっている

まとめ

まとめ • Fastlyを導入することでVarnish冗長化問題を解決できた • 失効済みコンテンツの配信が素晴らしい • Datadogと連携したログ監視が素晴らしい • BrotliやHTTP/3(QUIC)に触れる機会を作れた •
Fastlyのサポートが神

ご静聴ありがとうございました！

Introducting the Fastly to TravelBook

Introducting the Fastly to TravelBook

More Decks by Masanori Iwakura

Other Decks in Technology

Featured

Transcript