在 WooCommerce 上监控 JQuery 发出的所有 AJAX 请求答案

【问题标题】：Monitoring all AJAX requests made by JQuery on WooCommerce在 WooCommerce 上监控 JQuery 发出的所有 AJAX 请求
【发布时间】：2021-05-13 20:57:54
【问题描述】：

有没有办法监控在 WooCommerce 上使用 JQuery 发出的所有 Ajax 请求？

我正在尝试检测 WooCommerce 购物车页面上的哪个 Ajax 事件有时会在我的 WordPress 网站上导致无限循环。

【问题讨论】：

标签： javascript jquery ajax wordpress woocommerce

【解决方案1】：

你可以试试jquery本身提供的ajaxstart事件。每当 Jquery 发送任何 ajax 请求时都会触发此事件。

$( document ).ajaxStart(function() {
  $( "#loading" ).show();
});

#希望对你有帮助，谢谢。

【讨论】：

【解决方案2】：

你可以使用：

ajaxSend() 附加一个要在发送 Ajax 请求之前执行的函数，
ajaxComplete() 注册一个在 Ajax 请求完成时调用的处理程序。

两者都提供了与在浏览器 Javascript 控制台中的可读 XHR 对象上触发的 Ajax 事件相关的详细信息。

这是一个显示 Ajax 触发请求详细信息的代码示例：

add_action( 'wp_footer', 'monitor_jquery_ajax_requests' );
function monitor_jquery_ajax_requests() {
    ?>
    <script>
    jQuery(document).ajaxSend( function( event, xhr, options ) {
        console.log('------- ' + event.type + ' -------');
        console.log(xhr);
        console.log('------------------------');
    }).ajaxComplete( function( event, xhr, options ) {
        console.log('----- ' + event.type + ' -----');
        console.log(xhr);
        console.log('----------------------------');
    });
    </script>
    <?php
}

代码位于活动子主题（或活动主题）的functions.php 文件中。经过测试并且可以工作。

例如，在结帐页面加载后，您将获得如下信息：

【讨论】：