如何在 Next.js API 路线中访问 Fauna 的 "after" 游标

Question

我正在使用 Next.Js 和 Fauna 构建一个应用程序，当用户访问 /accounts 路由时，它会获取 Next.js API 路由 /api/fauna/accounts向 Fauna 查询以获取用户拥有的所有帐户，然后 returns 响应页面并将数据呈现在 table.

中

Fetch inside /accounts 看起来像这样：

function Accounts() {
  const [data, setData] = useState(null)

  useEffect(() => {
    fetch('api/accounts')
      .then((res) => res.json())
      .then((data) => {
        setData(data)
      })
  }, [])


  return (
    <Table>
      {...data}
    </Table>
  )
}

/api/fauna/accounts returns 内的响应用于分页的“之后”光标。这是 /api/fauna/accounts

中服务器上的响应

{
  after: [
    Time("2022-03-08T15:59:43.284410Z"),
    Ref(Collection("accounts"), "325579003214692417"),
    Ref(Collection("accounts"), "325579003214692417")
  ],
  data: [...]
}

然而，当该响应被发送回 /accounts 路由时，“after”光标的格式与服务器上的完全不同，这使得难以分页。 “之后”光标的响应如下所示：

{
  after: [
    { "@ts": "2022-03-08T15:49:23.686204Z" },
    {
      "@ref": {
        id: "325578353522245700",
        collection: { "@ref": { id: "accounts", collection: { "@ref": { id: "collections" } } } }
      }
    },
    {
      "@ref": {
        id: "325578353522245700",
        collection: { "@ref": { id: "accounts", collection: { "@ref": { id: "collections" } } } }
      }
    }
  ],
  data: [...]
}

当“after”光标像这样格式化时，如何分页到下一页？

Answer 1

您看到的格式是 Fauna 的有线协议。 JSON 不处理像引用这样的嵌入式对象（以及其他复杂的响应值），因此这些对象以 round-tripped.

的方式序列化

JavaScript 驱动程序包含一个名为 _json.js 的实用程序库，它可以负责重构原始光标值：

const faunadb = require('faunadb')
const json = require('faunadb/src/_json')
const q = faunadb.query

// assuming response contains the wire protocol data from a pagination query
const deserialized = json.parseJSON(response)

// then you can include the `after` field in a subsequent query
const response2 = client.query(
  q.Paginate(
    q.Match(q.Index("your_index"), [<terms>]),
    {
      after: deserialized.after
    }
  )
)
.then(res => console.log(res))
.catch(err => console.err("Error:", err))

如何在 Next.js API 路线中访问 Fauna 的 "after" 游标

How access Fauna's "after" cursors in Next.js API routes

pagination

next.js

faunadb