Skip to main content
This guide shows how to make x402 payments from the buyer’s perspective. Use the x402 SDK to handle payment flows, interact with paywalled resources, and process 402 Payment Required responses.

Prerequisites

  • Node.js and npm installed
  • A SKALE Chain endpoint
  • Understanding of x402 protocol
  • Familiarity with TypeScript/JavaScript

Overview

To buy with x402, you need to:
  1. Install the x402 SDK
  2. Handle 402 Payment Required responses
  3. Create and settle payments
  4. Retry requests with payment headers

Quick Start

Install the x402 SDK:
npm install @coinbase/x402-sdk

Basic Payment Flow

Here’s how to make a payment to access a paywalled resource:
import { X402Client } from '@coinbase/x402-sdk';
import { ethers } from 'ethers';

const provider = new ethers.JsonRpcProvider('YOUR_SKALE_RPC_URL');
const wallet = new ethers.Wallet(PRIVATE_KEY, provider);

const x402Client = new X402Client({
  wallet: wallet,
  facilitatorURL: 'https://facilitator.dirtroad.dev',
});

async function accessPaywalledResource(url: string) {
  const response = await fetch(url);
  
  if (response.status === 402) {
    const paymentInfo = await response.json();
    const payment = await x402Client.createPayment(paymentInfo);
    await x402Client.settle(payment);
    
    const retryResponse = await fetch(url, {
      headers: {
        'X-PAYMENT': JSON.stringify(payment),
      },
    });
    
    return await retryResponse.json();
  }
  
  return await response.json();
}

Using @faremeter/fetch

The Faremeter fetch wrapper automatically handles 402 responses:
import { createX402Fetch } from '@faremeter/fetch';
import { ethers } from 'ethers';

const provider = new ethers.JsonRpcProvider('YOUR_SKALE_RPC_URL');
const wallet = new ethers.Wallet(PRIVATE_KEY, provider);

const x402Fetch = createX402Fetch({
  wallet: wallet,
  facilitatorURL: 'https://facilitator.dirtroad.dev',
});

// Automatically handles 402 responses
const data = await x402Fetch('https://api.example.com/premium-data');

Payment Options

Handle multiple payment options:
async function accessResourceWithOptions(url: string) {
  const response = await fetch(url);
  
  if (response.status === 402) {
    const paymentInfo = await response.json();
    const selectedOption = paymentInfo.accepts[0];
    
    const payment = await x402Client.createPayment({
      ...selectedOption,
      resource: url,
    });
    
    await x402Client.settle(payment);
    
    const retryResponse = await fetch(url, {
      headers: {
        'X-PAYMENT': JSON.stringify(payment),
      },
    });
    
    return await retryResponse.json();
  }
  
  return await response.json();
}

Error Handling

async function accessResource(url: string) {
  const response = await fetch(url);
  
  if (response.status === 402) {
    const paymentInfo = await response.json();
    const payment = await x402Client.createPayment(paymentInfo);
    await x402Client.settle(payment);
    
    const retryResponse = await fetch(url, {
      headers: {
        'X-PAYMENT': JSON.stringify(payment),
      },
    });
    
    if (retryResponse.status === 402) {
      throw new Error('Payment settlement failed');
    }
    
    return await retryResponse.json();
  }
  
  return await response.json();
}

Next Steps

Resources