サブドメインとサブディレクトリ

APO を有効にしたあと、WordPress を使っているサブドメインで動くように設定します。たとえば、www.mysite.com というサイトに、WordPress を動かしている shop.mysite.com というサブドメインがある場合、APO は shop.mysite.com サブドメインで動くように設定します。

1. Cloudflare WordPress プラグインのバージョン 4.4.0 以降をインストールします。
2. Cloudflare の API token または Global key でログインします。
3. APO を有効にします。カード内のホスト名一覧に、そのサブドメインが表示されます。
4. サブドメインごとに、同じ手順を繰り返して APO を有効にします。

デフォルトでは、APO はエイペックスドメイン（「ルートドメイン」または「ネイキッドドメイン」とも呼ばれます）で動作します。サブドメインで APO を動かすと、エイペックスドメインは自動で無効になります。サブドメインとエイペックスドメインの両方で APO を動かすには、エイペックスドメイン側の WordPress プラグインをバージョン 4.4.0 以降にアップグレードし、APO を再度有効にします。

APO を有効にしたあと、WordPress を使っているサブディレクトリで動くように設定します。たとえば、www.mysite.com というサイトに、WordPress を動かしている mysite.com/shop というサブディレクトリがある場合、APO は mysite.com ドメインで動くように設定します。

1. Cloudflare WordPress プラグインをインストールします。
2. Cloudflare API Token を追加します。
3. APO を有効にします。

サブディレクトリごとに手順 1 と 2 を繰り返し、自動キャッシュパージ用の WordPress プラグインを有効にします。

サブディレクトリだけで APO を動かす場合、ドメインの残りは APO をバイパスするように設定します。バイパス方法は 2 つあります。

cf-edge-cache: no-cache は、サイトの WordPress 以外の部分でキャッシュをバイパスするよう APO に指示します。次の例のように、Cloudflare Workers で実装できます。

export default {
	async fetch(request, env, ctx) {
		const originalResponse = await fetch(request);

		// Response properties are immutable. To change them, construct a new Response object.
    const response = new Response(originalResponse.body, originalResponse);

    // Response headers can be modified through the headers `set` method.
    response.headers.set("cf-edge-cache", "no-cache");

		return response;
	},
};

キャッシュルール を作り、Cache eligibility: Bypass cache でサイトの WordPress 以外の部分をキャッシュから除外します。この方法は、該当パスの静的アセットを含む、すべてのキャッシュを無効にします。そのため、レスポンスヘッダーで APO を無効にすることを推奨します。