Handle for Webpack

Author: devjiwonchoi

packages/next/src/build/analysis/get-page-static-info.ts

@@ -40,6 +40,7 @@ import {
 } from '../segment-config/middleware/middleware-config'
 import { normalizeAppPath } from '../../shared/lib/router/utils/app-paths'
 import { normalizePagePath } from '../../shared/lib/page-path/normalize-page-path'
+import { isProxyFile } from '../utils'
 
 const PARSE_PATTERN =
   /(?<!(_jsx|jsx-))runtime|preferredRegion|getStaticProps|getServerSideProps|generateStaticParams|export const|generateImageMetadata|generateSitemaps|middleware|proxy/
@@ -756,14 +757,17 @@ export async function getPagesPageStaticInfo({
     warnAboutExperimentalEdge(isAnAPIRoute ? page! : null)
   }
 
-  if (
-    (page === `/${PROXY_FILENAME}` || page === `/src/${PROXY_FILENAME}`) &&
-    isEdgeRuntime(resolvedRuntime)
-  ) {
-    resolvedRuntime = SERVER_RUNTIME.nodejs
-    const message = `Proxy does not support Edge runtime.`
+  // Turbopack will handle during compilation with better code frame.
+  if (!process.env.TURBOPACK && isProxyFile(page) && resolvedRuntime) {
+    const relativePath = relative(process.cwd(), pageFilePath)
+    const resolvedPath = relativePath.startsWith('.')
+      ? relativePath
+      : `./${relativePath}`
+    const message = `Route segment config is not allowed in Proxy file at "${resolvedPath}". Proxy always runs on Node.js runtime. Learn more: https://nextjs.org/docs/messages/middleware-to-proxy`
+
     if (isDev) {
-      Log.error(message)
+      Log.errorOnce(message)
+      resolvedRuntime = SERVER_RUNTIME.nodejs
     } else {
       throw new Error(message)
     }
@@ -772,7 +776,7 @@ export async function getPagesPageStaticInfo({
   if (resolvedRuntime === SERVER_RUNTIME.edge && page && !isAnAPIRoute) {
     const message = `Page ${page} provided runtime 'edge', the edge runtime for rendering is currently experimental. Use runtime 'experimental-edge' instead.`
     if (isDev) {
-      Log.error(message)
+      Log.errorOnce(message)
     } else {
       throw new Error(message)
     }

packages/next/src/build/entries.ts

@@ -43,9 +43,9 @@ import type { __ApiPreviewProps } from '../server/api-utils'
 import {
   isMiddlewareFile,
   isMiddlewareFilename,
+  isProxyFile,
   isInstrumentationHookFile,
   isInstrumentationHookFilename,
-  isProxyFilename,
 } from './utils'
 import { getPageStaticInfo } from './analysis/get-page-static-info'
 import { normalizePathSep } from '../shared/lib/page-path/normalize-path-sep'
@@ -767,12 +767,12 @@ export function runDependingOnPageType<T>(params: {
     return
   }
 
-  if (isProxyFilename(params.page)) {
+  if (isProxyFile(params.page)) {
     params.onServer()
     return
   }
 
-  if (isMiddlewareFile(params.page)) {
+  if (isMiddlewareFile(params.page) && !isProxyFile(params.page)) {
     if (params.pageRuntime === 'nodejs') {
       params.onServer()
       return

packages/next/src/build/index.ts

@@ -139,6 +139,7 @@ import {
   isAppBuiltinPage,
   collectRoutesUsingEdgeRuntime,
   collectMeta,
+  isProxyFile,
 } from './utils'
 import type { PageInfo, PageInfos } from './utils'
 import type { FallbackRouteParam, PrerenderedRoute } from './static-paths/types'
@@ -1214,13 +1215,7 @@ export default async function build(
 
       for (const rootPath of rootPaths) {
         const { name: fileBaseName, dir: fileDir } = path.parse(rootPath)
-        const isAtConventionLevel =
-          fileDir === '/' ||
-          fileDir === '/src' ||
-          // rootPaths are currently relative paths from the root directory.
-          // Add safety check here for unexpected future changes.
-          fileDir === dir ||
-          fileDir === path.join(dir, 'src')
+        const isAtConventionLevel = fileDir === '/' || fileDir === '/src'
 
         if (isAtConventionLevel && fileBaseName === MIDDLEWARE_FILENAME) {
           middlewareFilePath = rootPath
@@ -2610,30 +2605,33 @@ export default async function build(
           return serverFilesManifest
         })
 
-      const middlewareFile = rootPaths.find(
-        (p) => p.includes(MIDDLEWARE_FILENAME) || p.includes(PROXY_FILENAME)
-      )
+      const middlewareFile = proxyFilePath || middlewareFilePath
       let hasNodeMiddleware = false
 
       if (middlewareFile) {
+        // Is format of `(/src)/(proxy|middleware).<ext>`, so split by
+        // "." and get the first part, regard rest of the extensions
+        // to match the `page` value format.
+        const page = middlewareFile.split('.')[0]
+
         const staticInfo = await getStaticInfoIncludingLayouts({
           isInsideAppDir: false,
           pageFilePath: path.join(dir, middlewareFile),
           config,
           appDir,
           pageExtensions: config.pageExtensions,
           isDev: false,
-          page: 'middleware',
+          page,
         })
 
         if (staticInfo.hadUnsupportedValue) {
           errorFromUnsupportedSegmentConfig()
         }
 
-        if (staticInfo.runtime === 'nodejs') {
+        if (staticInfo.runtime === 'nodejs' || isProxyFile(page)) {
           hasNodeMiddleware = true
           functionsConfigManifest.functions['/_middleware'] = {
-            runtime: staticInfo.runtime,
+            runtime: 'nodejs',
             matchers: staticInfo.middleware?.matchers ?? [
               {
                 regexp: '^.*$',

packages/next/src/build/output/log.ts

@@ -85,3 +85,12 @@ export function warnOnce(...message: any[]) {
     warn(...message)
   }
 }
+
+const errorOnceCache = new LRUCache<string>(10_000, (value) => value.length)
+export function errorOnce(...message: any[]) {
+  const key = message.join(' ')
+  if (!errorOnceCache.has(key)) {
+    errorOnceCache.set(key, key)
+    error(...message)
+  }
+}

packages/next/src/build/utils.ts

@@ -105,14 +105,6 @@ export function isMiddlewareFilename(file?: string | null) {
   )
 }
 
-export function isMiddlewareOnlyFilename(file?: string | null) {
-  return file === MIDDLEWARE_FILENAME || file === `src/${MIDDLEWARE_FILENAME}`
-}
-
-export function isProxyFilename(file?: string | null) {
-  return file === PROXY_FILENAME || file === `src/${PROXY_FILENAME}`
-}
-
 export function isInstrumentationHookFilename(file?: string | null) {
   return (
     file === INSTRUMENTATION_HOOK_FILENAME ||
@@ -1429,6 +1421,10 @@ export function isMiddlewareFile(file: string) {
   )
 }
 
+export function isProxyFile(file: string) {
+  return file === `/${PROXY_FILENAME}` || file === `/src/${PROXY_FILENAME}`
+}
+
 export function isInstrumentationHookFile(file: string) {
   return (
     file === `/${INSTRUMENTATION_HOOK_FILENAME}` ||

packages/next/src/server/next-server.ts

@@ -1574,13 +1574,34 @@ export default class NextNodeServer extends BaseServer<
           functionsConfig?.functions?.['/_middleware']
         ) {
           // if used with top level await, this will be a promise
-          return require(
-            join(
-              /* turbopackIgnore: true */ this.distDir,
-              'server',
-              'middleware.js'
+          // Try loading middleware.js first, then proxy.js. Instead
+          // of mapping proxy to middleware as the entry, just fallback
+          // to proxy.
+          // TODO: Remove this once we handle as the single entrypoint.
+          try {
+            return require(
+              join(
+                /* turbopackIgnore: true */ this.distDir,
+                'server',
+                'middleware.js'
+              )
             )
-          )
+          } catch (middlewareErr) {
+            if (
+              isError(middlewareErr) &&
+              (middlewareErr.code === 'ENOENT' ||
+                middlewareErr.code === 'MODULE_NOT_FOUND')
+            ) {
+              return require(
+                join(
+                  /* turbopackIgnore: true */ this.distDir,
+                  'server',
+                  'proxy.js'
+                )
+              )
+            }
+            throw middlewareErr
+          }
         }
       } catch (err) {
         if (
@@ -1736,7 +1757,7 @@ export default class NextNodeServer extends BaseServer<
 
       try {
         result = await adapterFn({
-          handler: middlewareModule.middleware || middlewareModule,
+          handler: middlewareModule.proxy || middlewareModule.middleware || middlewareModule,
           request: {
             ...requestData,
             body: hasRequestBody

test/e2e/app-dir/proxy-runtime-nodejs/proxy-runtime-nodejs.test.ts

@@ -0,0 +1,12 @@
+import { nextTestSetup } from 'e2e-utils'
+
+describe('proxy-runtime-nodejs', () => {
+  const { next } = nextTestSetup({
+    files: __dirname,
+  })
+
+  it('should use nodejs runtime for proxy by default', async () => {
+    const browser = await next.browser('/foo')
+    expect(await browser.elementByCss('p').text()).toBe('hello world')
+  })
+})

test/e2e/app-dir/proxy-runtime-nodejs/proxy.ts

@@ -0,0 +1,11 @@
+import { NextRequest, NextResponse } from 'next/server'
+// Will not work in edge runtime
+import { join } from 'path/posix'
+
+export function proxy(request: NextRequest) {
+  if (request.nextUrl.pathname === join('/', 'foo')) {
+    return NextResponse.redirect(new URL('/', request.url))
+  }
+
+  return NextResponse.next()
+}

test/e2e/app-dir/proxy-runtime/proxy-runtime.test.ts

@@ -35,7 +35,9 @@ Next.js can't recognize the exported \`config\` field in route. Proxy does not s
 
 The exported configuration object in a source file needs to have a very specific format from which some properties can be statically parsed at compiled-time.`)
     } else {
-      expect(cliOutput).toContain(`Proxy does not support Edge runtime.`)
+      expect(cliOutput).toContain(
+        `Route segment config is not allowed in Proxy file at "./proxy.ts". Proxy always runs on Node.js runtime. Learn more: https://nextjs.org/docs/messages/middleware-to-proxy`
+      )
     }
 
     await next.stop()