3 replies

Astro Hybrid output with Server Endpoints (API Routes)

Has anyone managed to get Astro with

output: "hybrid"

output: "hybrid"

mode working in CloudFlare pages with Server Endpoints https://docs.astro.build/en/guides/endpoints/#server-endpoints-api-routes

Astro docs on CloudFlare adapter https://docs.astro.build/en/guides/integrations-guide/cloudflare/ claim that:

This adapter allows Astro to deploy your
hybrid
hybrid
or
server
server
rendered site to Cloudflare.

But no matter what, I haven't been able to to get API Routes working with CloudFlare pages on "hybrid" mode. If I change to "server" output, then the API routes immediately start working.

I'm using latest dependencies of everything with minimal setup. I've tried all sorts of combinations.

So with server mode and with this configuration, it works:

export default defineConfig({
    output: "server",
    adapter: cloudflare({
        imageService: "compile",
        mode: "directory",
        routes: {
            strategy: "include",
            include: ["/api/*"],
        },
    }),
});

export default defineConfig({
    output: "server",
    adapter: cloudflare({
        imageService: "compile",
        mode: "directory",
        routes: {
            strategy: "include",
            include: ["/api/*"],
        },
    }),
});

… but if I change that output value to

hybrid

hybrid

, it stops working. Or it "works" but it acts like a Static Endpoint, always returning

Hello World!

Hello World!

and ignoring the url search params.

My super simple test endpoint at

src/pages/api/hello.ts

src/pages/api/hello.ts

looks like this:

import { type APIRoute } from "astro";

export const GET: APIRoute = ({ request }) => {
    const url = new URL(request.url);
    const name = url.searchParams.get("name") || "World";

    return new Response(
        JSON.stringify({
            message: `Hello ${name}!`,
        }),
        {
            status: 200,
            headers: {
                "Content-Type": "application/json",
            },
        },
    );
};

import { type APIRoute } from "astro";

export const GET: APIRoute = ({ request }) => {
    const url = new URL(request.url);
    const name = url.searchParams.get("name") || "World";

    return new Response(
        JSON.stringify({
            message: `Hello ${name}!`,
        }),
        {
            status: 200,
            headers: {
                "Content-Type": "application/json",
            },
        },
    );
};

Astro Hybrid output with Server Endpoints (API Routes)

Has anyone managed to get Astro with

output: "hybrid"

output: "hybrid"

This adapter allows Astro to deploy your
hybrid
hybrid
or
server
server
rendered site to Cloudflare.

export default defineConfig({
    output: "server",
    adapter: cloudflare({
        imageService: "compile",
        mode: "directory",
        routes: {
            strategy: "include",
            include: ["/api/*"],
        },
    }),
});

export default defineConfig({
    output: "server",
    adapter: cloudflare({
        imageService: "compile",
        mode: "directory",
        routes: {
            strategy: "include",
            include: ["/api/*"],
        },
    }),
});

… but if I change that output value to

hybrid

hybrid

, it stops working. Or it "works" but it acts like a Static Endpoint, always returning

Hello World!

Hello World!

and ignoring the url search params.

My super simple test endpoint at

src/pages/api/hello.ts

src/pages/api/hello.ts

looks like this:

import { type APIRoute } from "astro";

export const GET: APIRoute = ({ request }) => {
    const url = new URL(request.url);
    const name = url.searchParams.get("name") || "World";

    return new Response(
        JSON.stringify({
            message: `Hello ${name}!`,
        }),
        {
            status: 200,
            headers: {
                "Content-Type": "application/json",
            },
        },
    );
};

import { type APIRoute } from "astro";

export const GET: APIRoute = ({ request }) => {
    const url = new URL(request.url);
    const name = url.searchParams.get("name") || "World";

    return new Response(
        JSON.stringify({
            message: `Hello ${name}!`,
        }),
        {
            status: 200,
            headers: {
                "Content-Type": "application/json",
            },
        },
    );
};

Astro Hybrid output with Server Endpoints (API Routes)

Similar Threads

Astro Hybrid output with Server Endpoints (API Routes)

Similar Threads

Similar Threads

Similar Threads