Request modification in NextJS - Cheat Sheet & Quick Revision

Recall & Review

beginner

What is request modification in Next.js?

Request modification means changing the details of an HTTP request before it reaches your server or API route. In Next.js, this can be done using middleware to inspect and alter requests.

intermediate

How do you modify a request URL in Next.js middleware?

You can use the NextResponse.rewrite() method inside middleware to change the request URL, redirecting it to a different path or resource before it reaches the handler.

beginner

Which Next.js feature allows you to run code before a request is completed to modify it?

Middleware in Next.js runs before the request completes and lets you modify the request or response, such as rewriting URLs, adding headers, or redirecting.

intermediate

What is the difference between NextResponse.rewrite() and NextResponse.redirect() in request modification?

NextResponse.rewrite() changes the request URL internally without changing the browser's address bar, while NextResponse.redirect() sends a redirect response that changes the browser's URL.

advanced

Can you modify request headers in Next.js middleware? How?

Yes, you can clone the request and set new headers or modify existing ones inside middleware before passing it on. This helps add authentication tokens or custom data.

Which Next.js feature lets you modify requests before they reach your API or page?

A getServerSideProps

B Middleware

C Static Generation

D Client Components

Middleware runs before requests complete and can modify requests or responses.

What does NextResponse.rewrite() do in Next.js middleware?

A Redirects the browser to a new URL

B Modifies response headers

C Blocks the request

D Changes the request URL internally without changing the browser URL

rewrite() changes the request path internally but keeps the browser URL the same.

How can you add a custom header to a request in Next.js middleware?

A Clone the request and set headers on the clone

B Use getStaticProps

C Modify the request object directly

D Use client-side JavaScript

You clone the request and set headers on the clone before continuing.

Which method sends a response that changes the browser's URL in Next.js middleware?

A NextResponse.redirect()

B NextResponse.json()

C NextResponse.next()

D NextResponse.rewrite()

redirect() sends a redirect response that updates the browser URL.

Where do you place middleware files in a Next.js project?

A components/

B pages/api/

C middleware.js or middleware.ts (at project root)

D public/

Middleware files go at the project root as middleware.js or middleware.ts.

Explain how you can modify an incoming request URL in Next.js using middleware.

Think about how middleware can change the path without redirecting.

Describe the difference between rewriting and redirecting a request in Next.js middleware.

Consider what the user sees in the browser address bar.