| name | solidstart-api-routes |
| description | SolidStart API routes: export GET/POST/PATCH/DELETE functions, handle APIEvent with request/params/fetch, GraphQL and tRPC integration, session management. |
| metadata | {"globs":["src/routes/api/**/*","**/api/**/*.ts","**/api/**/*.tsx"]} |
SolidStart API Routes
API routes export HTTP method functions instead of components. API routes take priority over UI routes.
Basic API Routes
import type { APIEvent } from "@solidjs/start/server";
export async function GET({ request, params, fetch }: APIEvent) {
const users = await db.getUsers();
return { users };
}
export async function POST({ request }: APIEvent) {
const body = await request.json();
const user = await db.createUser(body);
return new Response(JSON.stringify(user), {
status: 201,
headers: { "Content-Type": "application/json" }
});
}
export async function PATCH({ request }: APIEvent) {
}
export async function DELETE({ request }: APIEvent) {
}
APIEvent Object
APIEvent contains:
request: Request object
params: Dynamic route parameters
fetch: Internal fetch for same-origin requests
export async function GET({ params }: APIEvent) {
const user = await db.getUser(params.id);
if (!user) {
return new Response("Not Found", { status: 404 });
}
return { user };
}
export async function DELETE({ params }: APIEvent) {
await db.deleteUser(params.id);
return new Response(null, { status: 204 });
}
Session Management
import { getCookie } from "vinxi/http";
export async function GET(event: APIEvent) {
const userId = getCookie("userId");
if (!userId) {
return new Response("Unauthorized", { status: 401 });
}
const user = await db.getUser(userId);
return { user };
}
Multiple Methods Handler
async function handler(event: APIEvent) {
const method = event.request.method;
if (method === "GET") {
return { data: "get" };
} else if (method === "POST") {
const body = await event.request.json();
return { data: "post", body };
}
}
export const GET = handler;
export const POST = handler;
GraphQL API
import { buildSchema, graphql } from "graphql";
import type { APIEvent } from "@solidjs/start/server";
const schema = buildSchema(`
type Query {
hello: String
}
`);
const rootValue = {
hello: () => "Hello World"
};
const handler = async (event: APIEvent) => {
const body = await event.request.json();
const result = await graphql({
schema,
source: body.query,
rootValue
});
return result;
};
export const GET = handler;
export const POST = handler;
tRPC API
import type { APIEvent } from "@solidjs/start/server";
import { fetchRequestHandler } from "@trpc/server/adapters/fetch";
import { appRouter } from "~/lib/router";
const handler = (event: APIEvent) =>
fetchRequestHandler({
endpoint: "/api/trpc",
req: event.request,
router: appRouter,
createContext: () => ({})
});
export const GET = handler;
export const POST = handler;
Best Practices
- API routes for external APIs (GraphQL, tRPC, webhooks, public REST APIs)
- Return proper status codes (200, 201, 404, 401, etc.)
- Use
fetch from APIEvent for internal requests (same-origin)
- Handle errors with proper error responses
- Use sessions for authentication in API routes