How to Track AI Costs in Bubble No-Code Apps

TL;DR: In Bubble's API Connector, set the base URL to https://tokonomics.ca/proxy/openai/chat/completions and use your Tokonomics API key. Every AI call from your Bubble app gets tracked — cost per feature, per user tier, per day. No plugins needed.

The Cost Problem for Bubble AI Apps

Bubble makes it easy to build AI-powered apps without code. The API Connector plugin calls OpenAI, and suddenly your app has a chatbot, a summarizer, or an AI-powered search.

But here's what Bubble doesn't tell you: your AI costs scale with your users, not your plan.

A Bubble app with 500 daily active users, each triggering 3 AI calls, makes 1,500 API calls per day. At $0.01 per GPT-4o call, that's $450/month in AI costs — often more than your Bubble subscription itself.

Worse, Bubble shows you workflow runs, not token costs. You know the chatbot ran 45,000 times. You don't know those runs cost $890 because 40% of users trigger the expensive GPT-4o model when GPT-4o-mini would work.

How to Connect: API Connector Setup

1. Open the API Connector

In your Bubble editor:

1. Go to Plugins → API Connector
2. Add a new API or edit your existing OpenAI connection

2. Configure the API Call

3. Add the API Call

Add an optional header for per-feature tracking:

4. Set the Body

{
  "model": "gpt-4o-mini",
  "messages": [
    {
      "role": "system",
      "content": "You are a helpful assistant for our product."
    },
    {
      "role": "user",
      "content": "<user_input>"
    }
  ],
  "max_tokens": 500
}

Mark <user_input> as a dynamic parameter in Bubble.

5. Initialize and Save

Click Initialize call with test data. Bubble detects the response structure. Map choices[0].message.content to display the AI response in your app.

Per-Feature Cost Tracking

Most Bubble apps have multiple AI features. Tag each one:

In the Tokonomics dashboard, you see cost per feature:

The content generator is 8x more expensive per call than the classifier. This is expected — generation produces more output tokens. But is GPT-4o necessary for generation, or would GPT-4o-mini work? The data tells you where to optimize.

SaaS Unit Economics for Bubble Apps

If you're building a SaaS on Bubble, AI costs directly affect your margins. Here's how to think about it:

Without per-user-tier cost tracking, you can't calculate these margins. With Tokonomics tags, you can track cost per user tier:

X-Metering-Tags: {"feature":"chatbot","tier":"pro"}

For a deep dive on SaaS AI economics, see how to track per-feature LLM costs.

Bubble-Specific Optimization Tips

1. Use GPT-4o-mini by default

Most Bubble AI features (chatbots, summarizers, classifiers) work fine with GPT-4o-mini at $0.15/1M input tokens vs GPT-4o at $2.50/1M. That's a 94% cost reduction. Reserve GPT-4o for complex reasoning tasks only.

2. Set max_tokens aggressively

If your chatbot only needs 1-2 sentence answers, set max_tokens: 150. Output tokens cost more than input tokens, and most Bubble apps don't need 4,096-token responses.

3. Cache common responses

If users frequently ask the same questions (FAQ-style), cache the AI responses in Bubble's database. Check the cache before making an API call. This can eliminate 30-50% of AI calls for support chatbots.

4. Limit free tier AI usage

Don't give free users unlimited AI calls. Set a monthly limit (e.g., 20 calls/month) and enforce it with a counter in Bubble. Or route free users to GPT-4o-mini and paid users to GPT-4o.

5. Set budget alerts

Configure budget alerts in Tokonomics to get notified at 70% and 90% of your monthly AI budget. For Bubble apps with unpredictable traffic, this is your safety net.

Using Claude or DeepSeek in Bubble

Create separate API calls in the API Connector:

Claude:

• URL: https://tokonomics.ca/proxy/anthropic/messages
• Body:

{
  "model": "claude-sonnet-4-6",
  "max_tokens": 1024,
  "messages": [{"role": "user", "content": "<user_input>"}]
}

DeepSeek (cheapest option — 90% less than GPT-4o):

• URL: https://tokonomics.ca/proxy/deepseek/chat/completions
• Body: same format as OpenAI

All providers use the same Authorization: Bearer mk_... key. See the full provider list.

Frequently Asked Questions

Does this work with Bubble's built-in AI features?

Bubble's native AI features use their own integration and don't support custom base URLs. Use the API Connector plugin instead — it gives you full control over the endpoint, headers, and request body.

Will the proxy slow down my Bubble app?

The proxy adds ~30ms per call (benchmark). Users won't notice — AI responses already take 500ms-3,000ms. The 30ms is within the noise floor.

Can I track costs per Bubble user?

Yes. Pass the Bubble user ID in a custom header:

X-Metering-Tags: {"user_id":"bubble_user_123","tier":"pro"}

The dashboard groups cost by any tag key you define.

What happens if I hit the budget cap?

If you enable hard spending caps, the proxy returns a 429 error when the monthly budget is exceeded. Your Bubble app should handle this gracefully — show a message like "AI features are temporarily unavailable" instead of crashing.

Get Started

1. Create a free Tokonomics account (100 calls/month free)
2. Copy your API key
3. Set up the API Connector with the proxy URL
4. Tag each AI feature with X-Feature-Name
5. Check the dashboard — your AI costs are now visible

All sources retrieved June 2026. Pricing: GPT-4o at $2.50/1M input tokens (OpenAI Pricing), DeepSeek V3 at $0.27/1M input tokens (DeepSeek Pricing).