How to implement Cursor-Based Pagination in GraphQL?

Q: How to implement Cursor-Based Pagination in GraphQL?

type Query { posts(first: Int, after: String): PostConnection } type PostConnection { edges: [PostEdge] pageInfo: PageInfo } type PostEdge { node: Post cursor: String } type PageInfo { hasNextPage: Boolean endCursor: String } type Post { id: ID! title: String! content: String! } const resolvers = { Query: { posts: async (_, { first, after }, context) => { const query = after ? { _id: { $gt: context.db.ObjectId(after) } } : {}; const posts = await context.db.collection("posts") .find(query) .limit(first) .toArray(); const edges = posts.map((post) => ({ node: post, cursor: post._id.toString(), })); return { edges, pageInfo: { hasNextPage: posts.length === first, endCursor: posts.length > 0 ? posts[posts.length - 1]._id.toString() : null, }, }; }, }, }; query { posts(first: 5, after: "642f1a2bd84e0b347cfa2e9f") { edges { node { id title } cursor } pageInfo { hasNextPage endCursor } } }

Difficulty: 6/10

cursor encoding, relay pagination spec, keyset pagination

This approach uses a to keep track of the current position in the dataset and fetch the next set of results. It is more efficient for large datasets as it avoids the operation. Better suited for real-time applications where data changes frequently.

Schema Definition:

Resolver:

Query Example:

Scenario Questions

0-2 years experience

1We have a GraphQL query `posts(first: 10, after: $cursor)`. How would you implement the resolver to return the next page of posts?
2If a client sends a malformed base64 cursor, what response should your server give and how would you detect it in code?

2-5 years experience

1After adding a new filter argument to the posts connection, the pagination started returning duplicate items. What could be causing this and how would you fix it?

Follow-up Questions