You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

2.3 KiB

+++ title = "[TRIAGE] Cloudflare Pages SPA routing — 404 fallback config for client-side Yew router" priority = 8 status = "done" ticket_type = "task" dependencies = [] +++

This is a triage decision ticket. It must be resolved before dependent implementation tickets can proceed. Cloudflare Pages SPA routing: Yew uses client-side routing. A direct URL to `/browse` or `/quotes/:id` will 404 on Cloudflare Pages unless a fallback is configured. 1. **\_redirects file** — add a `_redirects` file to the `dist/` directory: `/* /index.html 200`. Cloudflare Pages supports this. 2. **\_headers file** — configure headers; does not fix routing by itself. 3. **Cloudflare Pages custom 404 page** — set `404.html` to be the same as `index.html`. Less clean. **Chosen approach: Option 1 — `_redirects` file.**
  • File content: /* /index.html 200
  • The 200 code is a Cloudflare Pages "proxy" (not a redirect): it serves index.html content while preserving the original URL in the browser. This is required for Yew's BrowserRouter to function correctly on direct navigation and page reloads.
  • The file lives at the quotesdb/ project root and is copied into dist/ by Trunk via <link data-trunk rel="copy-file" href="_redirects"/> in index.html.
  • Cloudflare Pages processes _redirects automatically from the uploaded artifact — no OpenTofu changes are needed in ae886f.
  • The /api/* Worker routes are claimed at the Cloudflare routing layer before Pages processes requests, so the /* /index.html 200 catch-all does not interfere with the API.

Options 2 (_headers) and 3 (duplicate 404.html) were ruled out:

  • _headers does not fix routing — it only sets response headers.
  • A 404.html copy of index.html returns HTTP 404 status, which is incorrect for valid SPA routes and can harm SEO and caching behaviour.

Implementation ticket: 9ef703 — creates the _redirects file and adds the Trunk copy-file directive to index.html. dc3d2b (Trunk.toml) depends on 9ef703 to ensure the copy-file line is not accidentally overwritten. ae886f (Pages resource) updated with resolved notes.

`chore(quotesdb): resolve triage — cloudflare-pages-spa-routing-404-fallback-config-for-clients`