Client Path
Lesson 2 of 8
15 min

Your First x402 Request

Learning Objectives

  • Install and configure @x402/fetch
  • Make your first paid API call
  • Understand what happens behind the scenes
  • View payment transactions on Base explorer

The Easy Way

The @x402/fetch library handles the entire payment flow automatically. You just use it like the regular fetch() function, and it takes care of detecting 402 responses, signing payments, submitting to the facilitator, and retrying with proof.

typescript
import { wrapFetchWithPayment } from "@x402/fetch";
import { x402Client } from "@x402/core/client";
import { registerExactEvmScheme } from "@x402/evm/exact/client";
import { privateKeyToAccount } from "viem/accounts";

// Setup: Create signer and client
const evmSigner = privateKeyToAccount(process.env.PRIVATE_KEY as `0x${string}`);
const client = new x402Client();
registerExactEvmScheme(client, { signer: evmSigner });

// Wrap fetch with payment capabilities
const fetchWithPayment = wrapFetchWithPayment(fetch, client);

// Use it just like fetch()
const response = await fetchWithPayment('https://api.example.com/data');
const data = await response.json();
console.log('Paid and received:', data);

Interactive Playground

typescript
Output

Click "Run Code" to see the output