Server Loader: Throw Redirect

Server Loader

Server Loader: Throw Redirect

Server loaders can throw a redirect using the redirect() helper from React Router. Throwing (instead of returning) allows you to redirect from anywhere—including helper functions or nested code that wouldn't normally be able to return a Response.

Redirect Successful!

You were redirected here by the server loader. The loader detected the trigger=true parameter and issued a redirect.

When to Use Server Redirects

Authentication: Redirect unauthenticated users to login
Authorization: Redirect users without permission
Data-dependent routing: Redirect based on resource state
URL normalization: Redirect old URLs to new ones

Trigger Redirect →

Server Loader with Throw Redirect (redirect.ts)

import type { RouteLoaderArgs } from "@udibo/juniper";
import { redirect } from "react-router";

export function loader({ request }: RouteLoaderArgs): void {
  const url = new URL(request.url);
  const shouldRedirect = url.searchParams.get("trigger") === "true";

  if (shouldRedirect) {
    throw redirect("/features/data/server-loaders/redirect?redirected=true");
  }
}

Note: Click the button above to navigate with ?trigger=true. The server loader will intercept this and redirect you back here with a success message.