WooCommerce结账页邮箱自动登录后页面不识别问题求助

问题说明 #

需要实现：顾客在WooCommerce结账页面的billing_email字段输入邮箱时，若该邮箱对应已注册客户，系统自动完成登录。当前存在两个问题：

• 自动登录后页面无法即时识别登录状态，需刷新/跳转才生效
• 跳转购物车页面的JS代码无效

原代码 #

PHP代码 #

// Modify the auto_login_guest_user function
add_action('woocommerce_checkout_update_order_review', 'auto_login_guest_user', 10, 1);
function auto_login_guest_user($post_data) {
    if (is_user_logged_in()) {
        return;
    }

    parse_str($post_data, $checkout_data);
    $email = $checkout_data['billing_email'];

    if (email_exists($email)) {
        $user = get_user_by('email', $email);
        if ($user && !user_can($user, 'administrator') && in_array('customer', $user->roles)) {
            // Log the user in.
            wp_set_current_user($user->ID);
            wp_set_auth_cookie($user->ID);
            do_action('wp_login', $user->user_login, $user);

            // Trigger the login event
            $message = '<div class="woocommerce-message">logged_in</div>';
            $woocommerce_messages = array($message);
            add_filter('woocommerce_add_message', function() use ($woocommerce_messages) {
                return $woocommerce_messages;
            });
        }
    }
}

JS代码 #

jQuery(document).ready(function($) {
    // Listen for the checkout update event
    $(document.body).on('updated_checkout', function(e, data) {
        if (data.fragments && data.fragments['.woocommerce-message']) {
            var message = data.fragments['.woocommerce-message'];
            if (message.indexOf('logged_in') > -1) {
                // Redirect to the cart page
                redirectToCartPage();
            }
        }
    });

    // Trigger checkout update when billing email is changed
    $('form.checkout').on('change', 'input#billing_email', function() {
        $(document.body).trigger('update_checkout');
    });

    // Function to redirect to the cart page
    function redirectToCartPage() {
        var cartUrl = '/carrinho-de-cotacao/'; // Change this to the correct cart page URL if needed
        window.location.href = cartUrl;
    }
});

问题原因 #

1. PHP端：woocommerce_checkout_update_order_review钩子的AJAX响应不会主动更新页面的用户状态相关DOM，且通过woocommerce_add_message添加的消息不一定会被包含在AJAX返回的fragments中，导致前端无法捕获登录标识。
2. JS端：change事件仅在输入框失去焦点时触发，无法即时检测邮箱输入；同时依赖data.fragments['.woocommerce-message']判断登录状态不可靠，因为消息可能未被正确传递。

修复方案 #

修改后的PHP代码 #

add_action('woocommerce_checkout_update_order_review', 'auto_login_guest_user', 10, 1);
function auto_login_guest_user($post_data) {
    if (is_user_logged_in()) {
        return;
    }

    parse_str($post_data, $checkout_data);
    $email = sanitize_email($checkout_data['billing_email']);

    if (!empty($email) && email_exists($email)) {
        $user = get_user_by('email', $email);
        if ($user && !user_can($user, 'administrator') && in_array('customer', $user->roles)) {
            // 执行登录操作
            wp_set_current_user($user->ID);
            wp_set_auth_cookie($user->ID, true); // 保持登录状态
            do_action('wp_login', $user->user_login, $user);

            // 添加登录成功标识
            wc_add_notice('auto_login_success', 'success');
        }
    }
}

// 将登录标识注入AJAX响应
add_filter('woocommerce_checkout_update_order_review_response', 'add_login_flag_to_response', 10, 2);
function add_login_flag_to_response($response, $post_data) {
    $notices = wc_get_notices();
    if (!empty($notices['success'])) {
        foreach ($notices['success'] as $notice) {
            if ($notice === 'auto_login_success') {
                $response['auto_logged_in'] = true;
                wc_clear_notices(); // 清除通知避免页面显示
                break;
            }
        }
    }
    return $response;
}

修改后的JS代码 #

jQuery(document).ready(function($) {
    // 即时监听邮箱输入事件
    $('form.checkout').on('input', 'input#billing_email', function() {
        var email = $(this).val().trim();
        // 简单邮箱格式验证，减少无效AJAX请求
        var emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
        if (emailRegex.test(email)) {
            $(document.body).trigger('update_checkout');
        }
    });

    // 监听结账更新完成事件
    $(document.body).on('updated_checkout', function(e, data) {
        // 直接检查响应中的登录标识
        if (data.auto_logged_in) {
            redirectToCartPage();
            // 若无需跳转，仅刷新页面更新登录状态：
            // window.location.reload();
        }
    });

    // 跳转购物车函数
    function redirectToCartPage() {
        var cartUrl = '/carrinho-de-cotacao/';
        window.location.href = cartUrl;
    }
});

修复说明 #

1. PHP端：

   • 新增sanitize_email处理邮箱输入，提升安全性
   • 通过wc_add_notice和自定义钩子将登录标识注入AJAX响应，确保前端可靠获取登录状态
   • wp_set_auth_cookie添加true参数，维持用户登录状态

2. JS端：

   • 替换change事件为input事件，即时响应邮箱输入
   • 添加邮箱格式验证，避免无效输入频繁触发AJAX
   • 直接读取AJAX返回的auto_logged_in标识，无需依赖不可靠的消息片段

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