@lynoxdotio/x402-next

Next.js middleware integration for the x402 Payment Protocol. This package allows you to easily add paywall functionality to your Next.js applications using the x402 protocol.

Installation

npm install @lynoxdotio/x402-next

Quick Start

Create a middleware file in your Next.js project (e.g., middleware.ts):

import { paymentMiddleware, Network } from "@lynoxdotio/x402-next";

export const middleware = paymentMiddleware("0xYourAddress", {
  "/protected": {
    price: "$0.01",
    network: "arc-testnet",
    config: {
      description: "Access to protected content",
    },
  },
});

// Configure which paths the middleware should run on
export const config = {
  matcher: ["/protected/:path*"],
};

Configuration

The paymentMiddleware function accepts three parameters:

1. payTo: Your receiving address (0x${string})
2. routes: Route configurations for protected endpoints
3. facilitator: (Optional) Configuration for the x402 facilitator service
4. paywall: (Optional) Configuration for the built-in paywall

See the Middleware Options section below for detailed configuration options.

Middleware Options

The middleware supports various configuration options:

Route Configuration

type RoutesConfig = Record<string, Price | RouteConfig>;

interface RouteConfig {
  price: Price; // Price in USD or token amount
  network: Network; // "base" or "base-sepolia"
  config?: PaymentMiddlewareConfig;
}

Payment Configuration

interface PaymentMiddlewareConfig {
  description?: string; // Description of the payment
  mimeType?: string; // MIME type of the resource
  maxTimeoutSeconds?: number; // Maximum time for payment (default: 60)
  outputSchema?: Record<string, any>; // JSON schema for the response
  customPaywallHtml?: string; // Custom HTML for the paywall
  resource?: string; // Resource URL (defaults to request URL)
}

Facilitator Configuration

type FacilitatorConfig = {
  url: string; // URL of the x402 facilitator service
  createAuthHeaders?: CreateHeaders; // Optional function to create authentication headers
};

Paywall Configuration

For more on paywall configuration options, refer to the paywall README.

type PaywallConfig = {
  cdpClientKey?: string; // Your CDP Client API Key
  appName?: string; // Name displayed in the paywall wallet selection modal
  appLogo?: string; // Logo for the paywall wallet selection modal
  sessionTokenEndpoint?: string; // API endpoint for Coinbase Onramp session authentication
};

Resources

• x402 Protocol