查询 Facebook Graph API 时如何找出我在最后一页？

Question

作为一个练习，我正在编写简单的（并且尽可能无状态）客户端应用程序（在 React 中），在单个 Facebook 实体的提要中显示帖子。应用程序从 Facebook Graph API 获取数据。

我使用 Facebook JS SDK 查询以下网址：/<entity-id>/feed?limit=20&fields=...

我有简单的分页按钮（“上一个”和“下一个”），它们分别查询在 response.paging.previous 和 response.paging.next 的 API 响应中收到的分页 URL。

问题是我不知道如何确定我是否在最后一页才能正确禁用“下一步”按钮。

我尝试了几件事，但我仍然没有得到我想要的。

选项 1：允许点击“下一步”直到没有更多响应数据

• response.data.length == 0 时按钮被禁用。

• paging 对象包含next URL，即使没有更多数据要接收，所以在进入没有数据的页面之前我无法检查它。

• 问题是当我到达那个页面时，response 中也没有包含paging 对象。因此，我无法使用“上一页”按钮返回到最后一页的数据。

选项 2：允许点击“下一步”直到我收到的数据少于查询限制

• response.data.length < limit 时按钮被禁用。

• 适用于 data.length % limit != 0 的集合。

• 问题是在相反的情况下，例如当集合中有 40 个对象并且我在第二页上，限制为 20，我仍然可以单击“下一步”，但我最终在页面上没有更多对象，如选项 1 中所述。

选项 3：记住上次请求的 URL

• 最后一个请求的 URL 存储在变量中，即使 response 中没有 paging 数据，“上一个”按钮也可以工作。

• 只解决“你不能回去”的问题。

• 不能解决正确禁用“下一步”按钮的问题。仍然可以在最后一页有数据的情况下点击“下一步”，进入没有数据的空白页面。

所以问题是：

我怎样才能知道我已经收到了收藏中的最后一件物品，然后点击“下一步”我会进入无效的空白页面？

• Graph API 甚至在集合的开头/结尾都提供了response.paging URL，这对我来说似乎很奇怪。

1234563即使没有“上一个”和“下一个”数据。

• 查询这些 URL 会导致 response 带有空的 data 数组并且没有 paging 对象，因此我无法返回无状态应用程序。

• 如果收集开始时没有paging.previous，收集结束时没有paging.next不是更好吗？

Answer 1

对于任何看到这一点的人 - 这实际上是可行的。我不确定 Graph 分页对象以前是否总是返回上一个和下一个，或者 OP 是否在任何地方都犯了错误。但是，我可以确认，当数据能够按照您的预期前进或后退时，它将正确返回上一个/下一个。

以下示例来自 Graph API 分页文档，并显示了作为集合第一页的结果集。

"data": [
       *data returned*
],
"paging": {
  "cursors": {
    "before": "WTI5dGJXVnVkRjlqZAFhKemIzSTZANVGd3T1Rrek9UZAzROVGN3TlRNNE5Eb3hOVEV6TURnM09UTTIZD",
    "after": "WTI5dGJXVnVkRjlqZAFhKemIzSTZANVGd4TURBd09UazROVFk1T0RNM05Eb3hOVEV6TURreU5qQXoZD"
  },
  "next": "https://graph.intern.facebook.com/v2.11/1809938745705498/comments?access_token=valid_token_goes_here"
}

请注意对象中没有“previous”属性。仅仅检查下一个或上一个是否存在就足以让我继续禁用/隐藏按钮。

Answer 2

通过 Graph API 基于游标的分页。 https://developers.facebook.com/docs/graph-api/using-graph-api#cursors

没有开箱即用的匹配方法可以随心所欲地进行。 您应该管理左侧记录和下一个按钮，与 Graph API 分页分开。 作为解决方案，除了当前页面外，还可以预加载下一页。

保存前一个光标也是不好的做法： “不要存储游标。如果添加或删除项目，游标很快就会失效。”