feat: configure ssr handler to only match known routes

package.json

@@ -90,6 +90,7 @@
     "semver": "^7.6.0",
     "typescript": "^5.4.5",
     "unionfs": "^4.5.4",
+    "urlpattern-polyfill": "^10.0.0",
     "uuid": "^10.0.0",
     "vitest": "^1.5.3"
   },

src/build/functions/server.ts

@@ -100,12 +100,88 @@ const applyTemplateVariables = (template: string, variables: Record<string, stri
   }, template)
 }
 
+// Convert Next.js route syntax to URLPattern syntax and add basePath and locales if present
+const transformRoutePatterns = (
+  route: string,
+  basePath: string,
+  locales: string[] = [],
+): string[] => {
+  const transformedRoute = route
+    .replace(/\[\[\.\.\.(\w+)]]/g, ':$1*') // [[...slug]] -> :slug*
+    .replace(/\[\.{3}(\w+)]/g, ':$1+') // [...slug] -> :slug+
+    .replace(/\[(\w+)]/g, ':$1') // [id] -> :id
+
+  return [
+    posixJoin('/', basePath, transformedRoute),
+    ...locales.map((locale) => posixJoin('/', basePath, locale, transformedRoute)),
+  ]
+}
+
+export const getRoutes = async (ctx: PluginContext) => {
+  const routesManifest = await ctx.getRoutesManifest()
+  const prerenderManifest = await ctx.getPrerenderManifest()
+
+  // static routes
+  const staticRoutes = routesManifest.staticRoutes.map((route) => route.page)
+
+  // dynamic routes (no wildcard for routes without fallback)
+  const dynamicRoutes = routesManifest.dynamicRoutes
+    .filter((route) => prerenderManifest.dynamicRoutes[route.page]?.fallback !== false)
+    .map((route) => route.page)
+  const prerenderedDynamicRoutes = Object.keys(prerenderManifest.routes)
+
+  // static Route Handler routes (App Router)
+  const appPathRoutesManifest = await ctx.getAppPathRoutesManifest()
+  const appRoutes = Object.values(appPathRoutesManifest)
+
+  // API handler routes (Page Router)
+  const pagesManifest = await ctx.getPagesManifest()
+  const pagesRoutes = Object.keys(pagesManifest).filter((route) => route.startsWith('/api'))
+
+  const transformedRoutes = [
+    ...staticRoutes,
+    ...dynamicRoutes,
+    ...prerenderedDynamicRoutes,
+    ...appRoutes,
+    ...pagesRoutes,
+  ].flatMap((route) =>
+    transformRoutePatterns(route, ctx.buildConfig.basePath, ctx.buildConfig.i18n?.locales),
+  )
+
+  const internalRoutes = [
+    '/_next/static/*',
+    '/_next/data/*',
+    '/_next/image/*',
+    '/_next/postponed/*',
+  ]
+
+  // route.source conforms to the URLPattern syntax, which will work with our redirect engine
+  // however this will be a superset of possible routes as it does not parse the
+  // header/cookie/query matching that Next.js offers
+  const redirects = routesManifest.redirects.map((route) => route.source)
+  const rewrites = Array.isArray(routesManifest.rewrites)
+    ? routesManifest.rewrites.map((route) => route.source)
+    : []
+
+  const uniqueRoutes = new Set([
+    ...transformedRoutes,
+    ...internalRoutes,
+    ...redirects,
+    ...rewrites,
+    // '/*', // retain the catch-all route for our initial testing
+  ])
+
+  return [...uniqueRoutes]
+}
+
 /** Get's the content of the handler file that will be written to the lambda */
 const getHandlerFile = async (ctx: PluginContext): Promise<string> => {
-  const templatesDir = join(ctx.pluginDir, 'dist/build/templates')
+  const routes = await getRoutes(ctx)
 
+  const templatesDir = join(ctx.pluginDir, 'dist/build/templates')
   const templateVariables: Record<string, string> = {
     '{{useRegionalBlobs}}': ctx.useRegionalBlobs.toString(),
+    '{{paths}}': routes.join("','"),
   }
   // In this case it is a monorepo and we need to use a own template for it
   // as we have to change the process working directory

src/build/plugin-context.ts

@@ -315,6 +315,22 @@ export class PluginContext {
     return JSON.parse(await readFile(join(this.publishDir, 'routes-manifest.json'), 'utf-8'))
   }
 
+  /**
+   * Get Next.js app path routes manifest from the build output
+   */
+  async getAppPathRoutesManifest(): Promise<Record<string, string>> {
+    return JSON.parse(
+      await readFile(join(this.publishDir, 'app-path-routes-manifest.json'), 'utf-8'),
+    )
+  }
+
+  /**
+   * Get Next.js app path routes manifest from the build output
+   */
+  async getPagesManifest(): Promise<Record<string, string>> {
+    return JSON.parse(await readFile(join(this.publishDir, 'server/pages-manifest.json'), 'utf-8'))
+  }
+
   #nextVersion: string | null | undefined = undefined
 
   /**

src/build/templates/handler.tmpl.js

@@ -44,6 +44,6 @@ export default async function handler(req, context) {
 }
 
 export const config = {
-  path: '/*',
+  path: ['{{paths}}'],
   preferStatic: true,
 }

tests/fixtures/server-components/app/static-fetch-dynamic/[id]/page.js

@@ -0,0 +1,33 @@
+export async function generateStaticParams() {
+  return [{ id: '1' }, { id: '2' }]
+}
+
+async function getData(params) {
+  const res = await fetch(`https://api.tvmaze.com/shows/${params.id}`, {
+    next: {
+      tags: [`show-${params.id}`],
+    },
+  })
+  return res.json()
+}
+
+export default async function Page({ params }) {
+  const data = await getData(params)
+
+  return (
+    <>
+      <h1>Hello, Force Dynamically Rendered Server Component</h1>
+      <p>Paths /1 and /2 prerendered; other paths not found</p>
+      <dl>
+        <dt>Show</dt>
+        <dd>{data.name}</dd>
+        <dt>Param</dt>
+        <dd>{params.id}</dd>
+        <dt>Time</dt>
+        <dd data-testid="date-now">{new Date().toISOString()}</dd>
+      </dl>
+    </>
+  )
+}
+
+export const dynamic = 'force-dynamic'

tests/fixtures/server-components/next-env.d.ts

@@ -1,5 +1,6 @@
 /// <reference types="next" />
 /// <reference types="next/image-types/global" />
+/// <reference types="next/navigation-types/compat/navigation" />
 
 // NOTE: This file should not be edited
-// see https://nextjs.org/docs/basic-features/typescript for more information.
+// see https://nextjs.org/docs/app/building-your-application/configuring/typescript for more information.

tests/fixtures/server-components/pages/api/okay.js

@@ -0,0 +1,3 @@
+export default async function handler(req, res) {
+  return res.send({ code: 200, message: 'okay' })
+}

tests/fixtures/server-components/pages/api/posts/[id].js

@@ -0,0 +1,4 @@
+export default function handler(req, res) {
+  const { id } = req.query
+  res.send({ code: 200, message: `okay ${id}` })
+}

tests/fixtures/server-components/pages/dynamic.js

@@ -0,0 +1,11 @@
+export default function Yar({ title }) {
+  return <h1>{title}</h1>
+}
+
+export async function getServerSideProps() {
+  return {
+    props: {
+      title: 'My Page',
+    },
+  }
+}

tests/fixtures/server-components/pages/posts/dynamic/[id].js

@@ -0,0 +1,25 @@
+export default function Page({ params }) {
+  return (
+    <>
+      <h1>Hello, Dyanmically fetched show</h1>
+      <dl>
+        <dt>Param</dt>
+        <dd>{params.id}</dd>
+        <dt>Time</dt>
+        <dd data-testid="date-now">{new Date().toISOString()}</dd>
+      </dl>
+    </>
+  )
+}
+
+export async function getServerSideProps({ params }) {
+  const res = await fetch(`https://api.tvmaze.com/shows/${params.id}`)
+  const data = await res.json()
+
+  return {
+    props: {
+      params,
+      data,
+    },
+  }
+}

tests/fixtures/server-components/pages/posts/prerendered/[id].js

@@ -0,0 +1,33 @@
+export default function Page({ params }) {
+  return (
+    <>
+      <h1>Hello, Statically fetched show</h1>
+      <p>Paths /1 and /2 prerendered; other paths not found</p>
+      <dl>
+        <dt>Param</dt>
+        <dd>{params.id}</dd>
+        <dt>Time</dt>
+        <dd data-testid="date-now">{new Date().toISOString()}</dd>
+      </dl>
+    </>
+  )
+}
+
+export async function getStaticPaths() {
+  return {
+    paths: [{ params: { id: '1' } }, { params: { id: '2' } }],
+    fallback: false,
+  }
+}
+
+export async function getStaticProps({ params }) {
+  const res = await fetch(`https://api.tvmaze.com/shows/${params.id}`)
+  const data = await res.json()
+
+  return {
+    props: {
+      params,
+      data,
+    },
+  }
+}