使用 Wordpress 超级缓存从缓存中排除动态值

Question

我正在使用超级缓存插件。

一段时间以来，我一直在寻找解决方案，但没有成功。我需要为文件functions.php 中的一项功能禁用缓存。

add_shortcode('custom_counter', 'example_shortcode');
function example_shortcode() {
    // Get custom counter option value
    $counter = get_option( 'wc-custom-counter' );
    return '<span class="custom-counter">' . $counter . ' rub.</span>';
}

这是在创建的自定义页面上使用的简码。此简码输出的数据必须不落入页面缓存。

Answer 1

改编自this old WSE thread，您将在下面找到使其工作的完整方法。

这里我们显示一个微调器加载图标，它将通过 ajax 被计数器实际非缓存值替换。 Javascript 即使在缓存页面中也始终保持活动状态，因此它可以通过 Ajax 或任何检测到的事件更改页面上所需的任何内容。所以在插件设置中不需要排除任何东西。

替换代码：

// The shortcode
add_shortcode('custom_counter', 'customer_counter_shortcode');
function customer_counter_shortcode() {
    // Start buffering
    ob_start(); 

    // Using woocommerce existing animated spinner gif icon
    $loading_url = home_url( '/wp-content/plugins/woocommerce/assets/images/select2-spinner.gif' );
    
    // Displaying a "Loading spinner icon + text to be replaced by Ajax value
    echo '<span class="custom-counter">
        <img id="loading-img" src="'.$loading_url.'" alt="Loading..." style="opacity:0.5; display:inline-block; vertical-align: middle;" />
        <span style="opacity:0.5;"> ' . _("loading…") . '</span>
    </span>';
    ?>
    <script type="text/javascript">
    jQuery( function($){
        if (typeof woocommerce_params === 'undefined')
            return false;

        $.ajax({
            type: 'POST',
            url: woocommerce_params.ajax_url,
            data: {
                'action': 'custom_counter',
                'custom-counter': true,
            },
            success: function (result) {
                $('.custom-counter').text(result);
                console.log('response: '+result); // just for testing | TO BE REMOVED
            },
            error: function(error){
                console.log(error); // just for testing | TO BE REMOVED
            }
        });
    });
    </script>
    <?php
    return ob_get_clean(); // Return the buffered code
}

// The wordpress ajax hooked function (for logged in and non logged users)
add_action('wp_ajax_custom_counter', 'ajax_custom_counter');
add_action('wp_ajax_nopriv_custom_counter', 'ajax_custom_counter');
function ajax_custom_counter() {
    if( isset($_POST['custom-counter']) && $_POST['custom-counter'] )
        echo get_option( 'wc-custom-counter' ); // Get option value

    exit();
}

代码进入您的活动子主题（或活动主题）的 function.php 文件中。经过测试并且有效。

Answer 2

您不能从缓存插件中排除功能。相反，您可以排除 URL（在 WP Super Cache 中，转到“设置 > WP Super Cache > 高级”-“接受的文件名和拒绝的 URI”部分）。

因此，使用 AJAX 调用此函数而不是直接调用，您可以排除 AJAX URL。

这是完整的代码。

在主题的functions.php中添加这些：

add_action('wp_ajax_customer_counter', 'customer_counter_ajax_handler'); // wp_ajax_{action}
add_action('wp_ajax_nopriv_customer_counter', 'customer_counter_ajax_handler'); // wp_ajax_nopriv_{action}

function customer_counter_ajax_handler() {      
    // Get custom counter option value
    $counter = get_option( 'wc-custom-counter' );
    echo $counter . ' rub.';
}

用<span class="customer_counter_shortcode"> </span> 替换所有短代码[custom_counter] 实例。

将此脚本添加到主题的footer.php：

jQuery(function($){
    $.ajax({
        url : '<?php echo site_url(); ?>/wp-admin/admin-ajax.php', // AJAX handler
        data : { action : 'customer_counter' },
        type : 'POST',
        success : function( $result ){
            if( $result ) {
                $('.customer_counter_shortcode').html($result);
            }
        }
    });
});

然后您可以排除 AJAX URL - /wp-admin/admin-ajax.php?action=customer_counter。