Ensure special chars in middleware matcher is handled (#37933)

packages/next/build/entries.ts

@@ -164,8 +164,12 @@ export function getEdgeServerEntry(opts: {
     const loaderParams: MiddlewareLoaderOptions = {
       absolutePagePath: opts.absolutePagePath,
       page: opts.page,
-      matcherRegexp:
-        opts.middleware?.pathMatcher && opts.middleware.pathMatcher.source,
+      // pathMatcher can have special characters that break the loader params
+      // parsing so we base64 encode/decode the string
+      matcherRegexp: Buffer.from(
+        (opts.middleware?.pathMatcher && opts.middleware.pathMatcher.source) ||
+          ''
+      ).toString('base64'),
     }
 
     return `next-middleware-loader?${stringify(loaderParams)}!`

packages/next/build/webpack/loaders/next-middleware-loader.ts

@@ -9,8 +9,15 @@ export type MiddlewareLoaderOptions = {
 }
 
 export default function middlewareLoader(this: any) {
-  const { absolutePagePath, page, matcherRegexp }: MiddlewareLoaderOptions =
-    this.getOptions()
+  const {
+    absolutePagePath,
+    page,
+    matcherRegexp: base64MatcherRegex,
+  }: MiddlewareLoaderOptions = this.getOptions()
+  const matcherRegexp = Buffer.from(
+    base64MatcherRegex || '',
+    'base64'
+  ).toString()
   const stringifiedPagePath = stringifyRequest(this, absolutePagePath)
   const buildInfo = getModuleBuildInfo(this._module)
   buildInfo.nextEdgeMiddleware = {

test/e2e/middleware-matcher/app/middleware.js

@@ -1,7 +1,12 @@
 import { NextResponse } from 'next/server'
 
 export const config = {
-  matcher: ['/with-middleware/:path*', '/another-middleware/:path*'],
+  matcher: [
+    '/with-middleware/:path*',
+    '/another-middleware/:path*',
+    // the below is testing special characters don't break the build
+    '/_sites/:path((?![^/]*\\.json$)[^/]+$)',
+  ],
 }
 
 export default (req) => {