WooCommerce：为什么以及如何禁用 Ajax 购物车片段

已发表: 2019-07-22

如果您在这里，那是因为您的 WooCommerce 网站速度很慢，并且您想知道为什么“ /?wc-ajax=get_refreshed_fragments ” URL 会产生延迟和服务器负载（峰值）。

此外，关于 WooCommerce Ajax 购物车片段（包括特定插件和性能插件选项）的在线文献太多，您想在了解是否以及如何禁用它们之前快速了解它们是什么。

像 Pingdom 和 GTMetrix 这样的性能优化工具经常将责任归咎于这个小小的 WooCommerce 功能。仔细禁用它可以提高速度、页面加载和最终的销售转化率。

这就是你需要知道的一切。

什么是 WooCommerce Ajax 购物车片段？
为什么禁用 WooCommerce Ajax 购物车片段？
如何禁用 WooCommerce Ajax 购物车片段？
最后的想法：WooCommerce Ajax 购物车片段是或否？

什么是 WooCommerce Ajax 购物车片段？

但首先，对于那些不知道的人：什么是 Ajax ？

在 Web 开发中，Ajax（ AJAX = Asynchronous JavaScript And XML ）是一种 Web 开发技术，简而言之，它允许您在不刷新网站页面的情况下运行功能。

想想 WooCommerce 商店页面上的“Ajax 添加到购物车”：您可以将产品添加到购物车（并更新购物车），而无需强制重新加载页面； Ajax 在后台运行并与服务器“异步”通信。

现在这很清楚了，让我们弄清楚WooCommerce Ajax 购物车片段是什么以及 URL“ yoursite.com/?wc-ajax=get_refreshed_fragments ”代表什么。

启用 Ajax 添加到购物车时，WooCommerce 商店页面上的 Ajax 购物车更新。购物车小部件刷新而不强制页面重新加载/重定向。

长话短说，即使在小型网站上，甚至在非 WooCommerce 页面上，WooCommerce 也会尝试“获取”购物车详细信息，以便每次完成（或未完成！）在给定的 WordPress 页面上。

这允许 WooCommerce 保持 Cart 小部件的更新，并立即“监听”任何可能需要 Cart update 的 Ajax Add to Cart 事件。

基本上，WooCommerce 调用“ /?wc-ajax=get_refreshed_fragments ”来异步更新购物车项目和购物车总数，即无需刷新您正在访问的网站页面。

Ajax 非常棒，但不要低估这个小功能可能导致的性能影响和插件冲突。这将我们带到下一部分……

为什么禁用 WooCommerce Ajax 购物车片段？

为了在您网站的每个页面上更新购物车，WooCommerce 每次都运行此 Ajax 功能。

即使在“关于”页面上。如果您没有产品，即使在主页上。如果您只有一个联系表，即使在“联系”页面上也是如此。

如果您的主题不提供 WooCommerce 购物车下拉小部件，并且您没有可以在特定网站页面上添加到购物车的产品，那么您最好删除整个 Ajax 功能。

更重要的是，如果您在将任何产品添加到购物车后从 WooCommerce 设置中选择将用户重定向到购物车，那么您肯定会强制页面重定向（到购物车页面），因此激活 Ajax 购物车片段是毫无意义的。

在 WooCommerce > 设置 > 产品 > 常规下，建议禁用 Ajax 添加到购物车行为，并在可能的情况下启用重定向到购物车页面。这将始终强制页面重新加载（和/或重定向），因此将为用户节省在旅途中更新购物车所需的 Ajax 调用。

理想情况下，“ /?wc-ajax=get_refreshed_fragments ”应该运行的唯一地方是页面和 WooCommerce 档案，您的客户可以在其中添加到购物车并且您想使用动态购物车小部件

例如，如果您的类别页面上有添加到购物车按钮，并且您希望购物车小部件在不重新加载页面的情况下相应更新（并且您启用了 Ajax 添加到购物车），那么您需要“ /?wc-ajax=get_refreshed_fragments ”积极的。

此外，在购物车页面上，您可以在不刷新页面的情况下更改数量或删除商品，并且您还希望购物车小部件相应地更新（但这里真正的问题是：为什么购物车页面上有购物车小部件没有意义吗？ ）。因此，在购物车页面上，您还需要激活“/?wc-ajax=get_refreshed_fragments” ，否则如果您更新购物车，小部件将不会刷新。

结论：

如果您的主题没有动态标题购物车小部件，您可以禁用“/?wc-ajax=get_refreshed_fragments”
如果您的主题有一个动态标题 Cart 小部件，但您不关心在旅途中显示 Cart 小部件内容，您可以在任何地方禁用“/?wc-ajax=get_refreshed_fragments”
如果要保持购物车小部件功能处于活动状态，则应仅在没有 Ajax 添加到购物车功能（WooCommerce 产品档案）或购物车更新功能（购物车页面）的页面上禁用“/?wc-ajax=get_refreshed_fragments”

如何禁用 WooCommerce Ajax 购物车片段？

现在我们了解了购物车片段是什么以及为什么/何时应该删除它们，我们可以进行一些编码。

