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

【问题标题】：Passing product details from an order to jQuery/javascript on WooCommerce checkout在 WooCommerce 结帐时将产品详细信息从订单传递到 jQuery/javascript
【发布时间】：2023-03-07 19:51:01
【问题描述】：

我正在尝试从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 如果您有新问题，请点击按钮询问。如果有助于提供上下文，请包含指向此问题的链接。”

标签： jquery wordpress woocommerce checkout orders

【解决方案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 文件中。

【讨论】：