【実践】Use cookie-free domainsをクリアするために、Cookie Free Domainを構築する方法

YSlowスコアを100％達成するために残された項目は、「Use cookie-free domains」のみ。ブログの静的ファイルをCookie Free Domainに対応するだけです。Use cookie-free domainsはクリア不可能なのか？

対策の概要

Cookie Free Domainに対応する事自体はそんなに難しいものではありません。wordpress自体はすでに対応するコーディングは既に仕込んであり、WP_CONTENT_URLとCOOKIE_DOMAINの2つの定数を定義し直すだけです。そのほかにCookie Free Domainにするためのドメインの準備（サブドメインでも構わない）と過去記事の画像URLの修正をする。

【Cookie Free Domain対応作業項目】

1. WR_CONTENT_URLの定義
2. COOKIE_DOMANの定義
3. Cookie Free Domainサーバーの準備
4. 過去記事の画像URLの修正

作業途中で一番悩んだのが、このCookie Free Domainの構築でした。結局落ち着いた先がCookie Free Domainの実態は、今使用しているドメインの完全コピーもしくは実態そのもので構わないということです。そうはいえ、DNS自体は解決しなければならないので、私の場合は、サブドメインを定義した上でシンボリックリンクで現ドメインフォルダーにリンクさせることにしました。 ではその手順と内容を説明します。

実践手順

作業を次にまとめた手順で進めます。使用する環境は、このドメインを運用しているcoreserverとCDNとしてCloudFlare、wordpressのバージョンは4.2.4です。対象とするドメインはblogpot.ok55.netでCookie Free Domain名はstatic.ok55.netとしています。

1. CloudFlareのDNSレコードにstatic.ok55.netをCNAMEレコードとして登録
2. static.ok55.netサイト構築とシンボリックリンク作成
3. wp-config.phpファイルの修正
4. 過去記事の画像URLをstatic.ok55.netに変更

手順１：static.ok55.netをCNAMEレコードとしてDNS登録

この作業は1分でできます。CloudFlareにログインして新規サブドメインをCNAMEレコードとして登録するだけ。方法がわからない場合は、以下の記事のサブドメイン登録項を参考にしてみてください。

参考:

【実践】Use cookie-free domainsをクリアするために、Cookie Free Domainを構築する方法

Use cookie-free domains対策がなかなか手強い。インターネット検索してもこれに関する記述は

手順２：static.ok55.netサイト構築とシンボリックリンク作成