当然，有一些插件可以做到这一点——但是当你可以用几行 PHP 实现这样的功能时，即使你不知道如何编码，寻找不同的解决方案也是没有意义的。

但首先，让我们看看 WooCommerce 如何添加此 Ajax 调用（在开发术语中，我们会说“它如何将这个脚本排入队列”）。

首先，脚本“ wc-cart-fragments ”由名为“register_scripts()”的函数描述。它从 /assets 文件夹调用一个 JS 脚本，并且需要启用 JQuery 和 cookie：

'wc-cart-fragments' => array(
	'src'     => self::get_asset_url( 'assets/js/frontend/cart-fragments' . $suffix . '.js' ),
	'deps'    => array( 'jquery', 'js-cookie' ),
	'version' => WC_VERSION,
),

在同一个文件中，这是调用“ wc-cart-fragments ”的时间：

self::enqueue_script( 'wc-cart-fragments' );

如果我们查看“enqueue_script()”函数，我们会发现我们的“ wc-cart-fragments ”脚本首先被注册，然后按照 WordPress 文档（https://developer.wordpress.org/reference/函数/wp_enqueue_script）：

private static function enqueue_script( $handle, $path = '', $deps = array( 'jquery' ), $version = WC_VERSION, $in_footer = true ) {
	if ( ! in_array( $handle, self::$scripts, true ) && $path ) {
		self::register_script( $handle, $path, $deps, $version, $in_footer );
	}
	wp_enqueue_script( $handle );
}

如果某些东西“入队”，那么它可以“出队” （类似于 add_action() 和 remove_action() PHP 函数）。

您必须确保在“入队”之后调用“出队”函数，以便它已经被添加并且您可以将其删除（因此优先级 = 11，因为“wc-cart-fragments”在默认优先级下排队10）。

Tl;博士：

/**
 * @snippet       Disable WooCommerce Ajax Cart Fragments Everywhere
 * @how-to        Get CustomizeWoo.com FREE
 * @author        Rodolfo Melogli
 * @compatible    WooCommerce 3.6.4
 * @donate $9     https://businessbloomer.com/bloomer-armada/
 */

add_action( 'wp_enqueue_scripts', 'bbloomer_disable_woocommerce_cart_fragments', 11 ); 

function bbloomer_disable_woocommerce_cart_fragments() { 
	wp_dequeue_script( 'wc-cart-fragments' ); 
}

请注意，如果您有一个标题购物车小部件，这将破坏“下拉购物车”。 您仍然可以在标题中看到商品数量和购物车总数，但在悬停时您将看不到商品和购物车/结帐按钮。

在 Business Bloomer 上，我完全禁用了购物车小部件，因此使用此功能很有意义。

如果您只想优化您的主页并将“wc-cart-fragments”留在其他网站页面上，您可以使用此代码段：

/**
 * @snippet       Disable WooCommerce Ajax Cart Fragments On Static Homepage
 * @how-to        Get CustomizeWoo.com FREE
 * @author        Rodolfo Melogli
 * @compatible    WooCommerce 3.6.4
 * @donate $9     https://businessbloomer.com/bloomer-armada/
 */

add_action( 'wp_enqueue_scripts', 'bbloomer_disable_woocommerce_cart_fragments', 11 ); 

function bbloomer_disable_woocommerce_cart_fragments() { 
	if ( is_front_page() ) wp_dequeue_script( 'wc-cart-fragments' ); 
}

最后的想法：WooCommerce Ajax 购物车片段是或否？

我们已经看到，禁用 Ajax 购物车片段“可以”提高网站速度，但也“可能”导致一些问题，主要是如果您想继续使用下拉购物车小部件。

因此，在本节中，我想看看其他人对“/?wc-ajax=get_refreshed_fragments”的发现。

它真的给你带来的好处多于坏处吗？它真的可以提高您的网站页面速度吗？禁用购物车片段是否值得？

剧透警报：这取决于。

CommerceGurus 的 Colm Troy深入测试了 Ajax 购物车片段（以及您应该在他的文章中阅读的其他内容：https://www.commercegurus.com/guides/speed-up-woocommerce/），并且在他的指南中，他发现那：

…“/?wc-ajax=get_refreshed_fragments”请求时间为 448 毫秒，这是迄今为止我们最慢的 http 请求。

在一些速度较慢的服务器上，数据库较大且优化不佳，执行此请求通常需要 1-2 秒以上。
好消息是这个请求是非阻塞的，并且在 DOM 加载后执行得很好，所以一般来说它不会影响我们感知的加载时间（但肯定会影响我们的完全加载时间，并且可能会影响 GPSI 担心的一些事情，比如时间到交互式和第一个 CPU 空闲）。

他最近还告诉我：

我得出的结论是，WooCommerce 新手通常最终会破坏他们的网站，因为他们没有完全考虑到购物车小部件可能出现的所有不同场景，因此绝对要谨慎行事。
在负载峰值和大量流量的 WooCommerce 商店中，我们做的第一件事是将购物车片段出列，删除购物车小部件，并让客户在添加到购物车后被重定向到购物车。
让事情变得美好、简单和快速

想要继续对话吗？在评论中分享您的反馈、测试和意见