不要从移动客户端持续调用更新API的最佳实践

Question

我有点困惑如何是实现我的应用程序的此功能的最佳方式：用户有一个购物车，可以添加或删除他想要扔掉步进器（+ 和 - 按钮）的物品数量。

购物车也保存在后端，因此每次按下步进器（截至目前）都会调用后端的更新 API。

这意味着如果用户快速按下 30 次，API 就会被调用 30 次。这将是我的代码示例（我正在为我的移动应用程序使用 React Native）：

const cartStore = useObservable(() => {
   cart: [],
   id: undefined,
   addItem(item) {
      cart.push(item);
      this.updateDynamoCart();
   },
   updateDynamoCart(
     if(!this.id) {
         createCart();
     }
     updateCart(this.cart);
   }
});

我觉得提到它在商店中，并且我正在将 aws-cli 与 Dynamo 一起使用（调用 APP Sync API 可能对解决这个问题很有用

所以基本上：

• 我在本地存储购物车值
• 每次更新本地购物车时更新数据库中的购物车

我知道采用这种方法我会遇到这些问题：

• 如果某个调用出错，我的本地购物车可能与数据库不一致
• 我用无用的 API 调用轰炸我的客户（我认为“无用”）

我想到了一些其他方法，但在我看来它们给用户带来了更大的问题。例如：

从 APPSync API 响应更新购物车:

• 向用户显示的购物车在用户交互中更新得很晚

基于订阅的更新

• 即使我还不完全了解订阅 GraphQL 查询，我仍然认为它会引入用户交互的延迟

我想从用户交互中设置 3 秒的超时，并在超时到期后进行更新（不会被其他交互覆盖）将解决“数千个调用”，但我不确定这是最佳实践。

有人能指出我正确的方向吗？谷歌搜索好像没找到

PS：我什至不确定标签是否合适，因为我不知道问题必须在哪里解决

Answer 1

首先我要感谢你提出这个问题，这个问题对其他人也很有用，

嗯，每当我们制作电子商务应用程序时，就会出现这个问题。如果我们使用 api 管理购物车。

我有一个方法可以减少 API 调用。

首先我们需要添加到添加到购物车按钮而不是产品详细信息屏幕中的计数器（当用户按下“添加到购物车”时，我们将调用 API 并且 1 件商品已添加到购物车。）

第二 在购物车屏幕中，我们将显示下拉列表而不是增量计数器，如果用户想要更新数量，那么他将从下拉列表中选择新数量，例如（0（删除）、1、2、3、4、5 和其他），如果用户选择其他，那么我们将显示手动输入以添加数量