NextResponse

NextResponse erweitert die Web Response API mit zusätzlichen praktischen Methoden.

cookies

Liest oder verändert den Set-Cookie-Header der Antwort.

set(name, value)

Setzt ein Cookie mit dem angegebenen Namen und Wert in der Antwort.

// Bei eingehender Anfrage /home
let response = NextResponse.next()
// Cookie setzen, um das Banner auszublenden
response.cookies.set('show-banner', 'false')
// Antwort enthält `Set-Cookie:show-banner=false;path=/home` Header
return response

get(name)

Gibt den Wert des Cookies mit dem angegebenen Namen zurück. Wenn das Cookie nicht gefunden wird, wird undefined zurückgegeben. Bei mehreren gefundenen Cookies wird der erste zurückgegeben.

// Bei eingehender Anfrage /home
let response = NextResponse.next()
// { name: 'show-banner', value: 'false', Path: '/home' }
response.cookies.get('show-banner')

getAll()

Gibt die Werte des Cookies mit dem angegebenen Namen zurück. Wenn kein Name angegeben ist, werden alle Cookies der Antwort zurückgegeben.

// Bei eingehender Anfrage /home
let response = NextResponse.next()
// [
//   { name: 'experiments', value: 'new-pricing-page', Path: '/home' },
//   { name: 'experiments', value: 'winter-launch', Path: '/home' },
// ]
response.cookies.getAll('experiments')
// Alternativ alle Cookies der Antwort abrufen
response.cookies.getAll()

delete(name)

Löscht das Cookie mit dem angegebenen Namen aus der Antwort.

// Bei eingehender Anfrage /home
let response = NextResponse.next()
// Gibt true zurück, wenn gelöscht, false wenn nichts gelöscht wurde
response.cookies.delete('experiments')

json()

Erzeugt eine Antwort mit dem angegebenen JSON-Body.

import { NextResponse } from 'next/server'

export async function GET(request: Request) {
  return NextResponse.json({ error: 'Internal Server Error' }, { status: 500 })
}
import { NextResponse } from 'next/server'

export async function GET(request) {
  return NextResponse.json({ error: 'Internal Server Error' }, { status: 500 })
}

redirect()

Erzeugt eine Antwort, die zu einer URL weiterleitet.

import { NextResponse } from 'next/server'

return NextResponse.redirect(new URL('/new', request.url))

Die URL kann vor der Verwendung in der NextResponse.redirect()-Methode erstellt und modifiziert werden. Beispielsweise kann die Eigenschaft request.nextUrl verwendet werden, um die aktuelle URL zu erhalten und dann für die Weiterleitung zu einer anderen URL zu modifizieren.

import { NextResponse } from 'next/server'

// Bei eingehender Anfrage...
const loginUrl = new URL('/login', request.url)
// ?from=/incoming-url zur /login URL hinzufügen
loginUrl.searchParams.set('from', request.nextUrl.pathname)
// Und zur neuen URL weiterleiten
return NextResponse.redirect(loginUrl)

rewrite()

Erzeugt eine Antwort, die die angegebene URL umschreibt (proxied), während die ursprüngliche URL beibehalten wird.

import { NextResponse } from 'next/server'

// Eingehende Anfrage: /about, Browser zeigt /about
// Umschriebene Anfrage: /proxy, Browser zeigt /about
return NextResponse.rewrite(new URL('/proxy', request.url))

next()

Die next()-Methode ist nützlich für Middleware, da sie eine vorzeitige Rückgabe und die Fortsetzung des Routings ermöglicht.

import { NextResponse } from 'next/server'

return NextResponse.next()

Es können auch headers bei der Erzeugung der Antwort weitergeleitet werden:

import { NextResponse } from 'next/server'

// Bei eingehender Anfrage...
const newHeaders = new Headers(request.headers)
// Neuen Header hinzufügen
newHeaders.set('x-version', '123')
// Antwort mit den neuen Headern erzeugen
return NextResponse.next({
  request: {
    // Neue Request-Header
    headers: newHeaders,
  },
})