ブログ高速化:CloudFlareの導入

ブログを高速化したい、なんてお悩みなら無料でできて効果的面「CloudFlare」を導入すべし! ここではCloudFrare導入と簡単な使い方を説明します。

Initializing...

CloudFlare(クラウドフレア)とは?

CloudFlareはWebレスポンス改善には必須

CloudFlareって何物?というところから説明します。CloudFlareは、Webのレスポンスを劇的に早くする必須のサービスです。このサービスを使うとWebのレスポンスを平均2倍~3倍以上早くなります。

なぜ早くなるの?

CloudFlareは、Web中の画像やCSS等のstaticなファイルをキャッシュして、代理応答するキャッシングサーバです。CloudFlareのキャッシングサーバはあなたの近くに無数にあり、Webの大半を占めるこれらのファイルををわざわざWebサーバまで見に行く必要がないWebサーバの混雑具合に左右されることもない等の利用により、結果としてWebのレスポンスが改善される訳です。

CloudFlareは無料で使える

CloudFlareは小規模で個人用のブログ等を対象にしており、対象のドメインとメールアドレスがあれば誰でも無料で利用することが出来ます。

CloudFlareを導入する

CloudFlareの導入概要

CloudFlareをブログに導入する場合は、

  1. ClourFlare管理サイトでアカウントを取得する
  2. 対象のサイト情報の登録する
  3. サブドメインの登録

以上の3つの作業が必要になります。

では、上から順番に説明します。

アカウントの作成

以下のURLにアクセスして新規アカウントを作成しましょう
https://www.cloudflare.com/

画面中央にある[Sign Now!]ボタンをクリックします。

CloudFlare-CreateAccount1

ここで必要な情報は、

You email address(連絡用に使うメールアドレスで、これがあなたのアカウントにもなります)

Choose a username(ニックネームみたいなものです。ほかの人とぶつからない名前ならなんでも結構)

password(ご存知、このアカウントのパスワードです)

これらの入力がすんだら、Create Accound Nowボタンでアカウントを作成します

CloudFlare-CreateAccount2

登録するWebサイト(最初)のURLを、”http:~”から入力します

CloudFlare-CreateAccount3

CloudFlareは、登録するために入力されたWebサイト情報をスキャンします。約35秒ほど時間がかかりますがしばらく待ちます。スキャン中はCloudFlareのデモビデオが流れます。

CloudFlare-CreateAccount3a

スキャンが終了すると下部にScan Completeが表示されますので、Continueボタンで次に進みます。

CloudFlare-CreateAccount3b

もし、あなたのWebサイトがWWW以外で始まるサブドメインを利用している場合は、そのサブドメインをここで登録します。(サブドメインの登録の詳細は後述してます)

CloudFlare-CreateAccount3d

以下の画面は特に変更する必要がありませんので、そのまま次へ進んでください。

CloudFlare-CreateAccount3e

これは重要です。ここで表示されたネームサーバー情報をメモし、今使っているネームサーバー情報を書き換えてください。

 

CloudFlare-CreateAccount3f

もし、追加するWebサイトがなければ以下の画面が表示さればWebサイトの登録は終了となります。

CloudFlare-CreateAccount3g

 サブドメイン登録

サブドメインの登録には、登録の種類としてAレコード、AAAAレコードおよびCNAMEレコードで登録する3つの方法があります。

サブドメインの登録

AレコードとAAAAレコードはIPアドレスの種類の違いでIPv4で登録するかIPv6で登録するかの違いです。IPv6はまだまだ普及していませんので、当面はIPv4であるAレコードで登録して構いません。登録データには、先ほどスキャンしたIPアドレスをそのまま記入します。

CNAMEレコードを使う場合は、他のURLを利用して登録する場合で登録データには、ドメイン名の含めたフルURLを入力します。second.ok55.netを当ブログのblogpot.ok55.netを利用して登録する場合は、

登録の種類:CNAME
サブドメイン名:second
登録データ:blogpot.ok55.net

のように入力します。

ネームサーバのDNS情報の変更が反映されるのは最大1日以上かかります。それまで登録したサブドメインにアクセスしても404エラーが表示されます。

CloudFlareの使い方

CloudFlareを導入してもあまり使うことはないと思いますが、ブログのCSSを変更したり画像の入れ替えをおこなった場合はこれらの静的なファイルをCloudFlareがキャッシュしているために、うまく最新状態を表示しません。このような場合にはCloudFlareのメインページからキャッシュの消去などができます。

以下の2016年5月時点のメインページ最上部に表示されているCloudFlareのメニューです。ここで使うのは赤枠で囲んだOverview、DNS、Cachingの3つのいずれかです。それぞれのボタンでできることは、

Overviewページ
デバックモード(Development Mode)に切り替えて、修正作業中はずっとキャッシュを無効にする
DNSページ
サブドメイン単位に、CloudFlareの有効/無効の切り替え
Cachingページ
キャッシュされているファイルを個別に、または一括で削除する場合

CloudFlareのメニュー

CloudFlareのメニュー

Overviewページ

デバックモードに切り替えるには、Quick Actions(プルダウンメニューになっている)をクリックし、表示された中からDevelopment Modeを選択します。デバックモードは解除しなくてもだいたい4時間(?)程度で自動で解除されますので、解除忘れにはなりません。
cloudflare_overviewpage

DNSページ

修正内容を本番環境にアップする前のテスト用のサブドメインを使用する場合、CloudFlareは無効にした場合の方が作業がはかどります。このようなケースでサブドメイン単位でCloudFlareを無効にする場合は、DNSページを開いて、下図にあるようにStatus欄に表示されているアイコンをクリックするとアイコンが淡色表示となり無効にすることができます。

ふたたび有効とする場合は再度クリックし直すと有効にかわります。
cloudflare_dnspage

Cachingページ

どうしても最新状態にならないような場合は、Cachingページにアクセスしてキャッシュされているファイルを単独でもしくは一括で削除するとよいかもしれません。

キャッシュされているファイルを削除する場合は、Purge Individual Files(プルダウンメニュー)からPurege By Tag(ファイル個別)またはPurge Everything(一括)から削除してください。
cloudflare_cachepage

HTTPS化する場合

ブログが既にhttps対応している場合は、CryptoのSSL設定の確認が必要です。

Flexble サーバーがhttpsにまだ対応していない場合に使用します。クライアントとCloudFlare間でhttpsを使用しますが、CloudFalreとサーバー間は平文での接続をします。
Full サーバーには自前のhttpsを使っている場合に使用します。サーバーの証明書の有効性を問いません。
Full Strict サーバーには正式な証明書のあるhttpsが使っている場合に使用します。これはクライアントとCloudFlareおよびサーバーとCloudFlare間の2重に暗号化することになるので無駄が生じますのであまり使うことはありません。むしろこの場合は下記のオフ設定をお勧めします
オフ httpおよびhttpsをそのまま使う場合です。

CloudFlareに関するその他の記事

スポンサーリンク
ページ上部へ戻る