高速CDN の Fastly と Oracle Cloud を連携してみた

8584 ワード
oraclecloud fastly oci oci テキストリンク

はじめに

コンテンツキャッシュ削除が超高速と話題の Fastly と Oracle Cloud Infrastructure を連携させてみました。
Fastly とOCI間の連携手順と、コンテンツのInstant Purge(即時削除)の手順をご紹介していきます。
Fastlyアカウントを作成すると、$50 までの Free 枠が用意されているので、気軽に利用することができます！

※ 所属している会社・組織とは何の関係もない、一個人の技術記事です。Oracleが提供するサービスや、今後のロードマップとは何も関係がございません、ご留意ください。

Fastlyとは

Fastlyとは、Fastly社が提供しているCDN(Contents Delivery Network) サービスです。世界中にエッジサーバーを配置し、高速にコンテンツを提供するサービスです。他社のCDNサービスを挙げると、Akamai, Amazon CloudFront, CloudFlare などがあります。聞き覚えががある方もいらっしゃると思います。

一般的なCDNサービスは、世界中のエッジサーバーにキャッシュさせると、それを無効化するために数分~数十分単位で時間が掛かってしまいます。なので、同じURLで頻繁にコンテンツが切り替わるサイトはCDNが難しいと考えています。これに対応するために、FastlyのInstant Purge機能を使うことで、即時にコンテンツキャッシュの削除ができ、頻繁に更新されるコンテンツをCDNで提供することができます。

Fastly アカウント作成

Fastly のページに飛んで、Sign up ボタンから、適当にアカウントを取得します。

アカウントを登録作業後、約10分ほどでメールアドレスに通知が来ます。確認ボタンを押すことで、登録完了となります。(通知が来ない場合はサポートに問い合わせすると、再送することが出来ます)

OCI にキャッシュ元のWebサーバを構成

Nginxの構成

Fastlyのキャッシュ元サーバをOCI上に準備します。
適当に仮想ネットワークやインターネットゲートウェイ、コンピュートインスタンスを構成し、インスタンス上にNginxをたてます。

今回の記事では、具体的な手順は省略します。具体的な手順は以下の記事が参考になります。

OCI チュートリアル
https://community.oracle.com/docs/DOC-1019313

Nginxを構成し、グローバルIPを使用してアクセスすると、以下のような Welcome ページが表示されます。

Fastly OCI連携

Service 設定

FastlyでCDNサービスの設定を行うときに、一番最初にServiceという単位を作成する必要があります。1個のServiceが、1個のCDN構成を表しています。Service上で細かな設定を行うことで、CDNの細かな挙動を制御することができます。

一番最初にFastlyにログインすると、[GET STARTED]ボタンが表示されるのでこれを押します。ボタンを押すことで、1個のServiceが作成されます。

Serviceが自動的に作成されると、Serviceの管理画面に移動します。Serviceの名前が[Unnamed Service]となっているため、適当にわかりやすい名前に変更します。

Domains 設定

次に、Fastly上でDomainを作成していきます。Domainは、独自のコンテンツを Fastly の CDN として紐づけるために必要になる設定です。

[CREATE YOUR FIRST DOMAIN] を選択します

Domain Name に、提供したいサービスのドメイン名を指定します。今回の場合は、事前に sugi.tokyo というドメインを購入しており、ここのドメインをFastlyでCDNを提供する時のドメイン名として扱います。Fastlyに登録する際には、fastly.sugi.tokyo のドメインを対象にします。

Origins 設定

次に Origins の設定を行います。Origins は、CDNで提供するためのコンテンツ提供元を表しています。OCI 上で作成した Nginx のグローバルIPアドレスを指定します。

ACTIVATE

画面右上にある、ACTIVATE を押して、CDNを開始します

以下の画面へ自動遷移します

アクセス確認

FastlyのDomains メニューにある、Test domain を選択すると、Fastly側から提供されているURL にアクセスすることができます。本番に適用するまえに確認できるのが便利ですね。今回例では、http://fastly.sugi.tokyo.global.prod.fastly.net/ という名前でURLが生成されます。

URLにアクセスした結果、正しくNginx のウェルカムページが表示されれば成功です

ドメインの設定

正しくCDNが構成されたことを確認したのちに、ドメインの構成を変更します。

例を挙げると、 fastly.sugi.tokyo というCNAMEレコードを作成し、FastlyのURL http://fastly.sugi.tokyo.global.prod.fastly.net/ を指定します

このCNAMEレコードにより、独自のドメインを使用してFastlyでCDNを行うことが出来ます。

以下の設定は、OCI上のDNSサービスで設定を行ったときの例です

Instant Purge (キャッシュの削除) の確認

FastlyにNginxのコンテンツをキャッシュすることができたので、キャッシュの削除速度を確認します。まずは、NginxのWelcomeページを変更します。

Nginxのインスタンス上に存在しているHTMLファイルの「Welcome to Nginx!」の文字列を「Hello, Fastly! I am the FLASH!」と変更します

cat <<'EOF' > /var/www/html/index.nginx-debian.html
<!DOCTYPE html>
<html>
<head>
<title>Hello, Fastly! I am the FLASH!</title>
<style>
    body {
        width: 35em;
        margin: 0 auto;
        font-family: Tahoma, Verdana, Arial, sans-serif;
    }
</style>
</head>
<body>
<h1>Hello, Fastly! I am the FLASH!</h1>
<p>If you see this page, the nginx web server is successfully installed and
working. Further configuration is required.</p>

<p>For online documentation and support please refer to
<a href="http://nginx.org/">nginx.org</a>.<br/>
Commercial support is available at
<a href="http://nginx.com/">nginx.com</a>.</p>

<p><em>Thank you for using nginx.</em></p>
</body>
</html>
EOF

NginxのグローバルIPアドレス宛てに直接開くと、コンテンツが変わっています

対して、Fastly上のキャッシュデータは古いままです。

Fastly上でキャッシュの削除を行います。CONFIGURE メニュー配下にある、PURGEからPurge all を選択します。これでキャッシュが削除されます。

自分の環境では、約数秒経過後にFastlyのキャッシュデータが更新されました

参考URL

Fastly
https://www.fastly.com/

Fastly Documents
https://docs.fastly.com/ja/guides/basic-setup/getting-started-with-fastly

Fastly Basic Setup
https://docs.fastly.com/guides/basic-setup/

Fastly使ってみた
https://hawksnowlog.blogspot.com/2017/02/my-first-fastly.html