Fix: correct <html lang> and localize the <head> description per locale

The root (main)/layout renders <html> ABOVE the [locale] segment, so next-intl's
getLocale() returns the default locale there - emitting <html lang="en"> on every
page regardless of UI language (e.g. /de) and a hardcoded English <head>
description. Both are strong "translate this page" triggers in Chrome.

proxy.ts already exposes the nonce to server components via the
x-middleware-request-* mechanism; expose the request pathname the same way as
x-pathname, and have the root layout derive the locale from it (falling back to
getLocale() when the path has no locale segment) for both <html lang> and the
localized meta_description (new key in all 17 locales; the English value is
unchanged).
This commit is contained in:
dealerweb
2026-05-30 13:51:21 +02:00
parent 7341e47a1b
commit 241544cd08
19 changed files with 47 additions and 7 deletions
+8 -4
View File
@@ -143,11 +143,15 @@ export async function proxy(request: NextRequest) {
const response = intlResponse ?? NextResponse.next();
const existing = response.headers.get("x-middleware-override-headers");
response.headers.set(
"x-middleware-override-headers",
existing ? `${existing},x-nonce` : "x-nonce"
);
// Expose the nonce AND the request pathname to server components as request
// headers. The root (main)/layout renders <html> ABOVE the [locale] segment,
// so getLocale() can't resolve the active locale there and falls back to the
// default - emitting <html lang="en"> on e.g. /de pages, which makes browsers
// offer to "translate this page". The layout reads x-pathname to recover it.
const overrides = [existing, "x-nonce", "x-pathname"].filter(Boolean).join(",");
response.headers.set("x-middleware-override-headers", overrides);
response.headers.set("x-middleware-request-x-nonce", nonce);
response.headers.set("x-middleware-request-x-pathname", pathname);
response.headers.set("X-Content-Type-Options", "nosniff");