How to securely set and read httpOnly cookies in Route Handlers

WHAT THIS TESTS: This question evaluates whether you understand the request-response lifecycle in Next.js App Router Route Handlers and how to protect session tokens from XSS. The interviewer wants to see that you know httpOnly cookies are set by the server and cannot be read by browser JavaScript, and that you know the specific Next.js APIs for manipulating headers and cookies across requests.

A GOOD ANSWER COVERS: A good answer hits four things in order. First, in a Route Handler you import NextResponse from next/server and return a response after calling response.cookies.set with the httpOnly flag, plus Secure and SameSite set to strict or lax for production. Second, you explain that NextResponse extends the Web Response API and provides a cookies helper that serializes the Set-Cookie header correctly. Third, for the subsequent request you read the cookie using the cookies function from next/headers, which accesses the incoming Cookie header on the server, or you use the cookies helper on a NextRequest object in another Route Handler. Fourth, you explicitly state that document.cookie on the client will not show the value because httpOnly makes it invisible to JavaScript, which is the security benefit.

COMMON WRONG ANSWERS: A common wrong answer is suggesting that you set the cookie from a client component using document.cookie or a client-side library, which defeats the purpose of httpOnly. Another red flag is forgetting to set Secure in production, leaving the cookie vulnerable to interception over HTTP. Some candidates also confuse the Pages Router API with the App Router, for example mentioning res.cookie from an API route instead of NextResponse. Finally, saying you can read httpOnly cookies in the browser via localStorage or fetch headers is incorrect because the browser blocks JavaScript access.

LIKELY FOLLOW-UPS: An interviewer might ask how you would rotate or invalidate the cookie, how to handle cookie size limits of roughly four kilobytes, or how this changes if you are using middleware to rewrite requests. They might also ask about the difference between storing a JWT in localStorage versus an httpOnly cookie, or how to implement CSRF protection when using cookie-based sessions.

ONE CONCRETE EXAMPLE: Imagine an auth callback route at app/api/auth/callback/route.ts. After validating an OAuth code, you create a new NextResponse.json with user data and call response.cookies.set with the name sessionToken and options including httpOnly true, Secure true, SameSite lax, and maxAge of one hour. On the next request to a server component or another Route Handler, you import cookies from next/headers and call cookies.get with the name sessionToken to verify the session. The token never appears in document.cookie.