Skip to main content
To have your coding agent write the integration, install the Dodo Agent Plugin. It adds the Dodo Payments skills and MCP servers to Claude Code, Codex CLI, Cursor, VS Code / GitHub Copilot, Kiro, and OpenCode.
You’ll build PixelGen AI, a sample AI image generation service that bills customers per image with usage-based billing. You create the billing meter, the product, and sample application code that generates images and reports each one to Dodo Payments as it happens.
This tutorial provides sample code for a terminal application. You can adapt the code to your framework, such as React, Vue, or Angular, and to the way your application collects user input.
When you finish, you’ll have a working sample service that:
  • Generates images with OpenAI’s gpt-image-2.5-flare model.
  • Tracks every image generation for billing.
  • Charges customers for the images they generate.
  • Handles two quality tiers, medium and high.

What We’re Building

PixelGen AI works like this:
  • Service: AI image generation with the OpenAI Image API
  • Pricing Model: Pay per image ($0.05 per image)
  • Free Tier: 10 free images per customer per month
  • Quality Options: medium and high quality images, at the same price
Before you start, you need:
  • A Dodo Payments account.
  • Access to the OpenAI API. OpenAI may require API Organization Verification before you use GPT Image models.
  • Node.js 22 or later, and working knowledge of TypeScript and Node.js.

Step 1: Create Your Usage Meter

Create a meter in the Dodo Payments dashboard that tracks every image the service generates. The meter counts the billable events.
Create Meter form in the Dodo Payments dashboard
What you’re building: A meter named “Image Generation Meter” that counts every image generation.
1

Open the Meters Section

  1. Log in to the Dodo Payments dashboard.
  2. Go to Products → Meters in the sidebar.
  3. Click Create Meter.
The meter form opens.
2

Enter the Meter Details

Enter the details for PixelGen AI:Meter Name: Image Generation MeterDescription: Tracks each AI image generation request made by customers using our OpenAI image serviceEvent Name: image.generated
The event name image.generated must match the event name the application code sends. Event names are case-sensitive.
3

Configure How Images Are Counted

Set the aggregation, which controls how the meter combines events:Aggregation Type: CountMeasurement Unit: images
Count bills per image generated, not by size or generation time. Each successful image is one billable unit.
4

Add Quality Filtering

Event filtering on the meter form with two quality conditions joined by OR
Count only real images, not test runs or malformed events:
  1. Turn on Enable Event Filtering.
  2. Set the match logic to OR, so an event counts when any condition matches.
  3. Add the first condition:
    • Key: quality
    • Operator: equals
    • Value: medium
  4. Click Add condition and add the second one:
    • Key: quality
    • Operator: equals
    • Value: high
With this filter, the meter counts only events whose quality is medium or high, and ignores test or malformed events.
5

Create Your Meter

  1. Check that every setting matches the values above. You can’t edit a meter after you create it.
  2. Click Create Meter.
Meter created. The “Image Generation Meter” is ready to count image generations. Next, connect it to a billing product.

Step 2: Create Your Billing Product

Create a product that defines the pricing: $0.05 per image, with 10 free images. The product connects the meter to billing.
What you’re building: A product called “PixelGen AI - Image Generation” that charges $0.05 per image after the first 10 free images each month.
1

Navigate to Products

  1. In the Dodo Payments dashboard, click Products in the sidebar.
  2. Click Add Product.
  3. Under Pricing Type, select Usage Based Billing.
With this pricing type, Dodo Payments bills from meter usage instead of a fixed subscription price.
2

Enter Product Details

Enter these values:Product Name: PixelGen AI - Image GenerationDescription: AI-powered image generation service with pay-per-use billingProduct Image: Upload a clear, relevant image.
The name and description appear on customer invoices.
3

Connect Your Meter

Usage Based Billing pricing on the product form with the Associated Meters section
Check that the product’s pricing type is Usage Based Billing.Set the Price to 0, so customers pay only for usage, with no base fee.Then link the meter you created:
  1. Scroll to the Associated Meters section.
  2. Click Add meters.
  3. Select “Image Generation Meter” from the dropdown.
  4. Confirm that the meter appears in the product configuration.
The meter is connected to the product.
4

Set Your Pricing

Define the per-image price and the free tier:
Meter pricing with price per unit and free threshold fields
Price per unit: 0.05, which is $0.05 per image.Free Threshold: 10. Each customer gets 10 free images per month.
How billing works: A customer who generates 25 images in a month pays for 15 images (25 − 10 free). 15 × $0.05 = $0.75.
5

Save Your Product

  1. Review the settings:
    • Name: PixelGen AI - Image Generation
    • Meter: Image Generation Meter
    • Price: $0.05 per image
    • Free tier: 10 images
  2. Click Save Changes.
