如何在WooCommerce中检测结账区块类型并按需加载支付脚本

你可以通过WooCommerce内置工具和WordPress区块检测能力来区分两种结账方式：

代码实现 #

// 判断是否使用WooCommerce结账短码
function is_using_woocommerce_checkout_shortcode() {
    if ( ! is_checkout() ) return false;
    
    global $post;
    return $post && has_shortcode( $post->post_content, 'woocommerce_checkout' );
}

// 判断是否为Blocks架构的结账页面（包含classic_checkout区块）
function is_using_checkout_blocks() {
    return class_exists( 'WC_Blocks_Utils' ) 
        && method_exists( 'WC_Blocks_Utils', 'is_checkout_block_page' )
        && WC_Blocks_Utils::is_checkout_block_page();
}

// 精准判断是否使用classic_checkout区块
function is_using_classic_checkout_block() {
    if ( ! is_using_checkout_blocks() ) return false;
    
    global $post;
    return $post && has_block( 'woocommerce/classic-checkout' );
}

说明 #

• is_using_woocommerce_checkout_shortcode()：仅在结账页生效，通过has_shortcode检测页面内容中的短码
• WC_Blocks_Utils::is_checkout_block_page()：WooCommerce Blocks官方提供的方法，判断当前是否为区块化结账页面
• has_block('woocommerce/classic-checkout')：WordPress内置函数，精准检测页面是否包含指定区块

在wp_enqueue_scripts钩子中结合上述判断函数，即可实现脚本的条件加载：

代码实现 #

add_action( 'wp_enqueue_scripts', 'enqueue_checkout_script_conditionally' );
function enqueue_checkout_script_conditionally() {
    // 仅在结账页面执行逻辑
    if ( ! is_checkout() ) return;

    // 仅在classic_checkout区块页面加载对应支付网关脚本
    if ( is_using_classic_checkout_block() ) {
        wp_enqueue_script(
            'classic-checkout-gateway-script',
            get_template_directory_uri() . '/js/classic-checkout-gateway.js',
            array( 'jquery', 'wc-blocks-checkout' ), // 可依赖WooCommerce Blocks核心脚本
            '1.0.0',
            true // 放在页脚加载
        );
    }

    // 可选：针对短码结账页面加载适配脚本
    if ( is_using_woocommerce_checkout_shortcode() ) {
        wp_enqueue_script(
            'shortcode-checkout-gateway-script',
            get_template_directory_uri() . '/js/shortcode-checkout-gateway.js',
            array( 'jquery', 'woocommerce' ),
            '1.0.0',
            true
        );
    }
}

说明 #

• 先通过is_checkout()限定只在结账页处理脚本加载逻辑
• 调用is_using_classic_checkout_block()判断是否为目标页面，再加载对应的支付网关脚本
• 可按需添加短码结账页面的脚本加载逻辑，实现不同结账场景的差异化处理

内容的提问来源于stack exchange，提问作者wls261552