WordPress nonce 未验证 WooCommerce 购物车操作

Question

我已经构建了一个自定义的 WooCommerce 购物车，您可以在其中使用 AJAX 更改数量和/或从购物车中删除项目，但它有问题，我认为这与 WooCommerce 和 WordPress nonces 的有效性有关。

问题：

当您的购物车中有产品并且您至少刷新页面一次时 - 将产品添加到您的购物车后，它会起作用。

当您第一次访问时，它不起作用，您将产品添加到购物车中并尝试编辑产品的数量，或尝试删除它。

在https://staging.noten.nl/noten/上亲自查看- 请检查您的智能手机。将产品添加到购物车，单击它并更改值（多 250 克/少 250 克/删除产品）

PHP - Nonce 创建

/*
**  Theme scripts
*/
function scripts() {

    // Enqueue scripts
    wp_enqueue_script( 'noten-nl/js', Assets\asset_path('scripts/main.js?v=' . VERSION), ['jquery-core', 'wp-util'], null, true );

    // Localize script
    wp_localize_script( 'noten-nl/js', 'shop', array(
        'url'           => admin_url( 'admin-ajax.php' ),
        'cart_more'     => wp_create_nonce( 'cart-more-nonce' ),
        'cart_less'     => wp_create_nonce( 'cart-less-nonce' ),
        'cart_delete'   => wp_create_nonce( 'cart-delete-nonce' )
    ));

}
add_action( 'wp_enqueue_scripts', __NAMESPACE__ . '\\scripts', 999 );

Javascript（在下面调用cart_more PHP 函数）

/*
**  Edit items in cart
*/
function cartAction(event) {

    // Log
    console.log('cartAction');

    // Variables
    var action = $(event.currentTarget).attr('data-action'),
        product = $('.cart-products-scroll .row.active');

    // Load
    product.children('.cart-row-item-loading').show();

    // AJAX
    wp.ajax.send('cart_' + action, {
        data: {
            nonce:      shop['cart_' + action],
            id:         product.attr('data-product-id'),
            quantity:   product.attr('data-product-quantity'),
            key:        product.attr('data-product-cart-item-key')
        },
        success: function (fragments) {

            // Replace fragments
            $.each(fragments, function (key, value) {
                $(key).replaceWith(value);
            });

        },
        error: function (response) {
            console.log(response);
        }
    });

}

PHP

function cart_more() {

    // Log
    write_log( 'cart_more()' );

    // Variables
    $nonce = isset( $_POST['nonce'] ) ? $_POST['nonce'] : '';
    $product_id = isset( $_POST['id'] ) ? $_POST['id'] : '';
    $product_quantity = isset( $_POST['quantity'] ) ? $_POST['quantity'] : '';

    // Check data
    if ( wp_verify_nonce( $nonce, 'cart-more-nonce' ) && ! empty( $product_id ) && ! empty( $product_quantity ) ) {

        /*
        ** Removed for readability
        */

        // Send success
        wp_send_json_success( $fragments );

    } else {

        // Send error
        wp_send_json_error( ':\'(' );

    }

}
add_action( 'wp_ajax_nopriv_cart_more', __NAMESPACE__ . '\\cart_more' );
add_action( 'wp_ajax_cart_more', __NAMESPACE__ . '\\cart_more' );

题

为什么 nonce 验证只有在向我的购物车添加东西后才能成功？

Answer 1

为了使产品页面可缓存，在创建购物车之前不会创建 WooCommerce 会话。^1,2

WooCommerce 使用一个值覆盖 nonce 参数之一，该值根据是否已创建 WooCommerce 会话而变化。^3,4

当您为没有购物车和会话的新用户创建随机数时，随机数是使用一组输入计算的。当您在将商品添加到购物车后检查 nonce 时，会使用一组不同的输入生成检查值，因为 WooCommerce 会话现在存在。这会导致生成不同的 nonce 值，并且针对旧的 nonce 值的 nonce 检查失败。

一种解决方法是在创建 nonce 之前主动创建 WooCommerce 会话。请注意，这可能会影响您网站的缓存方式。

1. https://github.com/woocommerce/woocommerce/issues/4920#issuecomment-35846419
2. https://mikejolley.com/2013/12/20/problems-with-cart-sessions-and-woocommerce/
3. https://developer.wordpress.org/reference/functions/wp_create_nonce/
4. https://github.com/woocommerce/woocommerce/blob/c16acc6b5104acb0ed082e7df1c63dfd77598459/includes/class-wc-session-handler.php#L224