2026年5月21日

WP Rocketのエラーを解決する方法

SEO・パフォーマンス

はじめに

WP Rocketを有効にした後にページを更新してもキャッシュが自動削除されず古いコンテンツが配信される・CSS/JSファイルの結合・最小化を有効にするとスライダーやタブが動作しなくなる・遅延読み込みを有効にするとファーストビューの画像が表示されない（LCP悪化）・Cloudflareと連携するとキャッシュパージが二重になって不整合が起きるといった問題は、除外設定・Critical CSS・LazyLoadの設定が原因です。

症状・原因

記事を更新してもサイトでは更新前の内容が表示される
WP Rocketの「ファイルの最適化」を有効にするとJavaScriptコンソールにエラーが出る
スマートフォンでトップページのメイン画像が最初に表示されずLCPスコアが低下する
WP RocketのキャッシュをパージしてもCloudflareのキャッシュが残る

解決手順

ステップ1：WP Rocketの状態を確認する

# WP Rocket設定確認
wp eval "
if (defined('WP_ROCKET_VERSION')) {
    echo 'WP Rocket version: ' . WP_ROCKET_VERSION . PHP_EOL;
}

// キャッシュ設定を確認
\$options = get_option('wp_rocket_settings', []);
echo 'Cache enabled: '          . (!empty(\$options['cache_enabled']) ? 'yes' : 'no') . PHP_EOL;
echo 'Minify CSS: '             . (!empty(\$options['minify_css']) ? 'yes' : 'no') . PHP_EOL;
echo 'Minify JS: '              . (!empty(\$options['minify_js']) ? 'yes' : 'no') . PHP_EOL;
echo 'Defer JS: '               . (!empty(\$options['defer_all_js']) ? 'yes' : 'no') . PHP_EOL;
echo 'LazyLoad images: '        . (!empty(\$options['lazyload']) ? 'yes' : 'no') . PHP_EOL;
echo 'Critical CSS: '           . (!empty(\$options['async_css']) ? 'yes' : 'no') . PHP_EOL;
echo 'Cloudflare enabled: '     . (!empty(\$options['cloudflare']) ? 'yes' : 'no') . PHP_EOL;

// 除外リストを確認
echo 'Excluded CSS: '           . count(\$options['exclude_css'] ?? []) . ' entries' . PHP_EOL;
echo 'Excluded JS: '            . count(\$options['exclude_js'] ?? []) . ' entries' . PHP_EOL;
echo 'Cache excluded URIs: '    . count(\$options['cache_reject_uri'] ?? []) . ' entries' . PHP_EOL;

// キャッシュディレクトリを確認
\$cache_dir = WP_CONTENT_DIR . '/cache/wp-rocket/';
echo 'Cache dir writable: '     . (is_writable(\$cache_dir) ? 'yes' : 'no') . PHP_EOL;
"

ステップ2：キャッシュパージをプログラムで制御する

// functions.php: WP Rocketキャッシュ制御

// ① 投稿更新時にWP Rocketキャッシュをパージ
add_action('save_post', function(int $post_id, WP_Post $post): void {
    if ($post->post_status !== 'publish') return;
    if (wp_is_post_revision($post_id)) return;

    // WP Rocketのキャッシュをパージ
    if (function_exists('rocket_clean_post')) {
        rocket_clean_post($post_id);

        // ホームページのキャッシュも削除
        rocket_clean_home();

        // 関連するカテゴリページも削除
        $terms = get_the_terms($post_id, 'category');
        if ($terms && !is_wp_error($terms)) {
            foreach ($terms as $term) {
                rocket_clean_term($term);
            }
        }
    }

    error_log(sprintf('[WPRocket] Cache purged for post #%d', $post_id));
}, 10, 2);

// ② 管理バーにキャッシュクリアボタンの拡張
add_action('wp_before_admin_bar_render', function(): void {
    global $wp_admin_bar;
    if (!current_user_can('rocket_purge_cache')) return;

    $wp_admin_bar->add_node([
        'id'    => 'rocket-purge-current',
        'title' => '🚀 このページのキャッシュをクリア',
        'href'  => wp_nonce_url(
            add_query_arg('rocket_purge_current', '1'),
            'rocket_purge_current_nonce'
        ),
    ]);
});

// ③ 特定Cookieでキャッシュをバイパス
add_filter('rocket_cache_reject_cookies', function(array $cookies): array {
    $cookies[] = 'woocommerce_items_in_cart';
    $cookies[] = 'woocommerce_cart_hash';
    return $cookies;
});

ステップ3：CSS/JS最適化の除外設定を修正する

// functions.php: 最適化除外設定

// ① JavaScript除外リストを追加
add_filter('rocket_exclude_js', function(array $excluded): array {
    $to_exclude = [
        '/wp-includes/js/jquery/jquery.min.js',
        '/wp-includes/js/jquery/jquery-migrate.min.js',
        'slick.min.js',
        'swiper.min.js',
        'elementor/assets/js/frontend.min.js',
        'woocommerce/assets/js/frontend/woocommerce.min.js',
        'recaptcha',
        'googlesyndication',
    ];

    return array_unique(array_merge($excluded, $to_exclude));
});