static.ok55.netサイト構築についてはもうすでにお分かりですね。新しくブログを立ち上げる要領でお使いのレンタルサーバーの管理画面からstatic.ok55.netをドメインとして登録すればいいだけです。この際のポイントがstatic.ok55.netを運用するフォルダーです。一般的には、public_htmlの直下にドメイン名と同じフォルダー名が作成されると思います。次にこのフォルダーをシンボリックリンクに置き換えるわけですが、rloginなどのTELNET接続ツールを使用しなければなりません。ログインできたなら、次のようなコマンドをrloginから実行します。 仮に現行ドメインのフォルダーが”/pulic_html/blogpot.ok55.net(絶対パスでなければいけません）ならば

cd /public_html
ln -s /public_html/blogpot.ok55.net static.ok55.net

これでシンボリックリンクの作成はできました。

手順３：wp-config.phpファイルの修正

ここではwordpress本体のCookie Free Domain対応をします。ただ前述したとおりWP_CONTENT_URLとCOOKIE_DOMAINの２つの定数を定義し直するだけで、定義はwp-config.phpに追加します。追加する場所は、/* 編集が必要なのはここまでです ! WordPress でブログをお楽しみください。 */の上にします。

define("WP_CONTENT_URL", "http://static.ok55.net/wp-content");
define('COOKIE_DOMAIN','blogpot.ok55.net');

手順４：過去記事の画像URLをstatic.ok55.netに変更

さぁ手順3までで、ほぼCookie Free Domain対応は完了しています。最後の作業として残っているのは、ブログで現行ドメインを直接参照しているURLの変更です。代表的なのは画像URLです。そのほかにもカスタマイズしたCSSファイルやJSファイルも対象となりますが、こちらは適宜修正をかけてください。 画像URLを修正するには、Search Regexプラグインをおすすめします。Search Regexプラグインは正規表現でブログ内を一括検索・置換することができます。 Search Pattern:/“http:\/\/blogpot.ok55.net\/wp-content\/uploads\/(.*?)\.(jpg|jpeg|png|gif|tif|wmv)”/ Replace pattern:”http://static.ok55.net/wp-content/uploads/\1.\2″ ※Regexにチェックをいれて置換してください。 また、もっと簡単に画像URLを対象として変更するには、the_contentフィルター関数を追加することです。私の場合はfunctions.phpに以下の追加をしています。やっていることは、現行ドメインをCookie Free Domain名に、無指定の場合も自動的にCookie Free Domain名を付けるようにしています。

// 1.拡張子で画像があるかどうか判断
$pattern = "/(src|href)=\"(.*?)\"/s";
$count = preg_match_all( $pattern, $content, $matches );

if( $count )
{
	// 2.画像ファイルの場合の処理
	$rep_src = array();
	$rep_obj = array();
	foreach( $matches[2] as $m )
	{
		// 3.サーバー名を取り出す
		$ptn_imgf = "/(.*?)\.(jpg|jpeg|png|gif|tif|wmv)/s";
		if( preg_match( $ptn_imgf, $m ) )
		{
			// 4a.ファイル処理中...
			$domain = str_replace("/", "\/" , "http://" . $_SERVER["SERVER_NAME"]);
			$pattern = "/" . $domain . "\/([_0-9a-zA-Z-]*\/)?wp-content/s";
			$m2 = preg_replace( $pattern, WP_CONTENT_URL ,$m );
			// 4b.置換後のファイル名
			if( $m2 )
			{
				if( $m!=$m2 )
				{
					$rep_src[] = str_replace("/", "\/", $m);
					$rep_obj[] = $m2;
				}
				else
				{
					
					$ptn = "/^\/([_0-9a-zA-Z-]*\/)?wp-content/s";
					$m_add = preg_replace( $ptn, WP_CONTENT_URL , $m);
					if( $m!=$m_add )
					{
						$rep_src[] = str_replace("/", "\/", $m);
						$rep_obj[] = $m_add;
					}
				}
			}
		}

	}

	$cnt = 0;
	$max = count($rep_src);
	while ($cnt < $max){
		// 実行する処理
		$content = preg_replace( "/" . $rep_src[$cnt] . "/", $rep_obj[$cnt], $content );
		$cnt++;
	}
}

※2017年2月26日コーディングを変更しました。

実践結果

さて、興味があるのがCookie Free Domainに対応した結果がどうなったか？ 結果からいうと、YSlowの「Use cookie-free domains」は0％のままで全体的なスコアやPageLoad Timeはむしろ対応前のほうがよいという結果になりました。作業内容が不十分なのかCookie Free Domainの作成がまずいのかどちらかだと思います。 それぞれGTmetrixがどのように変わったかは以下のとおり

GTmetorixで計測

どちらもＡＡ（ダブルエー）のままですが、何回かリトライした結果ですがPage Load Timeがなんとかなく長くなったような気がします。またHttp Request数がご覧のとおり増えてしまいました。

対応前の状態

クッキーフリードメインを設定すると逆にスコアが下がった！

YSlow

注目されるYSlowのUse cookie-free domainsは画像等すべて新Cookie Free Domainとリンクしていますが、対応前とおなじ画像が抽出されています。

PageSpeed

PageSpeedのほうはというと、Avoid CSS &64;importやInline Small CSS等の新規で指摘されるものが増えています。これらは対応前にクリアしていた項目ですので、今回の作業による弊害と思われます。

PageSpeed Score

htaccessで強制的にクッキー削除

これらに加えてもう一つ試してみたのが、htaccessで強制的にクッキー削除する方法。こちらの作業するにあたりstatic.ok55.netフォルダー自体にシンボリックリンクを設定していましたが、static.ok55.netフォルダーは残して直下/wp-contentをシンボリックリンクとしました。また同フォルダーのルートには下記のhtaccessを追加。結果は改善は見られず。

<FilesMatch "\.(css|js|jpg|jpeg|png|gif)$">
    RequestHeader unset Cookie
    Header unset Cookie
    Header unset Set-Cookie

参考にしたブログ

以下に参考にしたブログをあげておきます。

参考:news.mynavi.jp

クッキーを使わないドメインを使うという高速化手法 | TECH+（テックプラス）

画像やCSSのようにスタティックなコンテンツはキックーを有効にしていないクッキーレスドメインから取得した方が優れたパフォーマンスが見込めるというのはよく知られた高速化手法のひとつだ。この高速化手法の説明と実施方法をRob Flaherty氏がravelrumbaにおいてServing Static Content from a Cookieless Domainのタイトルのもとで紹介している。要点がまとまっていてわかりやすい。

参考:hoshiya.biz

404 Not Found

参考:www.engineacher.net

Use cookie

まとめ

他のみなさんが指摘するように、このような作業よりも記事を作成を重視すべきあらためて思いました。ただ、冒頭申し上げたとおりUse cookie-free domainsを詳細に記述した記事は少なく、なんとか実現したいと思い挑戦しましたがものの見事に惨敗。この記事がほかのみなさんのお役に立てば幸いですね。ご指摘などあれば随時お受けしたいと思います。どなたか対応できた方はおしらせください。

• 高速チューニングおすすめ表示

• クッキーフリー
• cookie free
• 構築