Server-side session access in NextJS - Step-by-Step Execution

Concept Flow - Server-side session access

Client Request

↓

Next.js Server receives request

↓

Parse cookies from request

↓

Retrieve session data using cookie

↓

Use session data in server code

↓

Render page or API response with session info

↓

Send response back to client

The server receives a client request, reads cookies to find session info, accesses session data, and uses it to render the page or API response.

Execution Sample

NextJS

import { getServerSession } from "next-auth/next";
import { authOptions } from "@/app/api/auth/[...nextauth]/route";

export async function GET(req) {
  const session = await getServerSession({ req }, authOptions);
  return new Response(JSON.stringify({ user: session?.user ?? null }));
}

This code gets the session on the server during a GET request and returns user info in JSON.

Execution Table

Step	Action	Evaluation	Result
1	Receive GET request	Request object contains cookies	Request ready for processing
2	Call getServerSession()	Reads cookies from request headers	Extracts session token
3	Validate session token	Check token validity in session store	Session data found or null
4	Assign session variable	session = session data or null	session contains user info or null
5	Create response JSON	JSON.stringify({ user: session?.user ?? null })	JSON string with user or null
6	Return Response	Send JSON back to client	Client receives session user info or null

💡 Session data retrieved or null if no valid session token

Variable Tracker

Variable	Start	After Step 2	After Step 3	After Step 4	Final
req	undefined	Request with cookies	Request with cookies	Request with cookies	Request with cookies
session	undefined	undefined	session data or null	session data or null	session data or null
response	undefined	undefined	undefined	undefined	Response with JSON string

Key Moments - 2 Insights

Why do we need to read cookies from the request on the server?

Cookies contain the session token needed to identify the user session. Without reading cookies (Step 2), the server cannot find the session data (Step 3).

What happens if the session token is invalid or missing?

The session variable becomes null (Step 3 and 4), so the server knows no user is logged in and can respond accordingly (Step 6).

Visual Quiz - 3 Questions

Look at the execution table, what does the session variable contain after Step 4?

A Response JSON string

B Request object

C User info or null

D Cookies only

💡 Hint

Check the 'Result' column for Step 4 in the execution table.

At which step does the server validate the session token?

A Step 3

B Step 2

C Step 5

D Step 6

💡 Hint

Look for 'Validate session token' in the 'Action' column.

If the client sends no cookies, how does the session variable change?

A It contains user info

B It becomes null

C It throws an error

D It contains cookies

💡 Hint

Refer to the 'Result' in Step 3 and 4 when session token is missing.

Concept Snapshot

Server-side session access in Next.js:
- Server reads cookies from incoming request
- Uses getServerSession() to get session data
- Session can be user info or null if no valid session
- Use session data to render or respond
- Always handle null session safely

Full Transcript

When a client sends a request to a Next.js server, the server reads cookies from the request headers. These cookies contain a session token that identifies the user session. The server calls getServerSession() to extract and validate this token. If valid, it retrieves the session data including user information. If invalid or missing, the session is null. The server then uses this session data to render pages or send API responses. This process ensures the server knows who the user is during server-side rendering or API calls.

Practice

1. What is the main purpose of using getServerSession in Next.js?

easy

A. To fetch data from an external API on the client side

B. To handle client-side routing between pages

C. To style components dynamically based on user input

D. To access user session data securely on the server side

Solution

1. Step 1: Understand the role of getServerSession

   This function is designed to retrieve session information securely on the server side in Next.js.

2. Step 2: Compare with other options

   Options A, C, and D describe client-side or unrelated tasks, not server-side session access.

3. Final Answer:

   To access user session data securely on the server side -> Option D

4. Quick Check:

   Server-side session access = To access user session data securely on the server side [OK]

Hint: Remember: sessions store user info safely on the server [OK]

Common Mistakes:

• Confusing client-side data fetching with server session access
• Thinking getServerSession runs on the client
• Mixing session access with styling or routing

2. Which is the correct way to import getServerSession in a Next.js page?

easy

A. import { getServerSession } from 'next-auth/next';

B. import getServerSession from 'next/server';

C. import { getServerSession } from 'next/router';

D. import { getServerSession } from 'next/head';

Solution

1. Step 1: Identify the correct import source

   The official Next.js authentication library exports getServerSession from 'next-auth/next'.

2. Step 2: Check other imports

   Options A, B, and D import from unrelated Next.js modules, causing errors or undefined functions.

3. Final Answer:

   import { getServerSession } from 'next-auth/next'; -> Option A

4. Quick Check:

   Correct import path = import { getServerSession } from 'next-auth/next'; [OK]

Hint: Use 'next-auth/next' to import server session helpers [OK]

