withastro/astro

[@astrojs/cloudflare] Prerendering 404 page causes Server Islands to break

Opened this issue · 1 comments

austin-raey commented

Astro Info

Astro                    v5.0.9
Node                     v22.11.0
System                   macOS (arm64)
Package Manager          pnpm
Output                   server
Adapter                  @astrojs/cloudflare
Integrations             none

If this issue only occurs in one browser, which browser is a problem?

Chrome, Safari, etc.

Describe the Bug

Consider the below minimal stackblitz template using the @astrojs/cloudflare adapter. (I tried the @astrojs/node adapter and could not reproduce this).

Note that I cannot get the npm run preview command to run on Stackblitz, I recommend you download and run locally if you must.

When adding export const prerender = true to the src/pages/404.astro, and emulating a production deployment via npm run preview (i.e., astro build && wrangler pages dev ./dist), the Server Island components with server:defer no longer render. The _server-islands/ network call shows a 404.

Upon removing the export const prerender = true or setting = false, the Islands render as expected.

What's the expected result?

I would expect statically generating a 404 page does not cause Server Islands server:defer on components to break.

I'm not sure what could cause this behavior, or if it's as simple as something weird with the src/pages/404.astro file being "special".

Link to Minimal Reproducible Example

https://stackblitz.com/edit/github-fapec6as?file=src%2Fpages%2Findex.astro

Participation

  • I am willing to submit a pull request for this issue.
anonyoroshi commented

I am experiencing a similar issue with the server:defer directive on Vercel.

Environment

  • Astro version: 5.0.9
  • Node version: 20.x
  • Package Manager: pnpm
  • Output: server
  • Adapter: @astrojs/vercel

Description

When using the server:defer directive, the components fail to load on Vercel with a 404 error. This issue does not occur locally, only on Vercel deployment.

xxx.vercel.app/_server-islands/DelayedMessage?sample・・・
Failed to load resource: the server responded with a status of 404 ()

Steps to Reproduce

  1. Create a component with server:defer directive.
  2. Deploy the project to Vercel.
  3. Access the deployed site and observe the 404 error in the browser console.
  4. The UI remains with the fallback content (e.g., "読み込み中...").

Expected Behavior

The component should load correctly without a 404 error.

Actual Behavior

The component fails to load with a 404 error on Vercel, and the UI remains with the fallback content (e.g., "読み込み中...").