本教程旨在指导用户如何在woocommerce感谢页面中，利用wordpress的动作钩子（如`wp_footer`），安全有效地获取订单详情，并将其动态注入到javascript跟踪脚本中。通过php代码获取订单id、总金额、商品id和名称等信息，并将其格式化后传递给外部营销或分析系统，确保数据传输的准确性和完整性，避免直接在模板中嵌入复杂逻辑。
理解WooCommerce感谢页的数据流与挑战
在与联盟营销公司或外部分析系统集成时，通常需要在用户完成订单后的“感谢页面”（Thank You Page）上发送订单相关数据。这通常通过嵌入JavaScript代码实现，该代码需要动态获取当前订单的详细信息，如订单号、总金额、商品ID和名称等。
初学者常遇到的挑战是，在WordPress和WooCommerce环境中，直接在页面内容或使用短代码嵌入PHP和JavaScript混合代码，可能无法正确获取到订单上下文，导致PHP变量无法解析或解析错误。这是因为感谢页面在加载时，订单数据需要通过特定的WooCommerce/WordPress查询变量才能被正确识别和访问。
解决方案核心：利用WordPress动作钩子
解决此问题的关键在于使用WordPress的动作钩子（Action Hooks），尤其是在wp_footer或wp_head钩子上执行自定义PHP函数。这些钩子允许我们在页面渲染的不同阶段插入自定义代码，并且在这个阶段，WooCommerce的全局订单对象通常已经可用。
wp_footer钩子通常是更好的选择，因为它将JavaScript代码放置在页面内容的末尾，有助于提高页面加载速度，并确保在脚本执行时DOM元素已基本加载完成。
立即学习“Java免费学习笔记（深入）”；
以下是实现此功能的具体步骤和代码示例。
步骤一：创建并注册自定义PHP函数
我们需要编写一个PHP函数，该函数将负责：
- 检查当前页面是否为WooCommerce的“订单接收”页面（即感谢页）。
- 获取当前订单的ID和完整的WC_Order对象。
- 从WC_Order对象中提取所需的订单详情。
- 将这些详情动态嵌入到JavaScript跟踪脚本中。
- 使用add_action函数将此PHP函数挂载到wp_footer钩子上。
代码示例：
将以下PHP代码添加到您的主题的functions.php文件，或者更推荐使用“Code Snippets”等插件进行管理。
add_action( 'wp_footer', 'embed_marketing_script_with_order_details', 5 );
function embed_marketing_script_with_order_details() {
global $wp;
// 检查当前页面是否为WooCommerce的订单接收页面
if ( isset( $wp->query_vars['order-received'] ) ) :
// 获取订单ID
$order_id = absint( $wp->query_vars['order-received'] );
// 获取WC_Order对象
$order = wc_get_order( $order_id );
// 确保订单对象有效
if ( ! $order ) {
return;
}
// 初始化商品ID和商品名称数组
$product_ids = [];
$product_names = [];
// 遍历订单中的所有商品项
$order_items = $order->get_items();
foreach ( $order_items as $order_item ) {
$product_ids[] = $order_item->get_product_id();
$product_names[] = $order_item->get_name();
}
// 将商品ID和名称数组转换为以 '|' 分隔的字符串
$product_ids_str = implode( '|', $product_ids );
$product_names_str = implode( '|', $product_names );
?>
代码解析：
- add_action( 'wp_footer', 'embed_marketing_script_with_order_details', 5 );：这行代码将我们的自定义函数embed_marketing_script_with_order_details挂载到wp_footer钩子上。5是优先级参数，数字越小优先级越高，确保我们的脚本在其他默认脚本之前加载。
- global $wp;：访问WordPress的全局$wp对象，其中包含当前查询的各种信息。
- if ( isset( $wp->query_vars['order-received'] ) )：这是判断当前页面是否为WooCommerce订单接收页面的关键。order-received是一个查询变量，仅在感谢页面存在。
- $order_id = absint( $wp->query_vars['order-received'] );：安全地获取订单ID。
- $order = wc_get_order( $order_id );：使用WooCommerce提供的函数获取完整的WC_Order对象，通过这个对象我们可以访问订单的所有属性和方法。
- $order->get_order_number();：获取订单的显示编号。
- $order->get_total();：获取订单的总金额。
- $order->get_date_created()->format('Y-m-d H:i:s');：获取订单创建日期和时间，并格式化为指定字符串。
- 处理多个商品： 订单可能包含多个商品。为了将所有商品的ID和名称传递给JavaScript，我们遍历$order->get_items()获取所有商品项，然后将它们的ID和名称分别存入数组。最后，使用implode('|', ...)将数组元素连接成一个以|分隔的字符串。
- esc_js()：这是一个WordPress函数，用于转义字符串，使其在JavaScript中安全使用，防止XSS攻击或JavaScript语法错误。
- JavaScript部分： PHP代码在服务器端执行，动态生成JavaScript代码。oeyaPostParam对象中的值被PHP变量替换。
- 外部脚本加载： (function(){...})() 是一种立即执行函数表达式（IIFE），用于创建独立的作用域，避免变量污染。它动态创建并插入外部跟踪脚本。
注意事项与最佳实践
- 使用Code Snippets插件： 强烈建议使用“Code Snippets”或类似插件来添加上述PHP代码，而不是直接修改主题的functions.php。这样做可以避免在主题更新时丢失代码，并且更容易管理和禁用自定义代码。
- 安全性： 在将PHP变量输出到JavaScript时，始终使用esc_js()或json_encode()等函数进行适当的转义，以防止跨站脚本（XSS）攻击。
-
调试： 如果数据未正确传输，请检查以下几点：
- 浏览器开发者工具： 在感谢页面上打开浏览器的开发者工具（通常是F12），检查“网络”选项卡，确认外部跟踪脚本是否已加载。在“控制台”选项卡中，查看是否有JavaScript错误。
- 页面源代码： 查看感谢页面的页面源代码（右键 -> 查看页面源代码），搜索oeyaPostParam，确认PHP变量是否已被正确替换为订单详情。
- 服务器错误日志： 检查您的Web服务器错误日志，看是否有PHP错误阻止了代码的执行。
- 外部脚本的兼容性： 确保联盟营销公司提供的外部JavaScript跟踪脚本（https://www.conn.tw/track/oeya_jss2s_v1.0.js）与您传递的oeyaPostParam对象结构兼容。
- 钩子选择： wp_footer通常是首选，但如果外部脚本要求在页面头部加载（例如，为了尽早开始跟踪），则可以使用wp_head钩子。
总结
通过利用WordPress的动作钩子和WooCommerce提供的API，我们可以安全、高效地在感谢页面上获取订单详情，并将其动态注入到JavaScript跟踪脚本中。这种方法不仅保证了数据的准确性，也遵循了WordPress的最佳实践，使得代码更易于维护和扩展。正确实施后，您将能够成功地将WooCommerce订单数据传输到联盟营销或其他外部系统中。
