fix: RSC responses when using middleware rewrites or redirects for cacheable page being served for html requests (#2843)

* test: add test cases for redirects/rewrites to cached page

* fix: RSC responses when using middleware rewrites or redirects for cacheable page being served for html requests

Author: pieh

src/run/headers.test.ts

@@ -40,7 +40,7 @@ describe('headers', () => {
 
         expect(headers.set).toBeCalledWith(
           'netlify-vary',
-          'query=__nextDataReq|_rsc,header=x-nextjs-data|x-next-debug-logging,cookie=__prerender_bypass|__next_preview_data',
+          'query=__nextDataReq|_rsc,header=x-nextjs-data|x-next-debug-logging|next-router-prefetch|next-router-segment-prefetch|next-router-state-tree|next-url|rsc,cookie=__prerender_bypass|__next_preview_data',
         )
       })
 
@@ -56,7 +56,7 @@ describe('headers', () => {
 
         expect(headers.set).toBeCalledWith(
           'netlify-vary',
-          'query=__nextDataReq|_rsc,header=x-nextjs-data|x-next-debug-logging|Accept|Accept-Language,cookie=__prerender_bypass|__next_preview_data',
+          'query=__nextDataReq|_rsc,header=x-nextjs-data|x-next-debug-logging|next-router-prefetch|next-router-segment-prefetch|next-router-state-tree|next-url|rsc|accept|accept-language,cookie=__prerender_bypass|__next_preview_data',
         )
       })
 
@@ -77,7 +77,7 @@ describe('headers', () => {
 
         expect(headers.set).toBeCalledWith(
           'netlify-vary',
-          'query=__nextDataReq|_rsc,header=x-nextjs-data|x-next-debug-logging,cookie=__prerender_bypass|__next_preview_data',
+          'query=__nextDataReq|_rsc,header=x-nextjs-data|x-next-debug-logging|next-router-prefetch|next-router-segment-prefetch|next-router-state-tree|next-url|rsc,cookie=__prerender_bypass|__next_preview_data',
         )
       })
 
@@ -97,7 +97,7 @@ describe('headers', () => {
 
         expect(headers.set).toBeCalledWith(
           'netlify-vary',
-          'query=__nextDataReq|_rsc,header=x-nextjs-data|x-next-debug-logging,cookie=__prerender_bypass|__next_preview_data',
+          'query=__nextDataReq|_rsc,header=x-nextjs-data|x-next-debug-logging|next-router-prefetch|next-router-segment-prefetch|next-router-state-tree|next-url|rsc,cookie=__prerender_bypass|__next_preview_data',
         )
       })
 
@@ -117,7 +117,7 @@ describe('headers', () => {
 
         expect(headers.set).toBeCalledWith(
           'netlify-vary',
-          'query=__nextDataReq|_rsc,header=x-nextjs-data|x-next-debug-logging,language=en|de|fr,cookie=__prerender_bypass|__next_preview_data|NEXT_LOCALE',
+          'query=__nextDataReq|_rsc,header=x-nextjs-data|x-next-debug-logging|next-router-prefetch|next-router-segment-prefetch|next-router-state-tree|next-url|rsc,language=en|de|fr,cookie=__prerender_bypass|__next_preview_data|NEXT_LOCALE',
         )
       })
 
@@ -138,7 +138,7 @@ describe('headers', () => {
 
         expect(headers.set).toBeCalledWith(
           'netlify-vary',
-          'query=__nextDataReq|_rsc,header=x-nextjs-data|x-next-debug-logging,language=en|de|fr,cookie=__prerender_bypass|__next_preview_data|NEXT_LOCALE',
+          'query=__nextDataReq|_rsc,header=x-nextjs-data|x-next-debug-logging|next-router-prefetch|next-router-segment-prefetch|next-router-state-tree|next-url|rsc,language=en|de|fr,cookie=__prerender_bypass|__next_preview_data|NEXT_LOCALE',
         )
       })
 
@@ -161,7 +161,7 @@ describe('headers', () => {
 
         expect(headers.set).toBeCalledWith(
           'netlify-vary',
-          'query,header=x-nextjs-data|x-next-debug-logging|x-custom-header,language=en|de|fr|es,cookie=__prerender_bypass|__next_preview_data|NEXT_LOCALE|ab_test,country=es',
+          'query,header=x-nextjs-data|x-next-debug-logging|next-router-prefetch|next-router-segment-prefetch|next-router-state-tree|next-url|rsc|x-custom-header,language=en|de|fr|es,cookie=__prerender_bypass|__next_preview_data|NEXT_LOCALE|ab_test,country=es',
         )
       })
 
@@ -185,10 +185,44 @@ describe('headers', () => {
 
         expect(headers.set).toBeCalledWith(
           'netlify-vary',
-          'query=__nextDataReq|_rsc|item_id|page|per_page,header=x-nextjs-data|x-next-debug-logging|x-custom-header,language=en|de|fr|es,cookie=__prerender_bypass|__next_preview_data|NEXT_LOCALE|ab_test,country=es',
+          'query=__nextDataReq|_rsc|item_id|page|per_page,header=x-nextjs-data|x-next-debug-logging|next-router-prefetch|next-router-segment-prefetch|next-router-state-tree|next-url|rsc|x-custom-header,language=en|de|fr|es,cookie=__prerender_bypass|__next_preview_data|NEXT_LOCALE|ab_test,country=es',
         )
       })
     })