Common Mistakes:

• Importing from 'next/server' which lacks session helpers
• Confusing routing or head modules with auth imports
• Using default import instead of named import

3. Given this code inside getServerSideProps in Next.js, what will be logged if the user is not logged in?

export async function getServerSideProps(context) {
  const session = await getServerSession(context.req, context.res, authOptions);
  console.log(session);
  return { props: { user: session?.user || null } };
}

medium

A. undefined

B. An object with user details

C. null

D. A runtime error

Solution

1. Step 1: Understand session when user is not logged in

   If no user is logged in, getServerSession returns null, not undefined or error.

2. Step 2: Check the code's handling of session

   The code logs session directly, so it logs null. The props user is set to null safely.

3. Final Answer:

   null -> Option C

4. Quick Check:

   Session for no user = null [OK]

Hint: No login means session is null, not undefined or error [OK]

Common Mistakes:

• Assuming session is undefined instead of null
• Expecting an error when session is missing
• Confusing logged user object with session presence

4. What is wrong with this Next.js server-side session code?

export async function getServerSideProps(context) {
  const session = getServerSession(context.req, context.res, authOptions);
  if (!session) {
    return { redirect: { destination: '/login', permanent: false } };
  }
  return { props: { user: session.user } };
}

medium

A. Missing await before getServerSession call

B. Redirect destination should be '/home' instead of '/login'

C. session.user is undefined even if session exists

D. getServerSideProps cannot return redirect objects

Solution

1. Step 1: Check async function usage

   getServerSession returns a Promise, so it must be awaited to get the session object.

2. Step 2: Analyze the impact of missing await

   Without await, session is a Promise, so the if check fails and code behaves incorrectly.

3. Final Answer:

   Missing await before getServerSession call -> Option A

4. Quick Check:

   Async calls need await = Missing await before getServerSession call [OK]

Hint: Always await async session calls in server functions [OK]

Common Mistakes:

• Forgetting to await async functions
• Confusing redirect destinations with errors
• Thinking getServerSideProps can't redirect

5. You want to protect a Next.js page so only logged-in users can access it. Which approach correctly uses getServerSession inside getServerSideProps to redirect unauthenticated users to '/login' and pass user data to the page?

hard

A. export async function getServerSideProps(context) {
const session = getServerSession(context.req, context.res, authOptions);
if (session) {
return { redirect: { destination: '/login', permanent: false } };
}
return { props: { user: null } };
}

B. export async function getServerSideProps(context) {
const session = await getServerSession(context.req, context.res, authOptions);
if (!session) {
return { redirect: { destination: '/login', permanent: false } };
}
return { props: { user: session.user } };
}

C. export async function getServerSideProps(context) {
const session = await getServerSession(context.req, context.res, authOptions);
return { props: { user: session.user } };
}

D. export async function getServerSideProps(context) {
const session = await getServerSession(context.req, context.res, authOptions);
if (!session.user) {
return { redirect: { destination: '/login', permanent: false } };
}
return { props: { user: session.user } };
}

Solution

1. Step 1: Check session retrieval and await usage

   export async function getServerSideProps(context) { const session = await getServerSession(context.req, context.res, authOptions); if (!session) { return { redirect: { destination: '/login', permanent: false } }; } return { props: { user: session.user } }; } correctly awaits getServerSession to get the session object.

2. Step 2: Verify redirect logic for unauthenticated users

   export async function getServerSideProps(context) { const session = await getServerSession(context.req, context.res, authOptions); if (!session) { return { redirect: { destination: '/login', permanent: false } }; } return { props: { user: session.user } }; } redirects if !session, which means no logged-in user, correctly protecting the page.

3. Step 3: Confirm user data is passed when session exists

   export async function getServerSideProps(context) { const session = await getServerSession(context.req, context.res, authOptions); if (!session) { return { redirect: { destination: '/login', permanent: false } }; } return { props: { user: session.user } }; } returns user data in props only if session exists, enabling page to render user info.

4. Final Answer:

   export async function getServerSideProps(context) { const session = await getServerSession(context.req, context.res, authOptions); if (!session) { return { redirect: { destination: '/login', permanent: false } }; } return { props: { user: session.user } }; } -> Option B

5. Quick Check:

   Await session + redirect if no session = export async function getServerSideProps(context) { const session = await getServerSession(context.req, context.res, authOptions); if (!session) { return { redirect: { destination: '/login', permanent: false } }; } return { props: { user: session.user } }; } [OK]

Hint: Await session, redirect if missing, pass user in props [OK]

Common Mistakes:

• Not awaiting the session Promise
• Redirecting when session exists instead of missing
• Checking session.user without confirming session exists