Redirects and Rewrites

Redirect vs Rewrite

RedirectRewrite
Browser URL changes?YesNo
HTTP307/308 + Location headerSame response, other content
Use forLogin required, moved pagesA/B tests, multi-tenant, locale, maintenance page

Examples

import { NextRequest, NextResponse } from 'next/server';

export function middleware(req: NextRequest) {
  const { pathname } = req.nextUrl;

  // 1. Old URL -> new URL
  if (pathname.startsWith('/item/')) {
    const url = req.nextUrl.clone();
    url.pathname = pathname.replace('/item/', '/products/');
    return NextResponse.redirect(url, 308);
  }

  // 2. Maintenance mode: same URL, different page
  if (process.env.MAINTENANCE === '1' && !pathname.startsWith('/maintenance')) {
    return NextResponse.rewrite(new URL('/maintenance', req.url));
  }

  // 3. A/B test: 50% of users see the new home page
  if (pathname === '/') {
    const bucket = req.cookies.get('ab-home')?.value ?? (Math.random() < 0.5 ? 'a' : 'b');
    const res = bucket === 'b' ? NextResponse.rewrite(new URL('/home-b', req.url)) : NextResponse.next();
    res.cookies.set('ab-home', bucket, { maxAge: 60 * 60 * 24 * 30 });
    return res;
  }

  return NextResponse.next();
}

Responses

Example

curl -i localhost:3000/item/42

Example output

HTTP/1.1 308 Permanent Redirect
location: /products/42