Stripe Link voor AI-agents: zo bouw je betaal-flows met Claude Code

Stripe laat AI-agents nu betalen namens je gebruiker

Stripe heeft Link uitgebreid met ondersteuning voor autonome AI-agents. Gebruikers koppelen hun betaalmethode eenmalig aan Link, en kunnen vervolgens een agent autoriseren om betalingen te doen via een expliciete approval-flow. Denk aan een AI-agent die een boeking afhandelt, een abonnement verlengt, of een inkooporder plaatst zonder dat de gebruiker elke keer zelf door een checkout hoeft.

Voor jou als maker is dit interessant als je een SaaS bouwt waarbij een AI-agent handelingen uitvoert die geld kosten. Denk aan een automatische inkooptool, een booking-agent, of een AI-assistent die diensten boekt voor je klant.

Wat betekent dit voor jouw project?

Als je al een Stripe-integratie hebt in je SaaS, kun je nu nadenken over een tweede flow: niet alleen de gebruiker die zelf betaalt, maar ook een agent die betaalt namens de gebruiker. Het kritieke verschil zit in de approval-stap: de gebruiker moet expliciet toestemming geven voordat geld van rekening gaat. Dat moet je goed inbouwen, anders loop je tegen Stripe-problemen of klantvertrouwen-issues aan.

Vanavond kun je een basis leggen: een Next.js API-route die een betaalintentie aanmaakt voor een agent-actie, inclusief een simpele approval-status in je database.

Hoe pak je het aan met Claude Code?

Stap 1: vertel Claude wat je wilt bouwen

Open Claude Code in je project en start met een duidelijke context-prompt. Kopieer dit letterlijk:

Ik wil een agent-betaal-flow bouwen met Stripe. De flow werkt zo: (1) een AI-agent stelt een betaling voor, (2) de gebruiker keurt die goed via een approval-stap, (3) pas dan wordt de Stripe PaymentIntent bevestigd. Gebruik Next.js App Router met een Supabase-tabel voor approval-status. Maak eerst een plan voordat je code schrijft.

Laat Claude een plan maken. Check of de stappen logisch zijn voordat je door gaat.

Stap 2: de database-tabel voor approvals

Vraag Claude de Supabase-migratie te schrijven:

Schrijf een Supabase SQL-migratie voor een tabel agent_payment_requests met de velden: id (uuid), user_id (uuid), amount (integer, in cents), description (text), status (enum: pending, approved, rejected, completed), stripe_payment_intent_id (text nullable), created_at (timestamptz). Voeg ook Row Level Security toe zodat gebruikers alleen hun eigen rijen zien.

create type payment_request_status as enum ('pending', 'approved', 'rejected', 'completed');

create table agent_payment_requests (
  id uuid primary key default gen_random_uuid(),
  user_id uuid references auth.users not null,
  amount integer not null,
  description text not null,
  status payment_request_status not null default 'pending',
  stripe_payment_intent_id text,
  created_at timestamptz default now()
);

alter table agent_payment_requests enable row level security;

create policy "Users see own requests"
  on agent_payment_requests for all
  using (auth.uid() = user_id);

Stap 3: de API-routes laten schrijven

Je hebt twee routes nodig: een om een betaalverzoek aan te maken (agent-kant) en een om het goed te keuren (gebruiker-kant). Vraag Claude:

Schrijf twee Next.js App Router API-routes:

1. POST /api/agent/request-payment - maakt een rij aan in agent_payment_requests met status 'pending'. Body: { user_id, amount, description }.
2. POST /api/agent/approve-payment - pakt een pending request op basis van id, maakt een Stripe PaymentIntent aan, zet status op 'approved', en geeft de client_secret terug. Gebruik de Stripe Node.js SDK en de Supabase server client.

Claude schrijft de routes. Lees de code door: check of de Stripe-aanroep klopt en of de Supabase-update transactioneel genoeg is voor jouw use case.

Stap 4: een simpele approval-UI

Maak een Next.js Server Component PendingPayments dat alle agent_payment_requests met status 'pending' ophaalt voor de ingelogde gebruiker. Geef elke rij een 'Goedkeuren'-knop die de approve-payment API aanroept en daarna de Stripe Payment Element toont met de teruggegeven client_secret. Gebruik Tailwind voor de styling, houd het minimaal.

Dit geeft je een werkende UI waarbij de gebruiker ziet welke betalingen een agent wil doen, en zelf op de knop drukt.

Stap 5: testen zonder echte betaling

Vraag Claude de Stripe test-modus te configureren:

Zorg dat de Stripe-integratie in development altijd de test-API-key gebruikt (STRIPE_SECRET_KEY uit .env.local). Voeg ook een console.log toe na elke stap in de approve-flow zodat ik in de terminal kan volgen wat er gebeurt. Gebruik Stripe testkaartnummer 4242 4242 4242 4242.

Wat te checken na afloop

Je weet dat het werkt als:

• Een nieuwe rij in agent_payment_requests verschijnt met status pending na de eerste API-aanroep.
• De approval-knop in de UI een Stripe Payment Element toont (ook al is het nog een test-card-form).
• Na het invullen van de testkaart de status in Supabase naar approved en daarna completed springt.
• In je Stripe Dashboard (test-modus) een PaymentIntent zichtbaar is met de juiste amount.

Als de Payment Element niet verschijnt: check of client_secret correct wordt doorgegeven vanuit de API-response naar de frontend. Dat is de meest voorkomende fout bij een eerste Stripe-integratie met Claude Code.