Cloudflare のフリープラン
Cloudflareは様々なサービスが有るのですが、メインの Cache 機能を設定します。
Cacheが効いているとユーザーはブラウザから素早くページにアクセスができるようになります。
プランは利用する「サイト」毎に契約します。
フリープランはクレジットカードの登録が必要ありません。
本当に使うときだけ登録すればいいというのは勝手に支払いが発生したりしないのでありがたいことです。
また、フリープランはドメインのネームサーバーをCloudflareにする必要があります。
ドメインのプライマリおよびセカンダリネームサーバーはCloudflareが指定したものにしなければなりません。
自分の契約している別のDNSを使ってCNAMEでやりたい場合はBusinessかEnterpriseの有料契約が必要になります。
- ドメインとサーバーの用意
いきなり本番で試すのはちょっと怖いと思いますので適当なサーバーを用意して下さい。
さくらのレンタルサーバーのライトプランなど安いホームページサービスでOKです。
ドメインも用意して下さい。まるごとCloudflareで実験に使われるので現在は使っていないドメインがおすすめです。Cloudflareのドメイン登録で取得することが可能です。また、お名前.comやムームドメインという専用サービスもありますし、レンタルサーバーでドメイン取得サービスもだいたい行っています。
この例では取得したドメインを yukotan.com とします。
(ドメインの登録先はバリューサーバーです)
サーバーのドキュメントルートにindex.htmlと画像を設置して表示できるようにしておいて下さい。
CSSやJavaScriptもOKです。
この時点ではまだ yukotan.com では表示できないので、レンタルサーバー会社から指定されたURL (xxx.sakura.ne.jp 等) で表示が確認できれば大丈夫です。
自分でサーバーを構築している場合はこの時点でVirtualHostを設定しても良いですし、後ほどでも構いません。(7で作業します)
IPアドレスを調べてそれをメモしておいて下さい。
レンタルサーバー会社から指定されたURL (xxx.sakura.ne.jp 等) から調べたい場合はここで調べられます。(AとAAAAをメモしておいて下さい)
https://toolbox.googleapps.com/apps/dig/
※レンタルサーバーの場合は今後ホスティング会社でサーバーの移転などがあるとIPアドレスが変わる場合があるので注意して下さい。 - ログイン
アカウントがない場合はこちらからアカウントを作成して下さい。
https://dash.cloudflare.com/sign-upすでに持っているアカウントでログインの場合はこちらから
https://dash.cloudflare.com/login - ダッシュボードでサイトを追加右上にある「+サイトを追加」を選択すると上記のような画面になります。
追加したいドメインを入れて青色の「サイトを追加」を選択します。
ドメインは yukotan.com のような形式で入れます。
xxx.yukotan.com のようなサブドメインは含めないで下さい。 - プランの選択
いきなり有料プランが表示されますが、下の方に行くとフリープランが選択できます。
↓
Freeを選択して「続行」を選択します。
- DNS設定
DNS設定をドメイン名からクイックスキャンする画面になります。
しばらく待ちます。
すでにドメインを持っていてDNSをの設定が終わっている場合はその結果が表示されます。DNSの設定変更でサイトがダウンしないように手続きを簡単にしてくれます。今回の例のようにドメインを買っただけでDNSの設定をしていない場合は何も表示されません。
DNSの設定をしていない場合はここでDNSの設定を追加して下さい。
「レコードを追加」ボタンを押すと追加ができます。今回のようにドメイン取得だけして実験したい場合はAレコードにサーバーのIPアドレス(v4)を入れて下さい。(1で取得したIPアドレスを入れます)
IPv6を入れたい場合はAAAAレコードにサーバーのIPv6アドレスを入れて下さい。
実験だけであればMXレコードなどは必要ありません。
- ドメインのネームサーバーの変更ドメインに設定されているネームサーバーの変更をするよう案内が出ます。
現在のネームサーバーを
下記に変更するようにという指示です。 - サーバーのVirtualHostの設定
Cloudflareからリクエストが来た場合にページが表示できるようVirtualHostの設定を行います。さくらのレンタルサーバーの場合はこのような設定を行います。
追加するのはこの場合だと yukotan.com になります。独自でサーバーを用意している場合はWebサーバーの設定でVirtualHostの設定を行って下さい。
- アクセス
設定が完了して少し時間を置いたら購入したドメインにアクセスしてみて下さい。
この場合は https://yukotan.com です。
画像のHTTPヘッダーを確認してみて下さい。
Google Chrome であれば Chrome Dev Tools のネットワークタブから確認できます。
レスポンスヘッダーに "cf-cache-status: HIT" と出ていれば成功です。
htmlはデフォルトだとキャッシュされないので上記は出ません。
デフォルトでキャッシュされるファイルの種類一覧はこちら
設定に間違いがなければ、Cloudflareのサイトのダッシュボードで下記の表示が出ます。
- SSL証明書SSL証明書は自動で設定されます。htmlを置いてあるサーバーをオリジンサーバー、CloudflareをCDNサーバーといいます。ユーザーがブラウザからCDNサーバーにアクセスする間のSSL証明書は何もしなくても設定され通信は暗号化されます。
証明書はCloudflareが無料で発行してくれます。
オリジンサーバーとCDNサーバーの間はhttpでやり取りされます。
このオリジンサーバーとCDNサーバーの間もhttpsで暗号化したい場合は案内に従って下さい。
コメント