+
+    test('with vary headers provided by Next.js before 15.3.0', () => {
+      const headers = new Headers({
+        // before https://github.com/vercel/next.js/pull/77797 Next.js was producing following headers
+        Vary: 'RSC, Next-Router-State-Tree, Next-Router-Prefetch, Next-Router-Segment-Prefetch, Next-Url',
+      })
+      const request = new Request(defaultUrl)
+      vi.spyOn(headers, 'set')
+
+      setVaryHeaders(headers, request, defaultConfig)
+
+      expect(headers.set).toBeCalledWith(
+        'netlify-vary',
+        'query=__nextDataReq|_rsc,header=x-nextjs-data|x-next-debug-logging|next-router-prefetch|next-router-segment-prefetch|next-router-state-tree|next-url|rsc,cookie=__prerender_bypass|__next_preview_data',
+      )
+    })
+
+    test('with vary headers provided by Next.js before 15.3.0 and user defined Netlify-vary', () => {
+      const headers = new Headers({
+        // before https://github.com/vercel/next.js/pull/77797 Next.js was producing following headers
+        Vary: 'RSC, Next-Router-State-Tree, Next-Router-Prefetch, Next-Router-Segment-Prefetch, Next-Url',
+        'Netlify-Vary':
+          'query=item_id|page|per_page,header=x-custom-header,language=es,country=es,cookie=ab_test',
+      })
+      const request = new Request(defaultUrl)
+      vi.spyOn(headers, 'set')
+
+      setVaryHeaders(headers, request, defaultConfig)
+
+      expect(headers.set).toBeCalledWith(
+        'netlify-vary',
+        'query=__nextDataReq|_rsc|item_id|page|per_page,header=x-nextjs-data|x-next-debug-logging|next-router-prefetch|next-router-segment-prefetch|next-router-state-tree|next-url|rsc|x-custom-header,language=es,cookie=__prerender_bypass|__next_preview_data|ab_test,country=es',
+      )
+    })
   })
 
   describe('setCacheControlHeaders', () => {

src/run/headers.ts

@@ -39,7 +39,15 @@ const generateNetlifyVaryValues = ({
     }
   }
   if (header.length !== 0) {
-    values.push(`header=${header.join(`|`)}`)
+    const uniqueHeaderNames = [
+      ...new Set(
+        header.map((headerName) =>
+          // header names are case insensitive
+          headerName.toLowerCase(),
+        ),
+      ),
+    ]
+    values.push(`header=${uniqueHeaderNames.join(`|`)}`)
   }
   if (language.length !== 0) {
     values.push(`language=${language.join(`|`)}`)
@@ -78,7 +86,19 @@ export const setVaryHeaders = (
   { basePath, i18n }: Pick<NextConfigComplete, 'basePath' | 'i18n'>,
 ) => {
   const netlifyVaryValues: NetlifyVaryValues = {
-    header: ['x-nextjs-data', 'x-next-debug-logging'],
+    header: [
+      'x-nextjs-data',
+      'x-next-debug-logging',
+      // using _rsc query param might not be enough because it is stripped for middleware redirect and rewrites
+      // so adding all request headers that are used to produce the _rsc query param
+      // https://github.com/vercel/next.js/blob/e5fe535ed17cee5e1d5576ccc33e4c49b5da1273/packages/next/src/client/components/router-reducer/set-cache-busting-search-param.ts#L32-L39
+      'Next-Router-Prefetch',
+      'Next-Router-Segment-Prefetch',
+      'Next-Router-State-Tree',
+      'Next-Url',
+      // and exact header that actually instruct Next.js to produce RSC response
+      'RSC',
+    ],
     language: [],
     cookie: ['__prerender_bypass', '__next_preview_data'],
     query: ['__nextDataReq', '_rsc'],

tests/e2e/edge-middleware.test.ts

@@ -1,4 +1,4 @@
-import { expect } from '@playwright/test'
+import { expect, Response } from '@playwright/test'
 import { nextVersionSatisfies } from '../utils/next-version-helpers.mjs'
 import { test } from '../utils/playwright-helpers.js'
 import { getImageSize } from 'next/dist/server/image-optimizer.js'
@@ -232,3 +232,59 @@ test("requests with x-middleware-subrequest don't skip middleware (GHSA-f82v-jwr
   // ensure we are testing version before the fix for self hosted
   expect(response.headers.get('x-test-used-next-version')).toBe('15.2.2')
 })
+
+test.describe('RSC cache poisoning', () => {
+  test('Middleware rewrite', async ({ page, middleware }) => {
+    const prefetchResponsePromise = new Promise<Response>((resolve) => {
+      page.on('response', (response) => {
+        if (response.url().includes('/test/rewrite-to-cached-page')) {
+          resolve(response)
+        }
+      })
+    })
+    await page.goto(`${middleware.url}/link-to-rewrite-to-cached-page`)
+
+    // ensure prefetch
+    await page.hover('text=NextResponse.rewrite')
+
+    // wait for prefetch request to finish
+    const prefetchResponse = await prefetchResponsePromise
+
+    // ensure prefetch respond with RSC data
+    expect(prefetchResponse.headers()['content-type']).toMatch(/text\/x-component/)
+    expect(prefetchResponse.headers()['netlify-cdn-cache-control']).toMatch(/s-maxage=31536000/)
+
+    const htmlResponse = await page.goto(`${middleware.url}/test/rewrite-to-cached-page`)
+
+    // ensure we get HTML response
+    expect(htmlResponse?.headers()['content-type']).toMatch(/text\/html/)
+    expect(htmlResponse?.headers()['netlify-cdn-cache-control']).toMatch(/s-maxage=31536000/)
+  })
+
+  test('Middleware redirect', async ({ page, middleware }) => {
+    const prefetchResponsePromise = new Promise<Response>((resolve) => {
+      page.on('response', (response) => {
+        if (response.url().includes('/caching-redirect-target')) {
+          resolve(response)
+        }
+      })
+    })
+    await page.goto(`${middleware.url}/link-to-redirect-to-cached-page`)
+
+    // ensure prefetch
+    await page.hover('text=NextResponse.redirect')
+
+    // wait for prefetch request to finish
+    const prefetchResponse = await prefetchResponsePromise
+
+    // ensure prefetch respond with RSC data
+    expect(prefetchResponse.headers()['content-type']).toMatch(/text\/x-component/)
+    expect(prefetchResponse.headers()['netlify-cdn-cache-control']).toMatch(/s-maxage=31536000/)
+
+    const htmlResponse = await page.goto(`${middleware.url}/test/redirect-to-cached-page`)
+
+    // ensure we get HTML response
+    expect(htmlResponse?.headers()['content-type']).toMatch(/text\/html/)
+    expect(htmlResponse?.headers()['netlify-cdn-cache-control']).toMatch(/s-maxage=31536000/)
+  })
+})

tests/fixtures/middleware/app/caching-redirect-target/page.js

@@ -0,0 +1,9 @@
+export default function CachingRedirect() {
+  return (
+    <main>
+      <h1>Hello redirect target</h1>
+    </main>
+  )
+}
+
+export const dynamic = 'force-static'

tests/fixtures/middleware/app/caching-rewrite-target/page.js

@@ -0,0 +1,9 @@
+export default function CachingRewrite() {
+  return (
+    <main>
+      <h1>Hello rewrite target</h1>
+    </main>
+  )
+}
+
+export const dynamic = 'force-static'

tests/fixtures/middleware/app/link-to-redirect-to-cached-page/page.js

@@ -0,0 +1,13 @@
+import Link from 'next/link'
+
+export default function LinksToRedirectedCachedPage() {
+  return (
+    <nav>
+      <ul>
+        <li>
+          <Link href="/test/redirect-to-cached-page">NextResponse.redirect</Link>
+        </li>
+      </ul>
+    </nav>
+  )
+}

tests/fixtures/middleware/app/link-to-rewrite-to-cached-page/page.js

@@ -0,0 +1,13 @@
+import Link from 'next/link'
+
+export default function LinksToRewrittenCachedPage() {
+  return (
+    <nav>
+      <ul>
+        <li>
+          <Link href="/test/rewrite-to-cached-page">NextResponse.rewrite</Link>
+        </li>
+      </ul>
+    </nav>
+  )
+}

tests/fixtures/middleware/middleware.ts

@@ -80,6 +80,13 @@ const getResponse = (request: NextRequest) => {
     })
   }
 
+  if (request.nextUrl.pathname === '/test/rewrite-to-cached-page') {
+    return NextResponse.rewrite(new URL('/caching-rewrite-target', request.url))
+  }
+  if (request.nextUrl.pathname === '/test/redirect-to-cached-page') {
+    return NextResponse.redirect(new URL('/caching-redirect-target', request.url))
+  }
+
   return NextResponse.json({ error: 'Error' }, { status: 500 })
 }