5. 公開する

5 of 7

このページは、Fastly の CDN の説明の一部であり、Fastly の CDN の使用方法および Web サイトの例とドメイン名を示して段階的に説明するチュートリアルです。このチュートリアルでは、静的サイト生成ツールの Jekyll、Amazon AWS、Fastly CDN を使用して静的 Web サイトをキャッシュ・配信する手順をご紹介します。詳細については、紹介をご覧ください。

Taco LabsのWeb Web サイトにFastlyサービスを準備ために多くの作業をしました!これで、最終的な作業を行い、公開して、本番 Web サイトに Fastly を使い始めることができます。

Fastly TLS を有効にする

言うまでもなく、事実上、すべての Web サイトと Web アプリケーションにとって、暗号化は難しい要件です。Taco Labs は、ユーザー認証など、Web アプリケーションに共通の多くのインタラクティブ機能を欠いています。しかし、まだTLSの使用はあきらめたくありません。そうしないと、検索エンジンとWeb ブラウザがペナルティを科すからです!

これまで、共有証明書を使用して、FastlyとクライアトのWeb ブラウザの間のトラフィックを保護するために、無料のTLSオプションを使用してきました。顧客に公開されない場合は、そのURL (https://tacolabs.global.ssl.fastly.net)を使用し続けることができます。例えば、iOSアプリケーション内でアセットを提供するにあたって、Fastlyを使用する場合、継続して無料TLSを使用することができるかもしれません。しかし、tacolabs.comのような、カスタムドメインに無料 TLS を使用することはできません。訪問者に証明書エラーが発生するためです。

カスタムドメインに TLS を必要とするため、Fastly TLS を使用してドメインに証明書を生成することができます。有料アカウントにアップグレードするためのクレジットカード番号を追加すると、Fastly TLS を使用して、追加料金なしで最大 5 ドメインに TLS 証明書を生成・管理することができます。「暗号化しましょう」オプションを無料で使用できます。これは、Fastlyによって自動的に管理・更新されます。または、独自の証明書をアップロードし、管理することもできます。

画面上部のセキュアリンクをクリックし、次に、TLS 管理リンクをクリックします。そして、始めるボタンをクリックします。以下のウィンドウが表示されます。

Fastly TLS を有効にする

フォームに入力して、ドメインを追加し、送信ボタンをクリックすると、以下のように、CNAMEレコードを追加する指示が表示されます。Fastly は、この情報を使用して、tacolabs.comドメイン名を所有していることを確認します。

Fastly TLSの検証

CNAMEレコードを追加するには、AWS Route 53に戻ります。これで、DNSサービスを処理します。DNSレコードが伝播するのに、数分かかります。Fastly が DNS レコードを発見し、検証すると、以下のように、TLS がwww.tacolabs.comに対して有効になります。

Fastly TLS を有効化する

DNSレコードの更新

ドメインにTLSを有効化したら、最終ステップの準備です:ドメインのDNSレコードを更新してFastlyを指すようにします。これを行うと、本番トラフィックは、Fastlyを介して流れ始めます。すべてが適切であることを確認するために、再度設定を確認することをお勧めします。

最初に行うべきことは、Web サイトや Web アプリケーションの既存の DNS レコードを把握することです。Taco LabsはWeb サイトです。最初は、DNSレコードがありませんでした。しかし、実際のシナリオでは、すでにDNSレコードのある既存のWeb サイトと操作することができます。Fastly に新しい CNAME レコードを追加する前に、ドメインの既存の DNS レコードを削除する必要があります。

以下のように、TLSドメインページのDNSの詳細を確認するボタンをクリックすることで、ドメインのCNAMEレコードの値を確認することができます。この値は、IPv6 アドレスをサポートしていませんが、IPv6を有効化するdualstackよう準備してくれます

Fastly TLS CNAME

この場合、Fastly コントロールパネルでは、CNAME レコードの値はj.sni.global.fastly.netですが、IPv6 を有効化する値としてdualstack.j.sni.global.fastly.netを使用します。AWS Route 53にCNAMEレコードを追加しましょう。以下のエントリーが表示されます。

AWS Route 53 で CNAME レコードを作成する

DNS レコードは、伝播するのに少し時間がかかりますが、以下のコマンドを使用して、ステータスを確認することができます:

1$ dig www.tacolabs.com +short
2dualstack.j.sni.global.fastly.net.
3151.101.198.132

これで、すべて設定できました!

apex ドメインをwwwにリダイレクトする

apex ドメインhttp://tacolabs.comに対応する必要があります: Fastly には、www.tacolabs.comが使用されていますが、wwwなしでドメインを入力したらどうなるでしょうか?リダイレクトを追加し、http://tacolabs.comと入力すると、自動的にhttp://www.tacolabs.comにリダイレクトされるようにする必要があります。

まず、Fastlyサービスにドメインとしてtacolabs.comを追加する必要があります。Edit configurationボタンをクリックして、サーバーを複製し、新しいドラフトバージョンを作成します。次に、ドメインページで、ドメインを作成するボタンをクリックします。ドメインフィールドに、tacolabs.comと入力し、追加ボタンをクリックします

これで、apex ドメインにリダイレクトを追加することができます。「設定」ページで、「トラフィックを www サブドメインにリダイレクトする」セクションで、apexリダイレクトを追加するリンクをクリックします。以下のように、ドメインメニューから tacolabs.com を選択し、「ステータス」メニューから 301 を選択します。最後に、保存ボタンをクリックし、有効化ボタンをクリックして、サーバー設定の新しいバージョンを有効化します。

Fastly コントロールパネルでapexリダイレクトを有効化する

Fastlyサービスは、リダイレクトを処理するように設定されています。ここで、tacolabs.comに DNS レコードを追加する必要があります。TLSページに、DNS AレコードにエニーキャストIPアドレスを表示したセクションがあることを思い出してください。以下のように、これらのエニーキャストのIPアドレスを使用して、tacolabs.comにルートで新しいDNS Aレコードを作成することができます。

AWS Route 53にapex DNSレコードを追加する

DNS レコードが伝播された後、curl を使用して、リダイレクトが機能しているかどうかをテストすることができます。以下のように、tacolabs.comwww.tacolabs.comにリダイレクトされます。

1$ curl -sLD - http://tacolabs.com -o /dev/null -w '%{url_effective}'
2HTTP/1.1 301 Moved Permanently
3Server: Varnish
4Retry-After: 0
5cache-control: max-age=86400
6Location: http://www.tacolabs.com/
7Content-Length: 0
8Accept-Ranges: bytes
9Date: Mon, 18 Oct 2021 19:25:46 GMT
10Via: 1.1 varnish
11Connection: close
12X-Served-By: cache-den8264-DEN
13X-Cache: HIT
14X-Cache-Hits: 0
15X-Timer: S1634585146.929981,VS0,VE79
16
17HTTP/1.1 200 OK
18x-amz-id-2: NXLv0EZjIymQiCtAvpbeUyXlfiKjvMBbpSOqz84U5JNOfm5ysn1c43hvahA6oKH1/t+uiJS2Xrw=
19x-amz-request-id: T6JEN0EXBQFXVRCF
20cache-control: no-store, max-age=0
21Last-Modified: Fri, 23 Jul 2021 21:54:38 GMT
22ETag: "dcf9e4efa41b023a4280c8305070a1cf"
23Content-Type: text/html
24Server: AmazonS3
25Via: 1.1 varnish, 1.1 varnish
26Content-Length: 4469
27Accept-Ranges: bytes
28Date: Mon, 18 Oct 2021 19:25:46 GMT
29Age: 0
30Connection: keep-alive
31X-Served-By: cache-mdw17341-MDW, cache-phx12427-PHX
32X-Cache: MISS, MISS
33X-Cache-Hits: 0, 0
34X-Timer: S1634585146.116375,VS0,VE94
35Vary: Accept-Encoding

HSTSを有効化し、TLSを強制する

これまでで、ほとんどが完了しましたが、現在の状態において、まだ機能していないものがあります。訪問者は、暗号化されていないwww.tacolabs.comのバージョンにアクセスすることができます。訪問者に、https://www.tacolabs.comでサイトの暗号化されたバージョンを強制する必要があります。

TLSを強制し、HTTP 厳格移送セキュリティ (HSTS)を有効にすることで、そうすることができます。Edit configurationボタンをクリックして、サーバーを複製し、新しいドラフトバージョンを作成します。「設定」ページで、以下のように、TLSを強制し、HSTSを有効化するスイッチをクリックし、オンの位置にします。HSTS 期間を、少なくとも、テストの間隔に設定することをお勧めします。

Taco LabsにTLSを強制する

Activate ボタンをクリックして、サービス設定の新しいバージョンを有効化します。これで、リダイレクトを確認することができます。今回、以下の curl コマンドの出力は、http://tacolabs.comhttps://www.tacolabs.comにリダイレクトすることを示しています。

1$ curl -sLD - http://tacolabs.com -o /dev/null -w '%{url_effective}'
2HTTP/1.1 301 Moved Permanently
3Server: Varnish
4Retry-After: 0
5cache-control: no-store, max-age=0
6Location: http://www.tacolabs.com/
7Content-Length: 0
8Accept-Ranges: bytes
9Date: Mon, 18 Oct 2021 20:38:35 GMT
10Via: 1.1 varnish
11Connection: close
12X-Served-By: cache-bur17572-BUR
13X-Cache: HIT
14X-Cache-Hits: 0
15X-Timer: S1634589516.510082,VS0,VE58
16Strict-Transport-Security: max-age=300
17
18HTTP/1.1 301 Moved Permanently
19Server: Varnish
20Retry-After: 0
21Location: https://www.tacolabs.com/
22Content-Length: 0
23Accept-Ranges: bytes
24Date: Mon, 18 Oct 2021 20:38:35 GMT
25Via: 1.1 varnish
26Connection: close
27X-Served-By: cache-phx12424-PHX
28X-Cache: HIT
29X-Cache-Hits: 0
30X-Timer: S1634589516.811935,VS0,VE1
31Strict-Transport-Security: max-age=300
32
33https://www.tacolabs.com/

対応しなければならない別の問題があります:HTTリダイレクト(https://tacolabs.comからhttps://www.tacolabs.comへ)は、証明書の不一致エラーを返します。これを解決するには、セクションの指示に従い、apex ドメイン(tacolabs.com)に別の TLS 証明書を追加する必要があります。これが完了すると、リダイレクトはすべて機能します。

統計を見る

これで、すべてが設定され、機能します!成功をお祝いしましょう。Fastlyを正常に設定し、オリジンサーバーからWeb サイトやアプリケーションをプルして、可能な限り効率的な方法で顧客に配信することができるようになりました。

ここからは楽しむ時間です。リアルタイムでトラフィックを見ます。Taco Labs は、(まだ) 成功していないフェイク Web サイトですが、ターミナルコマンドでトラフィックをシミュレートすることができます。これにより、Fastly のリアルタイムと履歴的な統計機能を実感することができます。

これまで、特に、Fastly コントロールパネルの「配信」タブで作業してきました。ここからは、以下のように、統計をクリックして、コントロールパネルの別の部分を使います。「統計」には、2 つのページがあります。リアルタイムと履歴です。名前の通り、リアルタイム統計ページには、リアルタイム分析と履歴のキャッシュ統計が表示されます。

Fastly コントロールパネルで「統計」ページにリンクする

まだ何も表示されていませんので、Web サイトにトラフィックを送信しましょう。利用可能な Apache ベンチコマンドツール、watch コマンドを自由に使用して、訪問者をシミュレートすることができます。

$ watch -n 1 ab -r -n 30 -c 30 -g out.data https://www.tacolabs.com/

ターミナルアプリケーションでこのコマンドが実行されている場合、以下のように、「統計」ページにリアルタイム統計が表示されます。

Fastly コントロールパネルでのリアルタイム統計

細かいことは省略しますが、統計ページは、Web サイトやアプリケーションへのトラフィックの俯瞰図を得る最良の方法だということを知ってください。当社のドキュメントには、統計ページの詳細が記載されています。

ログの確認

先ほどのチュートリアルでは、ログの設定を行いました。この作業は、うまくいっているはずです。Fastly のサービスでは、本番のトラフィックが増加しているため、訪問者にエラーが発生していないことを確認するためにログを監視する必要があります。実際のシナリオでは、エラーステータスコード、コンバージョン率の低下、その他Web サイトやアプリケーションに特有の問題がないかどうかを確認する必要があります。先を見越したモニタリングを考えてください。大惨事になる前に、まだ見えない問題の芽を摘むことです。

すでに、2つのエンドポイントが設定されています。Amazon SとPapertrailです。Papertrail エンドポイントは、リアルタイムログストリーミングエンドポイントであるため、それをここで使用します。Amazon S3 は、古いイベントを検証するために使用できる履歴レコードです。下記のPapertrailのインターフェースから、ボットがすでにTaco Labsをクロールしていることがわかり、また、画像の欠落に関連するいくつかのエラーがあることがわかります。

Papertrail のログを確認する

前述したように、ログをフィルターして、本当に興味があるイベントを探すことをお勧めします。例えば、HTTP ステータスコード 200 ですべてのエントリーをフィルターすることができます。そうすると、エラーのみが表示されます。

コントロールパネルを使用してキャッシュを確認する

このチュートリアルでは、curlコマンドを使用して、FastlyがどのようにWeb サイトをキャッシュしているかを確認しました。では、コントロールパネルを使用してみましょう。

「サービス概要」タブの下に、キャッシュをチェックするボタンがあります。このボタンをクリックして、コントロールパネルで指定したドメインを含むUURLを入力することができます。このツールは、Fastly ネットワーク全体でオブジェクトがどのようにキャッシュされているかを示しています。

Fastly コントロールパネルでキャッシュを確認する

ご覧のとおり、コントロールパネルのキャッシュ確認ツールは、curlよりも多くの情報を提供します。これは、Web サイトの問題をトラブルシューティングする際に、使用すべき最初のツールの1つです。


翻訳についての注意事項
このガイドは役に立ちましたか?

このフォームを使用して機密性の高い情報を送信しないでください。サポートが必要な場合はお問い合わせください : support@fastly.com