Product created. Billing is configured, and customers are charged for the images they generate.

Step 3: Make a Test Purchase

Buy the product once in test mode. The purchase creates the customer that the app sends usage events for.
1

Get Your Payment Link

  1. In the Dodo Payments dashboard, go to Products.
  2. Find the “PixelGen AI - Image Generation” product.
  3. Click Share next to the product.
  4. Copy the payment link.
The payment link looks like https://test.checkout.dodopayments.com/buy/pdt_IgPWlRsfpbPd5jQKezzW1?quantity=1.
2

Complete a Test Purchase

  1. Open the payment link in a new browser tab.
  2. Enter test payment details and complete the purchase.
After the payment succeeds, the purchase creates a customer. The application code uses that customer’s ID.
3

Find Your Customer ID

  1. Go back to the Dodo Payments dashboard.
  2. Go to Sales → Customers in the sidebar.
  3. Find the customer you created, by its test email address.
  4. Copy the customer ID. It looks like cus_abc123def456.
Save this customer ID. The sample application sets it in the code, so every event is recorded for this customer.

Step 4: Build the Sample Application

With billing set up and a test customer created, build the sample PixelGen AI application. It generates an image and reports it to Dodo Payments for billing.
The sample calls OpenAI’s gpt-image-2.5-flare model through the Image API. The Image API returns base64-encoded image data, so the sample saves each image as a PNG file. The Dodo Payments part (the meter, the product, and the image.generated usage event) doesn’t depend on the model.
1

Set Up Your Project

Create a directory and initialize the project:
2

Install Dependencies

Install the packages:
3

Create the Main Application

Create a file called index.ts and paste in the application code below.
The complete PixelGen AI application with billing, plus the matching .env and package.json:

Step 5: Test Your Sample Application

Test PixelGen AI end to end and watch the usage reach Dodo Payments.
What you’re testing: You generate a few images, confirm that the events reach Dodo Payments, and check the billing calculation.
1

Set Up Your Environment

  1. Create a .env file in the pixelgen-ai directory.
  2. Add your API keys:
  1. Install the dependencies and run the app:
Use real API keys, and replace the hardcoded customer ID in index.ts with the customer ID from Step 3.
2

Generate Your First Test Image

When the app starts, it prints:
Enter this prompt: “A cute robot painting a landscape”The output looks like this. The request debug lines that sendUsageEvent prints are left out:
If the output includes “Usage event sent successfully”, the billing integration works.
3

Generate a Few More Images

Generate two or three more images to test multiple events. Run npm start once per image, with these prompts:
  1. “A sunset over mountains with purple clouds”
  2. “A steampunk coffee machine in a Victorian kitchen”
  3. “A friendly dragon reading a book in a library”
Each time, check for the “Usage event sent successfully” message.
4

Check Your Dodo Payments Dashboard

Confirm that Dodo Payments receives the events:
  1. Open the Dodo Payments dashboard.
  2. Go to Products → Meters and open Image Generation Meter.
  3. Select the Events tab.
  4. Find your image generation events in the list.
What to look for:
  • Event name: image.generated
  • Customer ID: your test customer ID
The list has one event for each image you generated.
5

Verify Billing Calculations

Check the usage count:
Customers tab of the meter showing consumed units per customer
  1. In the meter, select the Customers tab.
  2. Find your test customer.
  3. Check the Consumed Units column.
6

Test the Billing Threshold

Go past the free tier to see billing:
  1. Generate 8 more images, for 12 in total.
  2. Open the meter’s Customers tab again.
  3. Check the values:
    • Consumed Units: 12
    • Chargeable Units: 2 (12 − 10 free)
    • Total Price: $0.10
Usage-based billing works. Customers are charged for the images they generate.

Troubleshooting

Common problems and their fixes:
Possible causes:
  • Event name doesn’t match meter configuration exactly
  • Customer ID doesn’t exist in your account
  • API key is invalid or expired
  • Network connectivity issues
Solutions:
  1. Check that the event name matches the meter exactly. It’s case-sensitive.
  2. Check that the customer ID exists in Dodo Payments.
  3. Test the API key with a simple API call.
  4. Check network connectivity and firewall settings.

Congratulations! You Built PixelGen AI

You built a sample AI image generator with usage-based billing:

Usage Meter

An “Image Generation Meter” that counts every image generation event.

Billing Product

Pricing at $0.05 per image, with 10 free images per month.

AI Application

A TypeScript app that generates images with the OpenAI image API.

Automated Billing

Event tracking that reports each image as it’s generated, so customers are billed for usage.
Last modified on September 26, 2026