api-integration

Proxy Next.js API routes to FastAPI with cookie forwarding and typed clients.

Updated Dec 16, 2025
One-click install
npx skills add https://github.com/adelabdelgawad/meal_request --skill api-integration-adelabdelgawad
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: api-integration
Source: https://github.com/adelabdelgawad/meal_request/tree/main/.claude/skills/api-integration
Command: npx skills add https://github.com/adelabdelgawad/meal_request --skill api-integration-adelabdelgawad

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Next.js frontend often needs to securely call a FastAPI backend while preserving authentication cookies across server boundaries. This skill provides a proven pattern to proxy /api/* routes, forward cookies, and propagate Set-Cookie headers correctly to maintain session integrity.

Core Features & Use Cases

  • API Route Proxies: Implement Next.js API routes that forward requests to FastAPI with proper cookie handling.
  • Cookie Forwarding & Set-Cookie Propagation: Ensure authentication tokens flow between client, Next.js server, and FastAPI backend.
  • Server Actions & SSR: Support server-side data fetching for Server Components via server actions.
  • Typed Client & Server APIs: Provide typed API clients for client and server code and consistent error handling.
  • SWR Integration: Use SWR with typed results and stable data fetching patterns.

Quick Start

Use the api-integration skill to create a new Next.js API proxy route that forwards cookies to the FastAPI backend and implements a server action for fetching user data.

Frequently Asked Questions about api-integration

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I proxy Next.js API routes to FastAPI while forwarding cookies?

Proxying Next.js API routes to FastAPI involves forwarding requests through /api/v1 endpoints while ensuring authentication cookies flow safely between the client, Next.js server, and backend. This pattern propagates Set-Cookie headers to maintain session integrity.

Why does my FastAPI backend lose authentication cookies when called from Next.js server actions?

FastAPI loses authentication cookies from Next.js server actions when cookie forwarding is not explicitly implemented across server boundaries. Proper cookie handling requires forwarding cookies from the incoming Next.js request to the downstream FastAPI proxy route.

What is the best way to hide FastAPI backend URLs from the Next.js client?

Hiding FastAPI backend URLs from the Next.js client is achieved by proxying API requests through Next.js /api/* routes. This pattern exposes only the Next.js server endpoints to the client while internally routing traffic to the FastAPI backend.

Can I use SWR with typed API clients for Next.js server actions and FastAPI?

SWR integrates with typed API clients by using stable data fetching patterns that return typed results. This works alongside Next.js server actions for SSR data fetching, ensuring consistent typing across both client and server API boundaries.

Does proxying Next.js to FastAPI support Set-Cookie propagation for server-side rendering?

Proxying Next.js to FastAPI fully supports Set-Cookie propagation for server-side rendering by intercepting backend responses. It extracts Set-Cookie headers and applies them to the client-facing response, preserving session state during SSR data fetching.

How to implement typed client and server APIs for Next.js and FastAPI proxy routes?

Typed client and server APIs for Next.js and FastAPI proxy routes are implemented by defining shared types for requests and responses. This enforces consistent error handling and typing across client-side fetching and server actions without exposing backend URLs.