fix: Ensure Location header is properly encoded in redirects (opennextjs#871)

* fix: ensure Location header is encoded in redirects

* e2e

* changeset

* refactor comment

* refactor changeset

Author: sommeeeer

.changeset/proud-dogs-punch.md

@@ -0,0 +1,5 @@
+---
+"@opennextjs/aws": patch
+---
+
+fix: Ensure Location header is properly encoded in redirects happening from next config

examples/app-router/app/config-redirect/dest/page.tsx

@@ -0,0 +1,13 @@
+export default async function Page({
+  searchParams,
+}: {
+  searchParams: Promise<{ [key: string]: string | string[] | undefined }>;
+}) {
+  const q = (await searchParams).q;
+
+  return (
+    <>
+      <div data-testid="searchParams">q: {q}</div>
+    </>
+  );
+}

examples/app-router/app/config-redirect/page.tsx

@@ -3,6 +3,18 @@ export default function RedirectDestination() {
     <div>
       <h1>I was redirected from next.config.js</h1>
       <p>/next-config-redirect =&gt; /config-redirect</p>
+      <a
+        data-testid="redirect-link"
+        href="/next-config-redirect-encoding?q=äöå€"
+      >
+        /next-config-redirect-encoding?q=äöå€
+      </a>
+      <a
+        data-testid="redirect-link-already-encoded"
+        href="/next-config-redirect-encoding?q=%C3%A4%C3%B6%C3%A5%E2%82%AC"
+      >
+        /next-config-redirect-encoding?q=%C3%A4%C3%B6%C3%A5%E2%82%AC
+      </a>
     </div>
   );
 }

examples/app-router/next.config.ts

@@ -6,13 +6,6 @@ const nextConfig: NextConfig = {
   transpilePackages: ["@example/shared"],
   output: "standalone",
   // outputFileTracingRoot: "../sst",
-  eslint: {
-    ignoreDuringBuilds: true,
-  },
-  //TODO: remove this when i'll figure out why it fails locally
-  typescript: {
-    ignoreBuildErrors: true,
-  },
   images: {
     remotePatterns: [
       {
@@ -60,6 +53,11 @@ const nextConfig: NextConfig = {
         basePath: false,
         locale: false,
       },
+      {
+        source: "/next-config-redirect-encoding",
+        destination: "/config-redirect/dest",
+        permanent: false,
+      },
     ];
   },
   async headers() {

packages/open-next/src/core/routingHandler.ts

@@ -96,6 +96,11 @@ export default async function routingHandler(
 
     const redirect = handleRedirects(internalEvent, RoutesManifest.redirects);
     if (redirect) {
+      // We need to encode the value in the Location header to make sure it is valid according to RFC
+      // https://stackoverflow.com/a/7654605/16587222
+      redirect.headers.Location = new URL(
+        redirect.headers.Location as string,
+      ).href;
       debug("redirect", redirect);
       return redirect;
     }

packages/tests-e2e/tests/appRouter/config.redirect.test.ts

@@ -72,4 +72,46 @@ test.describe("Next Config Redirect", () => {
     });
     await expect(el).toBeVisible();
   });
+  test("Should properly encode the Location header for redirects with query params", async ({
+    page,
+    baseURL,
+  }) => {
+    await page.goto("/config-redirect");
+    const responsePromise = page.waitForResponse((response) => {
+      return response.status() === 307;
+    });
+    page.getByTestId("redirect-link").click();
+    const res = await responsePromise;
+    await page.waitForURL("/config-redirect/dest?q=äöå€");
+
+    const locationHeader = res.headers().location;
+    expect(locationHeader).toBe(
+      `${baseURL}/config-redirect/dest?q=%C3%A4%C3%B6%C3%A5%E2%82%AC`,
+    );
+    expect(res.status()).toBe(307);
+
+    const searchParams = page.getByTestId("searchParams");
+    await expect(searchParams).toHaveText("q: äöå€");
+  });
+  test("Should respect already encoded query params", async ({
+    page,
+    baseURL,
+  }) => {
+    await page.goto("/config-redirect");
+    const responsePromise = page.waitForResponse((response) => {
+      return response.status() === 307;
+    });
+    page.getByTestId("redirect-link-already-encoded").click();
+    const res = await responsePromise;
+    await page.waitForURL("/config-redirect/dest?q=äöå€");
+
+    const locationHeader = res.headers().location;
+    expect(locationHeader).toBe(
+      `${baseURL}/config-redirect/dest?q=%C3%A4%C3%B6%C3%A5%E2%82%AC`,
+    );
+    expect(res.status()).toBe(307);
+
+    const searchParams = page.getByTestId("searchParams");
+    await expect(searchParams).toHaveText("q: äöå€");
+  });
 });