Best way to fetch API data in Next.js with TanStack Query
Hey everyone,
I’m building a Next.js 15 app with the App Router and using TanStack Query for client-side fetching. My FastAPI backend needs an X-API-KEY, but putting it in the client code exposes it.
I thought about using a Next.js route to proxy requests, but then that route could be abused to hit my FastAPI with my key.
Any ideas on how to fetch the data with TanStack Query without exposing the API key?
1 Reply
xenophobic-harlequin•2mo ago
I'd put the api key in a secure, http-only, same-site cookie, then have the nextjs proxy route read that cookie and forward it as a header to fastAPI