求助：WooCommerce中通过AJAX添加商品至购物车后实现自定义URL重定向

Hey，我懂你现在的头疼——折腾了好多种方法，想在WooCommerce用AJAX加购特定商品后跳转到自定义URL，但要么就是页面刷新一下完事，根本跳不到目标页面对吧？其实问题出在只改后端没用，前端得配合处理AJAX的返回数据，我给你一套完整的解决办法：

一、后端代码（处理AJAX返回的跳转指令） #

先把你原来的代码优化一下，让它返回明确的跳转标识和URL，替换掉你主题或者子主题functions.php里的对应代码：

add_action('woocommerce_ajax_added_to_cart', 'm_custom_redirect');
function m_custom_redirect( $product_id ) {
    // 替换成你需要触发重定向的目标商品ID
    if ( $product_id == 9904 ) {
        // 自定义跳转URL，可以用get_permalink获取页面链接，也可以直接写完整URL
        $custom_redirect_url = get_permalink(3751);
        
        // 返回带跳转指令的JSON数据，这里把标识设为redirect更直观
        wp_send_json( array( 
            'redirect' => true, 
            'url' => $custom_redirect_url 
        ) );
        exit;
    }
}

二、前端代码（监听AJAX返回并执行跳转） #

WooCommerce默认的AJAX加购逻辑不会自动处理你后端返回的跳转指令，所以我们得加一段JS来监听AJAX请求的结果，一旦拿到跳转指令就直接跳转到目标URL。

你可以把这段代码加到主题的functions.php里（用wp_enqueue_script的方式），或者直接放到主题的footer.php里（放在</body>标签前）：

jQuery(document).ready(function($) {
    // 监听AJAX请求完成事件，专门处理加购的请求
    $(document).ajaxComplete(function(event, xhr, settings) {
        // 判断是不是加购的AJAX请求
        if (settings.data && settings.data.indexOf('action=add_to_cart') !== -1) {
            try {
                // 解析后端返回的JSON数据
                var response = JSON.parse(xhr.responseText);
                // 如果有跳转指令，直接跳转到目标URL
                if (response.redirect && response.url) {
                    window.location.href = response.url;
                }
            } catch(e) {
                // 如果返回的不是JSON，忽略即可
                return;
            }
        }
    });
});

为什么之前的代码没效果？ #

你之前的代码只在后端返回了JSON数据，但WooCommerce前端默认的AJAX加购回调根本没处理这个返回值——它默认只会更新购物车碎片、显示加购成功提示，不会去读取你返回的跳转指令，所以页面才会只是刷新，没实现跳转。现在加上前端的监听逻辑，就能捕获到后端的跳转指令并执行跳转了。

额外注意事项 #

• 确保你的商品是AJAX加购模式：简单产品默认开启AJAX加购，可变产品需要在WooCommerce设置里开启“启用AJAX添加到购物车按钮（存档页面）”
• 测试前清空浏览器缓存，避免旧的JS/CSS代码干扰
• 建议把代码加到子主题里，防止主题更新后代码丢失

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