diff --git a/packages/next/src/client/components/router-reducer/fetch-server-response.ts b/packages/next/src/client/components/router-reducer/fetch-server-response.ts index e1609761fa52..8028a8c46314 100644 --- a/packages/next/src/client/components/router-reducer/fetch-server-response.ts +++ b/packages/next/src/client/components/router-reducer/fetch-server-response.ts @@ -37,7 +37,9 @@ export async function fetchServerResponse( // Enable flight response [RSC]: '1', // Provide the current router state - [NEXT_ROUTER_STATE_TREE]: JSON.stringify(flightRouterState), + [NEXT_ROUTER_STATE_TREE]: encodeURIComponent( + JSON.stringify(flightRouterState) + ), } /** diff --git a/packages/next/src/server/app-render/parse-and-validate-flight-router-state.tsx b/packages/next/src/server/app-render/parse-and-validate-flight-router-state.tsx index d6bf3fa8c4f7..b8d4e43b10c6 100644 --- a/packages/next/src/server/app-render/parse-and-validate-flight-router-state.tsx +++ b/packages/next/src/server/app-render/parse-and-validate-flight-router-state.tsx @@ -23,7 +23,9 @@ export function parseAndValidateFlightRouterState( } try { - return flightRouterStateSchema.parse(JSON.parse(stateHeader)) + return flightRouterStateSchema.parse( + JSON.parse(decodeURIComponent(stateHeader)) + ) } catch { throw new Error('The router state header was sent but could not be parsed.') } diff --git a/test/e2e/app-dir/navigation/app/search-params/page.js b/test/e2e/app-dir/navigation/app/search-params/page.js new file mode 100644 index 000000000000..fb6eb4627272 --- /dev/null +++ b/test/e2e/app-dir/navigation/app/search-params/page.js @@ -0,0 +1,12 @@ +import Link from 'next/link' + +export default function page({ searchParams }) { + return ( +
{searchParams.name ?? ''}
+ + home + +