Context-based authentication in GraphQL - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to define a GraphQL query that fetches the current user's ID.

GraphQL

query { currentUser { [1] } }

Drag options to blanks, or click blank then click option'

Aemail

Bpassword

Cid

Dtoken

Attempts:

3 left

💡 Hint

Common Mistakes

Using sensitive fields like password or token in the query.

Selecting fields that do not identify the user uniquely.

The id field uniquely identifies the current user, which is essential for context-based authentication.

2fill in blank

medium

Complete the code to add a context argument to the resolver function signature.

GraphQL

const resolver = (parent, args, [1]) => { /* authentication logic */ }

Drag options to blanks, or click blank then click option'

Ainfo

Bcontext

Cparams

Droot

Attempts:

3 left

💡 Hint

Common Mistakes

Using info instead of context for authentication data.

Omitting the context argument entirely.

The context argument provides authentication info and user data to the resolver.

3fill in blank

hard

Fix the error in the authentication check inside the resolver.

GraphQL

if (![1].user) { throw new Error('Not authenticated'); }

Drag options to blanks, or click blank then click option'

Acontext

Bparent

Cargs

Dinfo

Attempts:

3 left

💡 Hint

Common Mistakes

Checking args.user instead of context.user.

Using parent or info for authentication data.

The context object holds the user info needed to check authentication.

4fill in blank

hard

Fill both blanks to create a context object that includes the authenticated user and request headers.

GraphQL

const context = ({ [1] }) => { return { user: getUser([2].headers.authorization) }; };

Drag options to blanks, or click blank then click option'

Areq

Bres

Crequest

Dresponse

Attempts:

3 left

💡 Hint

Common Mistakes

Using res or response instead of req.

Not accessing the authorization header correctly.

The req object contains HTTP request data including headers, which is used to get the user.

5fill in blank

hard

Fill all three blanks to define a GraphQL directive for requiring authentication.

GraphQL

directive @[1] on [2] | [3]

Drag options to blanks, or click blank then click option'

Aauth

BFIELD_DEFINITION

COBJECT

DQUERY

Attempts:

3 left

💡 Hint

Common Mistakes

Using QUERY as a directive location, which is invalid.

Naming the directive something other than auth.

The @auth directive is commonly used on FIELD_DEFINITION and OBJECT to enforce authentication.

Practice

1. What is the main purpose of context-based authentication in GraphQL?

easy

A. To cache query results

B. To verify user identity using request information

C. To format the response data

D. To speed up query execution

Solution

1. Step 1: Understand context-based authentication

   It uses information from the request, like tokens, to verify who the user is.

2. Step 2: Identify the main goal

   The goal is to check user identity to allow or deny access to data.

3. Final Answer:

   To verify user identity using request information -> Option B

4. Quick Check:

   Context-based authentication = verify user identity [OK]

Hint: Context holds user info to check identity quickly [OK]

Common Mistakes:

• Thinking it speeds up queries
• Confusing with data formatting
• Assuming it caches results

2. Which of the following is the correct way to add user info to the GraphQL context in a server setup?

easy

A. context: ({ req }) => ({ user: req.user })

B. context: (user) => ({ req: user })

C. context: () => ({ user: 'anonymous' })

D. context: ({ res }) => ({ user: res.user })

Solution

1. Step 1: Identify how context receives request info

   Context function receives an object with request (req) and response (res).

2. Step 2: Correctly extract user from request

   User info is usually attached to req, so context: ({ req }) => ({ user: req.user }) is correct.

3. Final Answer:

   context: ({ req }) => ({ user: req.user }) -> Option A

4. Quick Check:

   Context uses req.user = context: ({ req }) => ({ user: req.user }) [OK]

Hint: Context function gets req, extract user from req.user [OK]

Common Mistakes:

• Using res instead of req
• Passing user as argument instead of req
• Setting static user instead of dynamic

3. Given this resolver snippet, what will be the output if context.user is { id: 5, role: 'admin' }?

resolve(parent, args, context) {
  if (context.user?.role === 'admin') {
    return 'Access granted';
  } else {
    return 'Access denied';
  }
}

medium

A. 'Access denied'

B. null

C. 'Access granted'

D. Error: Cannot read property 'role' of undefined

Solution

1. Step 1: Check user role in context

   The code checks if context.user.role equals 'admin'. Given context.user.role is 'admin', condition is true.

2. Step 2: Determine returned string

   Since condition is true, the resolver returns 'Access granted'.

3. Final Answer:

   'Access granted' -> Option C

4. Quick Check:

   context.user.role === 'admin' -> 'Access granted' [OK]

Hint: Check user role in context to decide access [OK]

Common Mistakes:

• Ignoring optional chaining and assuming error
• Confusing role values
• Assuming null return

4. Identify the error in this context setup code:

const server = new ApolloServer({
  typeDefs,
  resolvers,
  context: (req) => {
    const user = authenticate(req.headers.authorization);
    return { user };
  }
});

medium

A. The context function should destructure req as ({ req })

B. authenticate function is missing

C. context function should return user directly, not an object

D. Authorization header should be accessed as req.authorization

Solution

1. Step 1: Check context function parameter

   ApolloServer passes an object with req property, so context should destructure it as ({ req }).

2. Step 2: Identify correct usage of authorization header

   Authorization header is accessed via req.headers.authorization, so destructuring is needed.

3. Final Answer:

   The context function should destructure req as ({ req }) -> Option A

4. Quick Check:

   Context param = ({ req }) not (req) [OK]

Hint: Destructure req from context param: ({ req }) [OK]

Common Mistakes:

• Using req directly without destructuring
• Assuming authenticate is missing error
• Returning user instead of object

5. You want to restrict a GraphQL query so only the user who owns the data or an admin can access it. Which context-based authentication check correctly enforces this?

resolve(parent, args, context) {
  // args.id is the data owner ID
  // context.user has id and role
  ???
}

hard

A. if (args.id === null) { return 'Allowed'; } else { return 'Denied'; }

B. if (context.user.id !== args.id && context.user.role !== 'admin') { return 'Allowed'; } else { return 'Denied'; }

C. if (context.user.role === 'admin') { return 'Denied'; } else { return 'Allowed'; }

D. if (context.user.id === args.id || context.user.role === 'admin') { return 'Allowed'; } else { return 'Denied'; }

Solution

1. Step 1: Understand access rules

   Access is allowed if user owns data (user.id === args.id) or user is admin (role === 'admin').

2. Step 2: Check condition logic

   if (context.user.id === args.id || context.user.role === 'admin') { return 'Allowed'; } else { return 'Denied'; } correctly uses OR (||) to allow access if either condition is true.

3. Final Answer:

   if (context.user.id === args.id || context.user.role === 'admin') { return 'Allowed'; } else { return 'Denied'; } -> Option D

4. Quick Check:

   Owner or admin -> allow access [OK]

Hint: Use OR to allow owner or admin access [OK]

Common Mistakes:

• Using AND instead of OR
• Denying admins access
• Ignoring user ID check