Middleware rewrite doesn't work with i18n

[leethree]

What version of Next.js are you using?

12.0.2

What version of Node.js are you using?

14.17.6

What browser are you using?

Chrome

What operating system are you using?

macOS

How are you deploying your application?

next start

Describe the Bug

Next 12 Middleware rewrite doesn't handle locale correctly with i18n routing enabled. For example, if we rewrite /test to /fr/test using middleware, it will still show /test with the default locale because the locale info is lost during rewrite.

So you can't do this:

// in middleware
req.nextUrl.locale = detectedLocale;
return NextResponse.rewrite(req.nextUrl);

or equivalently this:

// in middleware
req.nextUrl.pathname = `/${detectedLocale}${req.nextUrl.pathname}`
return NextResponse.rewrite(req.nextUrl);

Expected Behavior

The locale info should be parsed when rewriting from middleware.

To Reproduce

I modified the vercel i18n example to demonstrate the issue.

See: https://github.com/leethree/next-i18n-rewrite

Supposedly you have fr as your browser locale. When visiting the home page (http://localhost:3000/), it should show your current locale as detected:

(ignore the flag, note the "locale: fr" below that.)

But actual behaviour:

[leethree]

From my debugging, it seems like the locale is stripped fromresolvedUrlPathname in the server code while handling rewrite:

next.js/packages/next/server/next-server.ts

Lines 1830 to 1838 in 450552d

	let resolvedUrlPathname = (req as any)._nextRewroteUrl
	? (req as any)._nextRewroteUrl
	: urlPathname
	urlPathname = removePathTrailingSlash(urlPathname)
	resolvedUrlPathname = normalizeLocalePath(
	removePathTrailingSlash(resolvedUrlPathname),
	this.nextConfig.i18n?.locales
	).pathname

[balazsorban44]

This issue has been automatically locked due to no recent activity. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.