@opennextjs/cloudflare 1.17.0 → 1.17.1

package/dist/cli/commands/build.d.ts

@@ -1,4 +1,17 @@
 import type yargs from "yargs";
+import type { WithWranglerArgs } from "./utils/utils.js";
+/**
+ * Implementation of the `opennextjs-cloudflare build` command.
+ *
+ * @param args
+ */
+export declare function buildCommand(args: WithWranglerArgs<{
+    skipNextBuild: boolean;
+    noMinify: boolean;
+    skipWranglerConfigCheck: boolean;
+    openNextConfigPath: string | undefined;
+    dangerouslyUseUnsupportedNextVersion: boolean;
+}>): Promise<void>;
 /**
  * Add the `build` command to yargs configuration.
  *

package/dist/cli/commands/build.js

@@ -1,12 +1,14 @@
+import logger from "@opennextjs/aws/logger.js";
 import { build as buildImpl } from "../build/build.js";
-import { createWranglerConfigIfNonExistent } from "../utils/create-config-files.js";
+import { askConfirmation } from "../utils/ask-confirmation.js";
+import { createWranglerConfigFile, findWranglerConfig } from "../utils/create-wrangler-config.js";
 import { compileConfig, getNormalizedOptions, nextAppDir, printHeaders, readWranglerConfig, withWranglerOptions, withWranglerPassthroughArgs, } from "./utils/utils.js";
 /**
  * Implementation of the `opennextjs-cloudflare build` command.
  *
  * @param args
  */
