Je travaille récemment avec WooCommerce et je me demandais s'il était possible d'obtenir des objets de panier via JavaScript ou JQuery

Je sais que vous pouvez utiliser des fonctions PHP pour récupérer le contenu du panier, mais je n'ai actuellement pas accès au backend du site.

J'ai trouvé une question similaire ici: wooCommerce cookies et Sessions - Obtenez les produits actuels dans le panier

Dans la session, il existe un wc_fragment qui contient le code HTML du panier.


{"div.widget_shopping_cart_content":"<div class=\"widget_shopping_cart_content\">\n\n\t<ul class=\"woocommerce-mini-cart cart_list product_list_widget \">\n\t\t\t\t\t\t<li class=\"woocommerce-mini-cart-item mini_cart_item\">\n\t\t\t\t\t<a href=\"https://shop.co.uk/basket/?remove_item=5a48ab5b7a7d18cb26168d874821d031&#038;_wpnonce=3bccfbac25\" class=\"remove remove_from_cart_button\" aria-label=\"Remove this item\" data-product_id=\"12765\" data-cart_item_key=\"5a48ab5b7a7d18cb26168d874821d031\" data-product_sku=\"\">&times;</a>\t\t\t\t\t\t\t\t\t\t\t<a href=\"https://shop.co.uk/product/?attribute_pa_quantity=1-drink\">\n\t\t\t\t\t\t\t<img width=\"800\" height=\"450\" src=\"https://cdn2.co.uk/app/uploads/Overlapped-800x450.jpg\" class=\"attachment-woocommerce_thumbnail size-woocommerce_thumbnail\" alt=\"\" />Raspberry Drinking Yogurt - 1 drink\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"quantity\">1 &times; <span class=\"woocommerce-Price-amount amount\"><span class=\"woocommerce-Price-currencySymbol\">&pound;</span>1.50</span></span>\t\t\t\t</li>\n\t\t\t\t\t</ul>\n\n\t<p class=\"woocommerce-mini-cart__total total\">\n\t\t<strong>Subtotal:</strong> <span class=\"woocommerce-Price-amount amount\"><span class=\"woocommerce-Price-currencySymbol\">&pound;</span>1.50</span>\t</p>\n\n\t\n\t<p class=\"woocommerce-mini-cart__buttons buttons\"><a href=\"https://shop.co.uk/basket/\" class=\"button wc-forward\">View basket</a><a href=\"https://shop.co.uk/checkout/\" class=\"button checkout wc-forward\">Checkout</a></p>\n\n\t\n\n</div>"}

Serait-il possible d'extraire les éléments de cela?

2
Jesse Orange 6 mai 2021 à 21:49

1 réponse

Meilleure réponse

J'ai trouvé une solution pour vous. Peut-être qu'il y a un meilleur mais comment je le ferais.

Créez d'abord un fichier JS personnalisé et enregistrez-le. Ajoutez également un ajaxurl personnalisé (au cas où vous ne l'avez pas déjà fait):

add_action( 'wp_enqueue_scripts', 'wp_enqueue_scripts_action' );
function wp_enqueue_scripts_action() {
    wp_register_script( 'child-theme', get_stylesheet_directory_uri() . '/assets/child.js', [ 'jquery' ] );
    wp_enqueue_script( 'child-theme' );

    wp_localize_script( 'child-theme', 'child_theme', [
            'ajaxurl' => admin_url( 'admin-ajax.php' )
        ]
    );
}

Ajoutez maintenant un point final Ajax:

add_action( 'wp_ajax_get_cart_items', 'wp_ajax_get_cart_items_action' );
add_action( 'wp_ajax_nopriv_get_cart_items', 'wp_ajax_get_cart_items_action' );
function wp_ajax_get_cart_items_action() {
    $cart = WC()->cart;

    if ( $cart ) {
        wp_send_json_success( $cart->get_cart_contents() );
        /** @noinspection ForgottenDebugOutputInspection */
        wp_die();
    }
}

Cela retournera le contenu du chariot au cas où un chariot est disponible. Appelez-le maintenant dans votre fonction JS. Dans mon cas pour tester directement la méthode document.ready:

(function ( $ ) {
    $( document ).ready( function () {
        let data = {
            action: 'get_cart_items'
        };

        $.post( child_theme.ajaxurl, data, function () {
        } ).done( function ( response ) {
            console.log( response );
        } ).fail( function ( response ) {
            console.log( 'Fail' );
        } );
    } );
})( jQuery );

Cela reviendra par exemple:

077E29B11BE80AB57E1A2ECABB7DA330: {KEY: "077E29B11BE80AB57E1A2ECABB7DA330", produit_ID: 249, variante_id: 0, variation: tableau (0), Quantité: 1, ...}

Je pense que vous devez ajouter des chèques nuls mais tout dans toute sa solution de travail.

2
Mr. Jo 6 mai 2021 à 20:33