Grantex × x402 Playground

Interactive demo of agent spend authorization for x402 payment flows

Key Generation Ed25519

GDT Issuance W3C VC 2.0

GDT Verification Ed25519 + Scope

x402 Flow Simulation HTTP 402

Watch the full agent payment flow step by step.

1
Agent sends GET request with GDTX-Grantex-GDT: eyJ...
2
API returns HTTP 402 Payment RequiredX-Payment-Amount: 0.001, X-Payment-Currency: USDC
3
Agent pays via Base L2 (USDC)Simulating on-chain transfer...
4
Agent retries with Payment Proof + GDTX-Payment-Proof: base64url(...), X-Grantex-GDT: eyJ...
5
API verifies GDT (signature, scope, limit)verifyGDT() → valid, remainingLimit: $9.999
6
API returns weather data{ forecast: "Partly Cloudy, 68°F" }

Code Examples TypeScript

import { generateKeyPair, issueGDT } from '@grantex/x402'; const principal = generateKeyPair(); const agent = generateKeyPair(); const gdt = await issueGDT({ agentDID: agent.did, scope: ['weather:read', 'news:read'], spendLimit: { amount: 10, currency: 'USDC', period: '24h' }, expiry: '24h', signingKey: principal.privateKey, });
import { verifyGDT } from '@grantex/x402'; const result = await verifyGDT(gdtToken, { resource: 'weather:read', amount: 0.001, currency: 'USDC', }); if (result.valid) { console.log('Agent:', result.agentDID); console.log('Remaining:', result.remainingLimit); } else { console.error('Rejected:', result.error); }
import { createX402Agent } from '@grantex/x402'; const x402 = createX402Agent({ gdt: gdtToken, paymentHandler: async (details) => { // Sign USDC transfer on Base L2 return await payOnBase(details); }, }); // Automatic: 402 → pay → retry with GDT const response = await x402.fetch( 'https://api.weather.xyz/forecast' );
import express from 'express'; import { x402Middleware } from '@grantex/x402'; const app = express(); app.use('/api/weather', x402Middleware({ requiredScopes: ['weather:read'], currency: 'USDC', })); app.get('/api/weather/forecast', (req, res) => { const { gdt } = req; res.json({ forecast: 'sunny', authorizedBy: gdt.principalDID, }); });