[wip] feat: support node middleware

Author: pieh

src/build/content/server.ts

@@ -133,7 +133,13 @@ export const copyNextServerCode = async (ctx: PluginContext): Promise<void> => {
         }
 
         if (path === 'server/functions-config-manifest.json') {
-          await verifyFunctionsConfigManifest(join(srcDir, path))
+          try {
+            await replaceFunctionsConfigManifest(srcPath, destPath)
+          } catch (error) {
+            throw new Error('Could not patch functions config manifest file', { cause: error })
+          }
+
+          return
         }
 
         await cp(srcPath, destPath, { recursive: true, force: true })
@@ -381,16 +387,41 @@ const replaceMiddlewareManifest = async (sourcePath: string, destPath: string) =
   await writeFile(destPath, newData)
 }
 
-const verifyFunctionsConfigManifest = async (sourcePath: string) => {
+// similar to the middleware manifest, we need to patch the functions config manifest to disable
+// the middleware that is defined in the functions config manifest. This is needed to avoid running
+// the middleware in the server handler, while still allowing next server to enable some middleware
+// specific handling such as _next/data normalization ( https://github.com/vercel/next.js/blob/7bb72e508572237fe0d4aac5418546d4b4b3a363/packages/next/src/server/lib/router-utils/resolve-routes.ts#L395 )
+const replaceFunctionsConfigManifest = async (sourcePath: string, destPath: string) => {
   const data = await readFile(sourcePath, 'utf8')
   const manifest = JSON.parse(data) as FunctionsConfigManifest
 
   // https://github.com/vercel/next.js/blob/8367faedd61501025299e92d43a28393c7bb50e2/packages/next/src/build/index.ts#L2465
   // Node.js Middleware has hardcoded /_middleware path
-  if (manifest.functions['/_middleware']) {
-    throw new Error(
-      'Only Edge Runtime Middleware is supported. Node.js Middleware is not supported.',
-    )
+  if (manifest?.functions?.['/_middleware']?.matchers) {
+    const newManifest = {
+      ...manifest,
+      functions: {
+        ...manifest.functions,
+        '/_middleware': {
+          ...manifest.functions['/_middleware'],
+          matchers: manifest.functions['/_middleware'].matchers.map((matcher) => {
+            return {
+              ...matcher,
+              // matcher that won't match on anything
+              // this is meant to disable actually running middleware in the server handler,
+              // while still allowing next server to enable some middleware specific handling
+              // such as _next/data normalization ( https://github.com/vercel/next.js/blob/7bb72e508572237fe0d4aac5418546d4b4b3a363/packages/next/src/server/lib/router-utils/resolve-routes.ts#L395 )
+              regexp: '(?!.*)',
+            }
+          }),
+        },
+      },
+    }
+    const newData = JSON.stringify(newManifest)
+
+    await writeFile(destPath, newData)
+  } else {
+    await cp(sourcePath, destPath, { recursive: true, force: true })
   }
 }
 

src/build/functions/edge.ts

@@ -194,11 +194,182 @@ export const clearStaleEdgeHandlers = async (ctx: PluginContext) => {
 }
 
 export const createEdgeHandlers = async (ctx: PluginContext) => {
+  // Edge middleware
   const nextManifest = await ctx.getMiddlewareManifest()
+  // Node middleware
+  const functionsConfigManifest = await ctx.getFunctionsConfigManifest()
+
   const nextDefinitions = [...Object.values(nextManifest.middleware)]
   await Promise.all(nextDefinitions.map((def) => createEdgeHandler(ctx, def)))
 
   const netlifyDefinitions = nextDefinitions.flatMap((def) => buildHandlerDefinition(ctx, def))
+
+  if (functionsConfigManifest?.functions?.['/_middleware']) {
+    const middlewareDefinition = functionsConfigManifest?.functions?.['/_middleware']
+    const entry = 'server/middleware.js'
+    const nft = `${entry}.nft.json`
+    const name = 'node-middleware'
+
+    // await copyHandlerDependencies(ctx, definition)
+    const srcDir = join(ctx.standaloneDir, ctx.nextDistDir)
+    // const destDir = join(ctx.edgeFunctionsDir, getHandlerName({ name }))
+
+    const fakeNodeModuleName = 'fake-module-with-middleware'
+
+    const fakeNodeModulePath = ctx.resolveFromPackagePath(join('node_modules', fakeNodeModuleName))
+
+    const nftFilesPath = join(ctx.nextDistDir, nft)
+    const nftManifest = JSON.parse(await readFile(nftFilesPath, 'utf8'))
+
+    const files: string[] = nftManifest.files.map((file: string) => join('server', file))
+    files.push(entry)
+
+    // files are relative to location of middleware entrypoint
+    // we need to capture all of them
+    // they might be going to parent directories, so first we check how many directories we need to go up
+    const maxDirsUp = files.reduce((max, file) => {
+      let dirsUp = 0
+      for (const part of file.split('/')) {
+        if (part === '..') {
+          dirsUp += 1
+        } else {
+          break
+        }
+      }
+      return Math.max(max, dirsUp)
+    }, 0)
+
+    let prefixPath = ''
+    for (let nestedIndex = 1; nestedIndex <= maxDirsUp; nestedIndex++) {
+      // TODO: ideally we preserve the original directory structure
+      // this is just hack to use arbitrary computed names to speed up hooking things up
+      prefixPath += `nested-${nestedIndex}/`
+    }
+
+    for (const file of files) {
+      const srcPath = join(srcDir, file)
+      const destPath = join(fakeNodeModulePath, prefixPath, file)
+
+      await mkdir(dirname(destPath), { recursive: true })
+
+      if (file === entry) {
+        const content = await readFile(srcPath, 'utf8')
+        await writeFile(
+          destPath,
+          // Next.js needs to be set on global even if it's possible to just require it
+          // so somewhat similar to existing shim we have for edge runtime
+          `globalThis.AsyncLocalStorage = require('node:async_hooks').AsyncLocalStorage;\n${content}`,
+        )
+      } else {
+        await cp(srcPath, destPath, { force: true })
+      }
+    }
+
+    await writeFile(join(fakeNodeModulePath, 'package.json'), JSON.stringify({ type: 'commonjs' }))
+
+    // there is `/chunks/**/*` require coming from webpack-runtime that fails esbuild due to nothing matching,
+    // so this ensure something does
+    const dummyChunkPath = join(fakeNodeModulePath, prefixPath, 'server', 'chunks', 'dummy.js')
+    await mkdir(dirname(dummyChunkPath), { recursive: true })
+    await writeFile(dummyChunkPath, '')
+
+    // await writeHandlerFile(ctx, definition)
+
+    const nextConfig = ctx.buildConfig
+    const handlerName = getHandlerName({ name })
+    const handlerDirectory = join(ctx.edgeFunctionsDir, handlerName)
+    const handlerRuntimeDirectory = join(handlerDirectory, 'edge-runtime')
+
+    // Copying the runtime files. These are the compatibility layer between
+    // Netlify Edge Functions and the Next.js edge runtime.
+    await copyRuntime(ctx, handlerDirectory)
+
+    // Writing a file with the matchers that should trigger this function. We'll
+    // read this file from the function at runtime.
+    await writeFile(
+      join(handlerRuntimeDirectory, 'matchers.json'),
+      JSON.stringify(middlewareDefinition.matchers ?? []),
+    )
+
+    // The config is needed by the edge function to match and normalize URLs. To
+    // avoid shipping and parsing a large file at runtime, let's strip it down to
+    // just the properties that the edge function actually needs.
+    const minimalNextConfig = {
+      basePath: nextConfig.basePath,
+      i18n: nextConfig.i18n,
+      trailingSlash: nextConfig.trailingSlash,
+      skipMiddlewareUrlNormalize: nextConfig.skipMiddlewareUrlNormalize,
+    }
+
+    await writeFile(
+      join(handlerRuntimeDirectory, 'next.config.json'),
+      JSON.stringify(minimalNextConfig),
+    )
+
+    const htmlRewriterWasm = await readFile(
+      join(
+        ctx.pluginDir,
+        'edge-runtime/vendor/deno.land/x/[email protected]/pkg/htmlrewriter_bg.wasm',
+      ),
+    )
+
+    // Writing the function entry file. It wraps the middleware code with the
+    // compatibility layer mentioned above.
+    await writeFile(
+      join(handlerDirectory, `${handlerName}.js`),
+      `
+    import { init as htmlRewriterInit } from './edge-runtime/vendor/deno.land/x/[email protected]/src/index.ts'
+    import { handleMiddleware } from './edge-runtime/middleware.ts';
+
+    import * as handlerMod from '${fakeNodeModuleName}/${prefixPath}${entry}';
+
+    const handler = handlerMod.default || handlerMod;
+
+    await htmlRewriterInit({ module_or_path: Uint8Array.from(${JSON.stringify([
+      ...htmlRewriterWasm,
+    ])}) });
+
+    export default (req, context) => {
+      return handleMiddleware(req, context, handler);
+    };
+    `,
+    )
+
+    // buildHandlerDefinition(ctx, def)
+    const netlifyDefinitions: Manifest['functions'] = augmentMatchers(
+      middlewareDefinition.matchers ?? [],
+      ctx,
+    ).map((matcher) => {
+      return {
+        function: getHandlerName({ name }),
+        name: `Next.js Node Middleware Handler`,
+        pattern: matcher.regexp,
+        cache: undefined,
+        generator: `${ctx.pluginName}@${ctx.pluginVersion}`,
+      }
+    })
+
+    const netlifyManifest: Manifest = {
+      version: 1,
+      functions: netlifyDefinitions,
+    }
+    await writeEdgeManifest(ctx, netlifyManifest)
+
+    return
+  }
+
+  // if (functionsConfigManifest?.functions?.['/_middleware']) {
+  //   const nextDefinition: Pick<
+  //     (typeof nextManifest.middleware)[''],
+  //     'name' | 'env' | 'files' | 'wasm' | 'matchers'
+  //   > = {
+  //     name: 'middleware',
+  //     env: {},
+  //     files: [],
+  //     wasm: [],
+  //   }
+  // }
+
   const netlifyManifest: Manifest = {
     version: 1,
     functions: netlifyDefinitions,

src/build/plugin-context.ts

@@ -14,6 +14,7 @@ import type { PrerenderManifest, RoutesManifest } from 'next/dist/build/index.js
 import type { MiddlewareManifest } from 'next/dist/build/webpack/plugins/middleware-plugin.js'
 import type { PagesManifest } from 'next/dist/build/webpack/plugins/pages-manifest-plugin.js'
 import type { NextConfigComplete } from 'next/dist/server/config-shared.js'
+import type { FunctionsConfigManifest } from 'next-with-cache-handler-v2/dist/build/index.js'
 import { satisfies } from 'semver'
 
 const MODULE_DIR = fileURLToPath(new URL('.', import.meta.url))
@@ -259,6 +260,23 @@ export class PluginContext {
     )
   }
 
+  /**
+   * Get Next.js Functions Config Manifest config if it exists from the build output
+   */
+  async getFunctionsConfigManifest(): Promise<FunctionsConfigManifest | null> {
+    const functionsConfigManifestPath = join(
+      this.publishDir,
+      'server/functions-config-manifest.json',
+    )
+
+    if (existsSync(functionsConfigManifestPath)) {
+      return JSON.parse(await readFile(functionsConfigManifestPath, 'utf-8'))
+    }
+
+    // this file might not have been produced
+    return null
+  }
+
   // don't make private as it is handy inside testing to override the config
   _requiredServerFiles: RequiredServerFilesManifest | null = null
 

tests/fixtures/middleware-node/middleware.ts

@@ -1,9 +1,10 @@
-import type { NextRequest } from 'next/server'
+import { type NextRequest, NextResponse } from 'next/server'
+import { join } from 'path'
 
-export async function middleware(request: NextRequest) {
-  console.log('Node.js Middleware request:', request.method, request.nextUrl.pathname)
+export default async function middleware(req: NextRequest) {
+  return NextResponse.json({ message: 'Hello, world!', joined: join('a', 'b') })
 }
 
 export const config = {
-  runtime: 'nodejs',
+  // runtime: 'nodejs',
 }

tests/fixtures/middleware-node/next.config.js

@@ -7,6 +7,11 @@ const nextConfig = {
   experimental: {
     nodeMiddleware: true,
   },
+  webpack: (config) => {
+    // disable minification for easier inspection of produced build output
+    config.optimization.minimize = false
+    return config
+  },
 }
 
 module.exports = nextConfig