I've found a few similar questions with auth redirects, and I thought I've ticked all the boxes, but I still can't get a server redirect happening as soon as there's an await.
Everything works, response is logged properly, but the <div> still loads. As soon as I remove the fetch, the redirect works. I've tried with/without <Suspense>, reading/not reading the routeData, throwing or returning the redirect.
To replicate, - create a new solid start typescript/tailwind project. - create blah.tsx in /routes and paste in:
import { createComputed, createEffect, Suspense } from "solid-js";import { useRouteData } from "solid-start";import { createServerData$, redirect } from "solid-start/server";export function routeData() { return createServerData$(async () => { const response = await fetch("http://swapi.dev/api/planets/1"); const json = await response.json(); console.log(`fetched, got response`, json); return redirect(`/about`); // Also tried throw redirect(`/about`); });}export default function Blah() { const data = useRouteData(); createEffect(() => { // Read in discord that you need to access the routeData for it to properly execute?? console.log(`data`, data); }); return <div>You shouldn't see me.</div>;}
import { createComputed, createEffect, Suspense } from "solid-js";import { useRouteData } from "solid-start";import { createServerData$, redirect } from "solid-start/server";export function routeData() { return createServerData$(async () => { const response = await fetch("http://swapi.dev/api/planets/1"); const json = await response.json(); console.log(`fetched, got response`, json); return redirect(`/about`); // Also tried throw redirect(`/about`); });}export default function Blah() { const data = useRouteData(); createEffect(() => { // Read in discord that you need to access the routeData for it to properly execute?? console.log(`data`, data); }); return <div>You shouldn't see me.</div>;}
- navigate to
http://localhost:3000/blah
http://localhost:3000/blah
, see the response logged, and also see the forbidden