Better support for cloudflare external middleware

packages/open-next/src/adapters/middleware.ts

@@ -37,8 +37,12 @@ const resolveOriginResolver = () => {
               return origin[key];
             }
           }
+          if (_path.startsWith("/_next/image") && origin["imageOptimizer"]) {
+            debug("Using origin", "imageOptimizer", _path);
+            return origin["imageOptimizer"];
+          }
           if (origin["default"]) {
-            debug("Using default origin", origin["default"]);
+            debug("Using default origin", origin["default"], _path);
             return origin["default"];
           }
           return false as const;
@@ -65,6 +69,7 @@ const defaultHandler = async (internalEvent: InternalEvent) => {
       internalEvent: result.internalEvent,
       isExternalRewrite: result.isExternalRewrite,
       origin,
+      isISR: result.isISR,
     };
   } else {
     debug("Middleware response", result);

packages/open-next/src/adapters/plugins/without-routing/requestHandler.ts

@@ -9,6 +9,7 @@ const preprocessResult: MiddlewareOutputEvent = {
   internalEvent: internalEvent,
   isExternalRewrite: false,
   origin: false,
+  isISR: false,
 };
 //#endOverride
 

packages/open-next/src/build.ts

@@ -726,7 +726,11 @@ async function createMiddleware() {
     fs.mkdirSync(outputPath, { recursive: true });
 
     // Copy open-next.config.mjs
-    copyOpenNextConfig(options.tempDir, outputPath);
+    copyOpenNextConfig(
+      options.tempDir,
+      outputPath,
+      config.middleware.override?.wrapper === "cloudflare",
+    );
 
     // Bundle middleware
     await buildEdgeBundle({

packages/open-next/src/converters/edge.ts

@@ -1,3 +1,5 @@
+import { Buffer } from "node:buffer";
+
 import { parseCookies } from "http/util";
 import { Converter, InternalEvent, InternalResult } from "types/open-next";
 
@@ -28,13 +30,15 @@ const converter: Converter<
       headers[key] = value;
     });
     const rawPath = new URL(event.url).pathname;
+    const method = event.method;
+    const shouldHaveBody = method !== "GET" && method !== "HEAD";
 
     return {
       type: "core",
-      method: event.method,
+      method,
       rawPath,
       url: event.url,
-      body: event.method !== "GET" ? Buffer.from(body) : undefined,
+      body: shouldHaveBody ? Buffer.from(body) : undefined,
       headers: headers,
       remoteAddress: (event.headers.get("x-forwarded-for") as string) ?? "::1",
       query,
@@ -68,7 +72,13 @@ const converter: Converter<
         },
       });
 
-      return fetch(req);
+      const cfCache = result.isISR ? { cacheEverything: true } : {};
+
+      return fetch(req, {
+        // This is a hack to make sure that the response is cached by Cloudflare
+        // @ts-expect-error - This is a Cloudflare specific option
+        cf: cfCache,
+      });
     } else {
       const headers = new Headers();
       for (const [key, value] of Object.entries(result.headers)) {

packages/open-next/src/core/requestHandler.ts

@@ -33,6 +33,7 @@ export async function openNextHandler(
     internalEvent: internalEvent,
     isExternalRewrite: false,
     origin: false,
+    isISR: false,
   };
   try {
     preprocessResult = await routingHandler(internalEvent);

packages/open-next/src/core/routing/matcher.ts

@@ -348,7 +348,7 @@ export function fixDataPage(
 export function handleFallbackFalse(
   internalEvent: InternalEvent,
   prerenderManifest: PrerenderManifest,
-): InternalEvent {
+): { event: InternalEvent; isISR: boolean } {
   const { rawPath } = internalEvent;
   const { dynamicRoutes, routes } = prerenderManifest;
   const routeFallback = Object.entries(dynamicRoutes)
@@ -365,17 +365,24 @@ export function handleFallbackFalse(
   const localizedPath = routesAlreadyHaveLocale
     ? rawPath
     : `/${NextConfig.i18n?.defaultLocale}${rawPath}`;
-  if (routeFallback && !Object.keys(routes).includes(localizedPath)) {
+  const isPregenerated = Object.keys(routes).includes(localizedPath);
+  if (routeFallback && !isPregenerated) {
     return {
-      ...internalEvent,
-      rawPath: "/404",
-      url: "/404",
-      headers: {
-        ...internalEvent.headers,
-        "x-invoke-status": "404",
+      event: {
+        ...internalEvent,
+        rawPath: "/404",
+        url: "/404",
+        headers: {
+          ...internalEvent.headers,
+          "x-invoke-status": "404",
+        },
       },
+      isISR: false,
     };
   }
 
-  return internalEvent;
+  return {
+    event: internalEvent,
+    isISR: routeFallback || isPregenerated,
+  };
 }

packages/open-next/src/core/routingHandler.ts

@@ -20,6 +20,7 @@ export interface MiddlewareOutputEvent {
   internalEvent: InternalEvent;
   isExternalRewrite: boolean;
   origin: Origin | false;
+  isISR: boolean;
 }
 
 const staticRegexp = RoutesManifest.routes.static.map(
@@ -84,7 +85,11 @@ export default async function routingHandler(
   }
 
   // We want to run this just before the dynamic route check
-  internalEvent = handleFallbackFalse(internalEvent, PrerenderManifest);
+  const { event: fallbackEvent, isISR } = handleFallbackFalse(
+    internalEvent,
+    PrerenderManifest,
+  );
+  internalEvent = fallbackEvent;
 
   const isDynamicRoute =
     !isExternalRewrite &&
@@ -108,6 +113,8 @@ export default async function routingHandler(
     internalEvent.rawPath === "/api" ||
     internalEvent.rawPath.startsWith("/api/");
 
+  const isNextImageRoute = internalEvent.rawPath.startsWith("/_next/image");
+
   const isRouteFoundBeforeAllRewrites =
     isStaticRoute || isDynamicRoute || isExternalRewrite;
 
@@ -116,6 +123,7 @@ export default async function routingHandler(
   if (
     !isRouteFoundBeforeAllRewrites &&
     !isApiRoute &&
+    !isNextImageRoute &&
     // We need to check again once all rewrites have been applied
     !staticRegexp.some((route) =>
       route.test((internalEvent as InternalEvent).rawPath),
@@ -154,5 +162,6 @@ export default async function routingHandler(
     internalEvent,
     isExternalRewrite,
     origin: false,
+    isISR,
   };
 }

packages/open-next/src/wrappers/cloudflare.ts

@@ -18,7 +18,7 @@ const handler: WrapperHandler<
 
     const response = await handler(internalEvent);
 
-    const result: Response = converter.convertTo(response);
+    const result: Response = await converter.convertTo(response);
 
     return result;
   };