Documentation Index Fetch the complete documentation index at: https://docs.getpara.com/llms.txt
Use this file to discover all available pages before exploring further.
Para provides a standard ViemAccount that works seamlessly with x402’s HTTP payment protocol. This guide shows you how to integrate Para wallets with x402 for stablecoin payments.
Prerequisites
Para SDK configured with API credentials
Node.js 18+ or modern browser environment
Basic understanding of Viem accounts
x402 facilitator URL (default: https://x402.org/facilitator)
Installation
Install packages
Install the required packages:
npm install @getpara/viem-v2-integration viem@^2 @coinbase/x402 x402-express --save-exact
Setup
Initialize Para SDK
import Para , { Environment } from '@getpara/web-sdk' ;
const para = new Para ( Environment . BETA , YOUR_API_KEY );
Get ViemAccount
Para provides a standard ViemAccount that works with any Viem-compatible library: import { createParaViemAccount } from '@getpara/viem-v2-integration' ;
const viemAccount = await createParaViemAccount ( para );
Usage
Client-Side Payments
import { wrapFetchWithPayment } from '@coinbase/x402' ;
// Wrap fetch with x402 payments using Para's ViemAccount
const paymentFetch = wrapFetchWithPayment ( fetch , viemAccount );
// Make payment-enabled requests
const response = await paymentFetch ( 'https://api.example.com/premium' );
const data = await response . json ();
React Hook Integration
import { useAccount } from '@getpara/react-sdk' ;
import { createParaViemAccount } from '@getpara/viem-v2-integration' ;
import { wrapFetchWithPayment } from '@coinbase/x402' ;
function PaymentComponent () {
const { para } = useAccount ();
const handlePayment = async () => {
const viemAccount = await createParaViemAccount ( para );
const paymentFetch = wrapFetchWithPayment ( fetch , viemAccount );
const response = await paymentFetch ( '/api/endpoint' );
const data = await response . json ();
console . log ( 'Payment complete:' , data );
};
return < button onClick ={ handlePayment }> Pay with Para </ button > ;
}
Server-Side Setup
Configure middleware
Set up your Express server with x402 payment middleware: import express from 'express' ;
import { paymentMiddleware } from 'x402-express' ;
import { facilitator } from '@coinbase/x402' ;
const app = express ();
Apply payment middleware
Configure the middleware with your wallet address and pricing: app . use ( '/api/premium' , paymentMiddleware (
'0xYourWalletAddress' , // Your receiving wallet
{
'GET /api/premium' : {
price: '$0.01' ,
network: 'base'
}
},
facilitator // or { url: 'https://x402.org/facilitator' } for testnet
));
Create protected endpoint
Add your protected endpoint and start the server: app . get ( '/api/premium' , ( req , res ) => {
res . json ({ data: 'Premium content' });
});
app . listen ( 3000 );
Examples
Autonomous Agent
Build an agent that makes autonomous payments:
import Para , { Environment } from '@getpara/server-sdk' ;
import { createParaViemAccount } from '@getpara/viem-v2-integration' ;
import { wrapFetchWithPayment } from '@coinbase/x402' ;
class PaymentAgent {
private para : Para ;
private viemAccount : any ;
async initialize () {
this . para = new Para ( Environment . BETA , process . env . PARA_API_KEY );
this . viemAccount = await createParaViemAccount ( this . para );
}
async payForService ( url : string , maxAmount : string ) {
const paymentFetch = wrapFetchWithPayment ( fetch , this . viemAccount , {
maxAmount
});
return await paymentFetch ( url );
}
}
// Usage
const agent = new PaymentAgent ();
await agent . initialize ();
const response = await agent . payForService ( 'https://api.example.com/premium' , '0.10' );
Multi-Chain Payments
Use Para’s multi-chain support with x402:
import { createParaViemAccount } from '@getpara/viem-v2-integration' ;
import { http } from 'viem' ;
import { base , ethereum , polygon } from 'viem/chains' ;
// Create Para Viem client with multi-chain support
const paraClient = createParaViemAccount ( para , {
chain: base , // Default chain
transport: http ()
});
// Use with x402 - automatically handles chain switching
const paymentFetch = wrapFetchWithPayment ( fetch , paraClient . account );
Next Steps
x402 Documentation Learn more about the x402 payment protocol
Viem Guide Explore Para’s Viem integration in detail
Bulk Wallet Pregeneration Intermediate · 25 min · Large-scale wallet generation
Miden Integration Intermediate · 25 min · Zero-knowledge virtual machine
Chrome Extension Integration Advanced · 45 min · Browser extensions with Para wallets