Shopify /cart/update.js动态设置参数不生效问题排查

核心问题是异步代码执行顺序错误：

• jQuery.getJSON() 属于异步网络请求，你在它之后直接发起 /cart/update.js 的POST请求时，getJSON 的回调函数还没触发，formData.updates 还停留在初始化的空对象 {} 状态
• Shopify的 /cart/update.js 接口收到空的updates参数时，会判定为不需要修改购物车内容，直接返回成功状态，因此请求会进入success回调，但实际没有更新任何商品数量，和你遇到的现象完全吻合。

把更新购物车的AJAX逻辑挪到getJSON的回调内部，确保遍历完购物车商品、组装好formData之后再发起更新请求，参考代码如下：

var formData = { updates: {} };
jQuery.getJSON('/cart.js', function(thisCart, textStatus) { // 获取购物车商品
  $.each(thisCart.items, function(cartIndex, cartElement) {
    if(~cartElement.title.indexOf('Build your own box')) {
      formData.updates[parseInt(cartElement.variant_id)] = 0;
    }
  });
  // 组装完参数后再发起更新请求
  jQuery.ajax({
    type: 'POST',
    url: '/cart/update.js',
    data: formData,
    dataType: 'json',
    success: function(data) {
      console.log('success', data);
    },
    error: function (request, status, error) {
      alert(request.responseText);
    }
  });
});

如果调整执行顺序后问题仍然存在，可以排查以下两点：

• 确认cartElement.title.indexOf('Build your own box')的匹配逻辑是否正确，是否存在大小写、多余空格导致匹配失败，没有把对应variant id写入formData.updates
• 可以在发起AJAX请求前增加一行console.log(formData)，确认提交的参数是否符合预期

内容的提问来源于stack exchange，提问作者Farhan Khan