-async function buildCommand(args) {
+export async function buildCommand(args) {
     printHeaders("build");
     const { config, buildDir } = await compileConfig(args.openNextConfigPath);
     const options = getNormalizedOptions(config, buildDir);
@@ -15,7 +17,17 @@ async function buildCommand(args) {
     // Note: We don't ask when a custom config file is specified via `--config`
     //       nor when `--skipWranglerConfigCheck` is used.
     if (!projectOpts.wranglerConfigPath && !args.skipWranglerConfigCheck) {
-        await createWranglerConfigIfNonExistent(projectOpts);
+        if (!findWranglerConfig(projectOpts.sourceDir)) {
+            const confirmCreate = "No `wrangler.(toml|json|jsonc)` config file found, do you want to create one?";
+            if (await askConfirmation(confirmCreate)) {
+                await createWranglerConfigFile(projectOpts.sourceDir);
+            }
+            else {
+                logger.warn(`No Wrangler config file created
+
+(to avoid this check use the \`--skipWranglerConfigCheck\` flag or set a \`SKIP_WRANGLER_CONFIG_CHECK\` environment variable to \`yes\`)`);
+            }
+        }
     }
     const wranglerConfig = await readWranglerConfig(args);
     await buildImpl(options, config, projectOpts, wranglerConfig, args.dangerouslyUseUnsupportedNextVersion);

package/dist/cli/commands/utils/utils.d.ts

@@ -20,8 +20,12 @@ export declare function printHeaders(command: string): void;
  *
  * When users specify a custom config file but it doesn't exist, we throw an Error.
  *
+ * @throws If a custom config path is provided but the file does not exist.
+ * @throws If no config file is found and the user declines to create one.
+ *
  * @param configPath Optional path to the config file. Absolute or relative to cwd.
- * @returns OpenNext config.
+ * @returns The compiled OpenNext config and the build directory.
+ *
  */
 export declare function compileConfig(configPath: string | undefined): Promise<{
     config: import("@opennextjs/aws/types/open-next.js").OpenNextConfig;

package/dist/cli/commands/utils/utils.js

@@ -8,7 +8,8 @@ import { printHeader, showWarningOnWindows } from "@opennextjs/aws/build/utils.j
 import logger from "@opennextjs/aws/logger.js";
 import { unstable_readConfig } from "wrangler";
 import { ensureCloudflareConfig } from "../../build/utils/ensure-cf-config.js";
-import { createOpenNextConfigIfNotExistent } from "../../utils/create-config-files.js";
+import { askConfirmation } from "../../utils/ask-confirmation.js";
+import { createOpenNextConfigFile, findOpenNextConfig } from "../../utils/create-open-next-config.js";
 export const nextAppDir = process.cwd();
 /**
  * Print headers and warnings for the CLI.
@@ -27,15 +28,24 @@ export function printHeaders(command) {
  *
  * When users specify a custom config file but it doesn't exist, we throw an Error.
  *
+ * @throws If a custom config path is provided but the file does not exist.
+ * @throws If no config file is found and the user declines to create one.
+ *
  * @param configPath Optional path to the config file. Absolute or relative to cwd.
- * @returns OpenNext config.
+ * @returns The compiled OpenNext config and the build directory.
+ *
  */
 export async function compileConfig(configPath) {
     if (configPath && !existsSync(configPath)) {
         throw new Error(`Custom config file not found at ${configPath}`);
     }
+    configPath ??= findOpenNextConfig(nextAppDir);
     if (!configPath) {
-        configPath = await createOpenNextConfigIfNotExistent(nextAppDir);
+        const answer = await askConfirmation("Missing required `open-next.config.ts` file, do you want to create one?");
+        if (!answer) {
+            throw new Error("The `open-next.config.ts` file is required, aborting!");
+        }
+        configPath = createOpenNextConfigFile(nextAppDir, { cache: false });
     }
     const { config, buildDir } = await compileOpenNextConfig(configPath, { compileEdge: true });
     ensureCloudflareConfig(config);

package/dist/cli/templates/images.d.ts

@@ -22,7 +22,37 @@ export type LocalPattern = {
  * @returns A promise that resolves to the resolved request.
  */
 export declare function handleImageRequest(requestURL: URL, requestHeaders: Headers, env: CloudflareEnv): Promise<Response>;
+/**
+ * Handles requests to /cdn-cgi/image/ in development.
+ *
+ * Extracts the image URL, fetches the image, and checks the content type against
+ * Cloudflare's supported input formats.
+ *
+ * @param requestURL The full request URL.
+ * @param env The Cloudflare environment bindings.
+ * @returns A promise that resolves to the image response.
+ */
+export declare function handleCdnCgiImageRequest(requestURL: URL, env: CloudflareEnv): Promise<Response>;
+/**
+ * Parses a /cdn-cgi/image/ request URL.
+ *
+ * Extracts the image URL from the `/cdn-cgi/image/<options>/<image-url>` path format.
+ * Rejects protocol-relative URLs (`//...`). The cdn-cgi options are not parsed or
+ * validated as they are Cloudflare's concern.
+ *
+ * @param pathname The URL pathname (e.g. `/cdn-cgi/image/width=640,quality=75,format=auto/path/to/image.png`).
+ * @returns the parsed URL result or an error.
+ */
+export declare function parseCdnCgiImageRequest(pathname: string): {
+    ok: true;
+    url: string;
+    static: boolean;
+} | ErrorResult;
 export type OptimizedImageFormat = "image/avif" | "image/webp";
+type ErrorResult = {
+    ok: false;
+    message: string;
+};
 export declare function matchLocalPattern(pattern: LocalPattern, url: {
     pathname: string;
     search: string;

package/dist/cli/templates/images.js

@@ -68,19 +68,11 @@ export async function handleImageRequest(requestURL, requestHeaders, env) {
             immutable = cacheControlHeader.includes("immutable");
         }
     }
-    const [contentTypeImageStream, imageStream] = imageResponse.body.tee();
-    const imageHeaderBytes = new Uint8Array(32);
-    const contentTypeImageReader = contentTypeImageStream.getReader({
-        mode: "byob",
-    });
-    const readImageHeaderBytesResult = await contentTypeImageReader.readAtLeast(32, imageHeaderBytes);
-    if (readImageHeaderBytesResult.value === undefined) {
-        await imageResponse.body.cancel();
-        return new Response('"url" parameter is valid but upstream response is invalid', {
-            status: 400,
-        });
+    const readHeaderResult = await readImageHeader(imageResponse);
+    if (readHeaderResult instanceof Response) {
+        return readHeaderResult;
     }
-    const contentType = detectImageContentType(readImageHeaderBytesResult.value);
+    const { contentType, imageStream } = readHeaderResult;
     if (contentType === null) {
         warn(`Failed to detect content type of "${parseResult.url}"`);
         return new Response('"url" parameter is valid but image type is not allowed', {
@@ -153,6 +145,123 @@ export async function handleImageRequest(requestURL, requestHeaders, env) {
     });
     return response;
 }
+/**
+ * Handles requests to /cdn-cgi/image/ in development.
+ *
+ * Extracts the image URL, fetches the image, and checks the content type against
+ * Cloudflare's supported input formats.
+ *
+ * @param requestURL The full request URL.
+ * @param env The Cloudflare environment bindings.
+ * @returns A promise that resolves to the image response.
+ */
+export async function handleCdnCgiImageRequest(requestURL, env) {
+    const parseResult = parseCdnCgiImageRequest(requestURL.pathname);
+    if (!parseResult.ok) {
+        return new Response(parseResult.message, {
+            status: 400,
+        });
+    }
+    let imageResponse;
+    if (parseResult.url.startsWith("/")) {
+        if (env.ASSETS === undefined) {
+            return new Response("env.ASSETS binding is not defined", {
+                status: 404,
+            });
+        }
+        const absoluteURL = new URL(parseResult.url, requestURL);
+        imageResponse = await env.ASSETS.fetch(absoluteURL);
+    }
+    else {
+        imageResponse = await fetch(parseResult.url);
+    }
+    if (!imageResponse.ok || imageResponse.body === null) {
+        return new Response('"url" parameter is valid but upstream response is invalid', {
+            status: imageResponse.status,
+        });
+    }
+    const readHeaderResult = await readImageHeader(imageResponse);
+    if (readHeaderResult instanceof Response) {
+        return readHeaderResult;
+    }
+    const { contentType, imageStream } = readHeaderResult;
+    if (contentType === null || !SUPPORTED_CDN_CGI_INPUT_TYPES.has(contentType)) {
+        return new Response('"url" parameter is valid but image type is not allowed', {
+            status: 400,
+        });
+    }
+    if (contentType === SVG && !__IMAGES_ALLOW_SVG__) {
+        return new Response('"url" parameter is valid but image type is not allowed', {
+            status: 400,
+        });
+    }
+    return new Response(imageStream, {
+        headers: { "Content-Type": contentType },
+    });
+}
+/**
+ * Parses a /cdn-cgi/image/ request URL.
+ *
+ * Extracts the image URL from the `/cdn-cgi/image/<options>/<image-url>` path format.
+ * Rejects protocol-relative URLs (`//...`). The cdn-cgi options are not parsed or
+ * validated as they are Cloudflare's concern.
+ *
+ * @param pathname The URL pathname (e.g. `/cdn-cgi/image/width=640,quality=75,format=auto/path/to/image.png`).
+ * @returns the parsed URL result or an error.
+ */
+export function parseCdnCgiImageRequest(pathname) {
+    const match = pathname.match(/^\/cdn-cgi\/image\/(?<options>[^/]+)\/(?<url>.+)$/);
+    if (match === null ||
+        // Valid URLs have at least one option
+        !match.groups?.options ||
+        !match.groups?.url) {
+        return { ok: false, message: "Invalid /cdn-cgi/image/ URL format" };
+    }
+    const imageUrl = match.groups.url;
+    // The regex separator consumes one `/`, so if imageUrl starts with `/`
+    // the original URL segment was protocol-relative (`//...`).
+    if (imageUrl.startsWith("/")) {
+        return { ok: false, message: '"url" parameter cannot be a protocol-relative URL (//)' };
+    }
+    // Resolve the image URL: it may be absolute (https://...) or relative.
+    let resolvedUrl;
+    if (imageUrl.match(/^https?:\/\//)) {
+        resolvedUrl = imageUrl;
+    }
+    else {
+        // Relative URLs need a leading slash.
+        resolvedUrl = `/${imageUrl}`;
+    }
+    return {
+        ok: true,
+        url: resolvedUrl,
+        static: false,
+    };
+}
+/**
+ * Reads the first 32 bytes of an image response to detect its content type.
+ *
+ * Tees the response body so the image stream can still be consumed after detection.
+ *
+ * @param imageResponse The image response whose body to read.
+ * @returns The detected content type and image stream, or an error Response if the header bytes
+ *   could not be read.
+ */
+async function readImageHeader(imageResponse) {
+    // Note: imageResponse.body is non-null — callers check before calling.
+    const [contentTypeStream, imageStream] = imageResponse.body.tee();
+    const headerBytes = new Uint8Array(32);
+    const reader = contentTypeStream.getReader({ mode: "byob" });
+    const readResult = await reader.readAtLeast(32, headerBytes);
+    if (readResult.value === undefined) {
+        await imageResponse.body.cancel();
+        return new Response('"url" parameter is valid but upstream response is invalid', {
+            status: 400,
+        });
+    }
+    const contentType = detectImageContentType(readResult.value);
+    return { contentType, imageStream };
+}
 /**
  * Fetch call with max redirects and timeouts.
  *
@@ -268,6 +377,9 @@ function parseImageRequest(requestURL, requestHeaders) {
 /**
  * Validates that there is exactly one "url" query parameter.
  *
+ * Checks length, protocol-relative URLs, local/remote pattern matching, recursion, and protocol.
+ *
+ * @param requestURL The request URL containing the "url" query parameter.
  * @returns the validated URL or an error result.
  */
 function validateUrlQueryParameter(requestURL) {
@@ -287,7 +399,6 @@ function validateUrlQueryParameter(requestURL) {
         };
         return result;
     }
-    // The url parameter value should be a valid URL or a valid relative URL.
     const url = urls[0];
     if (url.length > 3072) {
         const result = {
@@ -515,6 +626,12 @@ const ICO = "image/x-icon";
 const ICNS = "image/x-icns";
 const TIFF = "image/tiff";
 const BMP = "image/bmp";
+/**
+ * Image content types supported as input by Cloudflare's cdn-cgi image transformation.
+ *
+ * @see https://developers.cloudflare.com/images/transform-images/#supported-input-formats
+ */
+const SUPPORTED_CDN_CGI_INPUT_TYPES = new Set([JPEG, PNG, GIF, WEBP, SVG, HEIC]);
 /**
  * Detects the content type by looking at the first few bytes of a file
  *

package/dist/cli/templates/worker.js

@@ -1,5 +1,5 @@
 //@ts-expect-error: Will be resolved by wrangler build
-import { handleImageRequest } from "./cloudflare/images.js";
+import { handleCdnCgiImageRequest, handleImageRequest } from "./cloudflare/images.js";
 //@ts-expect-error: Will be resolved by wrangler build
 import { runWithCloudflareRequestContext } from "./cloudflare/init.js";
 //@ts-expect-error: Will be resolved by wrangler build
@@ -23,14 +23,7 @@ export default {
             // Serve images in development.
             // Note: "/cdn-cgi/image/..." requests do not reach production workers.
             if (url.pathname.startsWith("/cdn-cgi/image/")) {
-                const m = url.pathname.match(/\/cdn-cgi\/image\/.+?\/(?<url>.+)$/);
-                if (m === null) {
-                    return new Response("Not Found!", { status: 404 });
-                }
-                const imageUrl = m.groups.url;
-                return imageUrl.match(/^https?:\/\//)
-                    ? fetch(imageUrl, { cf: { cacheEverything: true } })
-                    : env.ASSETS?.fetch(new URL(`/${imageUrl}`, url));
+                return handleCdnCgiImageRequest(url, env);
             }
             // Fallback for the Next default image loader.
             if (url.pathname ===

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@opennextjs/cloudflare",
   "description": "Cloudflare builder for next apps",
-  "version": "1.17.0",
+  "version": "1.17.1",
   "type": "module",
   "bin": {
     "opennextjs-cloudflare": "dist/cli/index.js"

package/dist/cli/utils/create-config-files.d.ts

@@ -1,19 +0,0 @@
-import type { ProjectOptions } from "../project-options.js";
-/**
- * Creates a `wrangler.jsonc` file for the user if a wrangler config file doesn't already exist,
- * but only after asking for the user's confirmation.
- *
- * If the user refuses a warning is shown (which offers ways to opt out of this check to the user).
- *
- * @param projectOpts The options for the project
- */
-export declare function createWranglerConfigIfNonExistent(projectOpts: ProjectOptions): Promise<void>;
-/**
- * Creates a `open-next.config.ts` file for the user if it doesn't exist, but only after asking for the user's confirmation.
- *
- * If the user refuses an error is thrown (since the file is mandatory).
- *
- * @param sourceDir The source directory for the project
- * @return The path to the created source file
- */
-export declare function createOpenNextConfigIfNotExistent(sourceDir: string): Promise<string>;

package/dist/cli/utils/create-config-files.js

@@ -1,44 +0,0 @@
-import { askConfirmation } from "./ask-confirmation.js";
-import { createOpenNextConfigFile, findOpenNextConfig } from "./create-open-next-config.js";
-import { createWranglerConfigFile, findWranglerConfig } from "./create-wrangler-config.js";
-/**
- * Creates a `wrangler.jsonc` file for the user if a wrangler config file doesn't already exist,
- * but only after asking for the user's confirmation.
- *
- * If the user refuses a warning is shown (which offers ways to opt out of this check to the user).
- *
- * @param projectOpts The options for the project
- */
-export async function createWranglerConfigIfNonExistent(projectOpts) {
-    const wranglerConfigFileExists = Boolean(findWranglerConfig(projectOpts.sourceDir));
-    if (wranglerConfigFileExists) {
-        return;
-    }
-    const answer = await askConfirmation("No `wrangler.(toml|json|jsonc)` config file found, do you want to create one?");
-    if (!answer) {
-        console.warn("No Wrangler config file created" +
-            "\n" +
-            "(to avoid this check use the `--skipWranglerConfigCheck` flag or set a `SKIP_WRANGLER_CONFIG_CHECK` environment variable to `yes`)");
-        return;
-    }
-    await createWranglerConfigFile(projectOpts.sourceDir);
-}
-/**
- * Creates a `open-next.config.ts` file for the user if it doesn't exist, but only after asking for the user's confirmation.
- *
- * If the user refuses an error is thrown (since the file is mandatory).
- *
- * @param sourceDir The source directory for the project
- * @return The path to the created source file
- */
-export async function createOpenNextConfigIfNotExistent(sourceDir) {
-    const openNextConfigPath = findOpenNextConfig(sourceDir);
-    if (!openNextConfigPath) {
-        const answer = await askConfirmation("Missing required `open-next.config.ts` file, do you want to create one?");
-        if (!answer) {
-            throw new Error("The `open-next.config.ts` file is required, aborting!");
-        }
-        return createOpenNextConfigFile(sourceDir, { cache: false });
-    }
-    return openNextConfigPath;
-}