x402 Payments
x402 Payments
Enable HTTP 402 Payment Required flows with @oviato/connect
x402 is a protocol for native web payments using HTTP 402 (Payment Required) responses. Oviato SDK provides built-in support for handling x402 payments on Base.
What is x402?
x402 enables seamless micropayments on the web:
- Server returns
402 Payment Requiredwith payment details - Client signs the payment request with user's wallet
- Server verifies signature and grants access
This enables pay-per-use APIs, premium content, and micropayments without traditional payment processors.
Quick Start: x402.pay()
The easiest way to handle x402 payments — one line handles everything:
import { x402 } from "@oviato/connect";
// Fetch with automatic payment handling
const { response, paid, amount, token } = await x402.pay(
"https://api.example.com/premium"
);
const data = await response.json();
if (paid) {
console.log(`Paid ${amount} ${token} for access`);
}x402.pay() automatically:
- Makes the initial request
- Detects 402 Payment Required
- Opens the payment popup for user approval
- Signs the payment
- Retries with the signed payment header
With Fetch Options
const { response, paid } = await x402.pay("https://api.example.com/data", {
method: "POST",
body: JSON.stringify({ query: "..." }),
headers: { "Content-Type": "application/json" },
});Low-Level: x402.sign()
For more control, use x402.sign() to sign payment headers manually:
import { x402 } from "@oviato/connect";
// Make initial request
const response = await fetch("https://api.example.com/premium");
if (response.status === 402) {
// Get payment header
const paymentHeader = response.headers.get("payment-required");
// Sign the payment
const { signedPayload } = await x402.sign({ paymentHeader });
// Retry with signature
const paidResponse = await fetch("https://api.example.com/premium", {
headers: { "payment-signature": signedPayload },
});
const data = await paidResponse.json();
}Helper Functions
Check if Payment Required
import { x402 } from "@oviato/connect";
const response = await fetch(url);
if (x402.isPaymentRequired(response)) {
// Handle 402...
}Get Payment Details
import { x402 } from "@oviato/connect";
const response = await fetch(url);
const details = x402.getPaymentDetails(response);
if (details) {
console.log("Amount:", details.accepts[0].amount);
console.log("Network:", details.accepts[0].network);
}Supported Networks
x402 payments are currently supported on Base:
base- Base Mainnetbasesepolia- Base Sepolia
API Reference
x402.pay(url, options?)
Fetch a URL with automatic x402 payment handling.
type X402PayOptions = RequestInit & {
acceptIndex?: number; // Which payment option to use (default: 0)
method?: "popup" | "iframe"; // Bridge method
};
type X402PayResult = {
response: Response; // Final HTTP response
paid: boolean; // Whether payment was made
amount?: string; // Formatted amount paid
token?: string; // Token name (e.g., "USDC")
network?: string; // Network name
};x402.sign(options)
Sign a payment-required header.
type X402SignOptions = {
paymentHeader: string | X402PaymentRequired; // Base64 header or parsed object
acceptIndex?: number; // Which payment option (default: 0)
method?: "popup" | "iframe"; // Bridge method
};
type X402SignResult = {
signedPayload: string; // Signed payment to send in header
authorization: object; // Authorization details
signature: string; // Raw signature
network: string; // Network used
chainId: number; // Chain ID
};Error Handling
import { x402 } from "@oviato/connect";
try {
const { response, paid } = await x402.pay(url);
// Success...
} catch (error) {
if (error.message.includes("User rejected")) {
console.log("User cancelled payment");
} else if (error.message.includes("Insufficient")) {
console.log("Not enough balance");
} else {
console.log("Payment failed:", error.message);
}
}Security Considerations
- Verify payment details - Always show users what they're paying for
- Check amounts - Validate payment amounts before signing
- Trusted servers only - Only pay servers you trust
- Review permissions - Users approve each payment in the signing modal
Use Cases
- Pay-per-API - Charge per API call
- Premium content - Unlock articles, videos, data
- Micropayments - Sub-cent transactions
- AI inference - Pay for compute on-demand
- Data feeds - Real-time market data access
Next Steps
- Wallet Operations - Other wallet functions
- RPC & Utilities - Query balances and transactions