Typed Search Params

Astro only supports search params on routes that are server-side-rendered.

You can add typed search params in your project by adding a searchSchema in the route.


Declaring Search Schema

Start by adding any Standard Schema compliant schema to your route.

The schema must be an object at the root, but that fields inside that object can be any JSON serializable type.

Astro Typesafe Routes will serialize and deserialize the search params internally.

---
import { createRoute } from "astro-typesafe-routes/create-route";
import { z } from "astro:content";

export const Route = createRoute({
  routeId: "/",
  searchSchema: z.object({
    limit: z.number(),
    filter: z.string(),
  })
});
---

Reading Search Params

You can read the typesafe and deserialized search params by calling Route.getSearch.

---
import { createRoute } from "astro-typesafe-routes/create-route";
import { z } from "astro:content";

export const Route = createRoute({
  routeId: "/",
  searchSchema: z.object({
    limit: z.number(),
    filter: z.string(),
  })
});

const search = Route.getSearch(Astro);
---