在 WooCommerce 结帐时将产品详细信息从订单传递到 jQuery/javascript

Posted 2023-05-09

【中文标题】在 WooCommerce 结帐时将产品详细信息从订单传递到 jQuery/javascript

【英文标题】：Passing product details from an order to jQuery/javascript on WooCommerce checkout

【发布时间】：2021-11-30 19:20:22

【问题描述】：

我正在尝试从Woocommerce结账时捕获ProductId和价格，但不能弄清楚为什么不起作用。

我创建了一个钩子，放在functions.php（Astra 主题）中

add_action( 'woocommerce_checkout_order_processed', 'is_express_delivery',  1, 1  );
function is_express_delivery( $order_id )

   $order = new WC_Order( $order_id );
   
   $product = wc_get_product( $order_id );
   
   $productId = $product->get_id(); 
   $price = $product->get_price();
   
   ?>
    <script type="text/javascript">
        var clicky_goal =  id: ""<?php echo $productId ?>"", revenue: ""<?php echo $price ?>"" ;
    </script>
    <?php

基本上，我想在购物车提交上捕获产品和价格，并将其发送到跟踪工具

【问题讨论】：

您使用的钩子包含的不是 1 个而是 3 个参数。 一个订单通常还包含多个产品。所以你想把这个应用到每一个产品上吗？或者你怎么看这个？请澄清您的问题

@7uc1f3r 是的，我想为客户购买的每个产品申请。例如，如果我购买三件商品，我应该为每件商品使用一个循环吗？我猜如果#productid > 1 它是一个数组？

当订单状态更改为“已处理”时，将运行 woocommerce_checkout_order_processed 挂钩。一个更好的可能是实际创建订单时，结帐时：woocommerce_checkout_create_order_line_item。

@dcron 1/2 如果您的问题已经得到答案，我们无意在之后用一个新的/额外的问题来调整您的问题，我们会不得不再次调整我们的答案。而是阅读What should I do when someone answers my question?。确定答案是否有帮助，然后vote 和/或accept 它。

@ dcron 2/2 如果您有新问题，请点击按钮询问。如果有助于提供上下文，请包含指向此问题的链接。”

【参考方案1】：

woocommerce_checkout_order_processed 包含的不是 1 个而是 3 个参数 一个订单通常包含多个产品，因此$product = wc_get_product( $order_id ); 不起作用

使用：How to make Google Chrome JavaScript console persistent? 在控制台日志中查看结果。

所以你得到：

function action_woocommerce_checkout_order_processed( $order_id, $posted_data, $order ) 
    // Initialize
    $product_ids = array();
    $prices = array();
    
    // Loop through order items
    foreach ( $order->get_items() as $item_id => $item ) 
        // Get the WC_Product Object
        $product = $item->get_product();
        
        // Product ID
        $product_id = $item->get_variation_id() > 0 ? $item->get_variation_id() : $item->get_product_id();
        
        // Price
        $product_price = $product->get_price();
        
        // Push to array
        $product_ids[] = $product_id;
        $prices[] = $product_price;
    
    ?>
    <script>
    jQuery(function($) 
        // jQuery variables
        var product_ids = <?php echo json_encode( $product_ids ); ?>;
        var prices = <?php echo json_encode( $prices ); ?>;
        
        // Log
        console.log( product_ids );
        console.log( prices );
    );
    </script>
    <?php

add_action( 'woocommerce_checkout_order_processed', 'action_woocommerce_checkout_order_processed', 10, 3 );

【讨论】：

我可以添加这个功能吗，请检查问题编辑。

@dcron 我的回答显示了如何将产品详细信息传递给 jQuery/javascript。关于跟踪本身，您的问题包含的细节太少，因此我们假设您自己知道解决方案。立即ask clear questions 很重要，这就是我已经表明对您的问题发表评论的原因。

【参考方案2】：

您可以使用woocommerce_checkout_create_order_line_item 挂钩。它在创建订单时针对每个订单项目运行。

如果您使用变体，您可能还需要该 ID。

add_action('woocommerce_checkout_create_order_line_item', 'is_express_delivery',  1, 4);
function is_express_delivery($item, $cartItemKey, $values, $order)

    $itemDetails = [
        'productId' => $item->get_product_id(),
        'variationId' => $item->get_variation_id(),
        'itemPrice' => $item->get_total(),
        'itemQuantity' => $item->get_quantity(),
        'itemTotal' => $item->get_total() * $item->get_quantity(),
    ];

    // your work with this array

代码已经过测试并且可以工作 - 将它放在您的子主题的 function.php 文件中。