// ② CSS除外リストを追加
add_filter('rocket_exclude_css', function(array $excluded): array {
    $to_exclude = [
        '/wp-admin/css/dashicons.min.css',
        'elementor/assets/css/frontend.min.css',
    ];
    return array_unique(array_merge($excluded, $to_exclude));
});

// ③ defer JSから特定スクリプトを除外
add_filter('rocket_exclude_defer_js', function(array $excluded): array {
    $excluded[] = 'jquery.min.js';
    $excluded[] = 'jquery-migrate.min.js';
    return $excluded;
});

ステップ4：LazyLoadとCritical CSSの問題を修正する

// functions.php: LazyLoad・Critical CSS設定

// ① LazyLoadから除外する画像を設定
add_filter('rocket_lazyload_excluded_attributes', function(array $attributes): array {
    // ファーストビューの画像クラスを除外
    $attributes[] = 'class="hero-image"';
    $attributes[] = 'class="site-logo"';
    $attributes[] = 'id="main-visual"';
    return $attributes;
});

// ② LazyLoadから除外するURLパターン
add_filter('rocket_lazyload_excluded_src', function(array $patterns): array {
    // ロゴやアイコンは遅延読み込みしない
    $patterns[] = '/logo';
    $patterns[] = '/icon';
    $patterns[] = '/hero';
    return $patterns;
});

// ③ Critical CSSの生成をトリガー
add_action('after_switch_theme', function(): void {
    if (function_exists('rocket_regenerate_critical_css')) {
        rocket_regenerate_critical_css();
        error_log('[WPRocket] Critical CSS regeneration triggered after theme switch');
    }
});

// ④ ページ種別ごとにLazyLoadを制御
add_filter('do_rocket_lazyload', function(bool $do): bool {
    // AMP対応ページでは無効化
    if (function_exists('is_amp_endpoint') && is_amp_endpoint()) {
        return false;
    }
    return $do;
});

ステップ5：Cloudflare連携とエラー診断を設定する

// functions.php: Cloudflare連携

// ① WP RocketとCloudflareの連携パージ
add_action('after_rocket_clean_post', function(int $post_id): void {
    // Cloudflare APIで該当URLをパージ
    $zone_id   = defined('CLOUDFLARE_ZONE_ID') ? CLOUDFLARE_ZONE_ID : get_option('wpr_cf_zone_id', '');
    $api_token = defined('CLOUDFLARE_API_TOKEN') ? CLOUDFLARE_API_TOKEN : get_option('wpr_cf_api_token', '');

    if (!$zone_id || !$api_token) return;

    $url = get_permalink($post_id);
    wp_remote_post(
        "https://api.cloudflare.com/client/v4/zones/{$zone_id}/purge_cache",
        [
            'headers' => [
                'Authorization' => 'Bearer ' . $api_token,
                'Content-Type'  => 'application/json',
            ],
            'body'    => json_encode(['files' => [$url]]),
            'timeout' => 10,
        ]
    );
});

// ② WP Rocketのエラーをログに記録
add_action('wp_rocket_cache_failed', function(string $url, string $error): void {
    error_log(sprintf('[WPRocket] Cache failed for %s: %s', $url, $error));
}, 10, 2);

注意事項

WP RocketのCritical CSS機能はQUIC.cloudまたはWP Rocketのサーバーサービスを使用してCritical CSSを生成します。生成に失敗した場合はサイト全体のCSSが非同期読み込みになりFOUCが発生します。生成失敗時はCritical CSS機能を一時的に無効化してください
「ファイルを結合」オプションはHTTP/2環境では効果が薄いです。WP Rocket 3.0以降では「JavaScript を結合」はデフォルトで無効になっています。HTTP/2に対応したサーバーでは結合は不要で、Minifyのみを有効にすることを推奨します
WooCommerceを使用している場合はWP Rocketのインストール時にWooCommerceとの互換設定が自動で適用されます。カート・決済・マイアカウントページは自動的にキャッシュから除外されます

まとめ

WP Rocket修復は①wp_rocket_settingsオプションでMinify・LazyLoad・Critical CSS・Cloudflare設定を確認・除外リスト件数を診断、②save_postフックでrocket_clean_post()・rocket_clean_home()・rocket_clean_term()を呼び出し自動パージ・rocket_cache_reject_cookiesでカートCookieバイパス、③rocket_exclude_jsフィルターでjQuery・スライダー・ElementorをMinifyから除外・rocket_exclude_defer_jsでjQuery遅延を防止、④rocket_lazyload_excluded_attributesでヒーロー画像をLazyLoad除外・Critical CSS再生成、⑤after_rocket_clean_postフックでCloudflare APIを連動パージする手順で解決します。

Post Views: 40