RealComposer
WeWebSupabaseStripeMulti-API Aggregation

WeWeb Call Multiple APIs on Page Load

One WeWeb collection instead of a waterfall of fetches

Direct Answer & Architecture Summary

WeWeb pages that fetch several collections on load wait for each request and expose any keys used. A RealComposer pipeline calls Supabase and Stripe in parallel at the edge, injects both credentials from the vault, and returns one merged JSON object you bind as a single WeWeb collection.

Security LevelAES-256-GCM Vault
Edge LatencySub-10ms Response
InfrastructureZero Server Maintenance
The Problem Solved

Why multiple WeWeb collections slow page load

Dashboards built in WeWeb often combine a Supabase profile with Stripe billing state. Two or three collections fetched on page load add round trips on mobile networks, and the Stripe call cannot run safely from the browser at all.

Critical Security & Operational Risks:
  • Sequential collection fetches delaying first render
  • Stripe secret key needed for billing data in the front end
  • Duplicate formatting logic across WeWeb formulas
Architecture & Step-by-Step Implementation

How RealComposer Solves This at the Edge

1

Store credentials in Secret Vault

Save SUPABASE_SERVICE_ROLE_KEY and STRIPE_SECRET_KEY in RealComposer so the value never enters the WeWeb project.

2

Configure the edge pipeline

Add the upstream steps with vault header injection, set allowed origins, and map only the fields the screen binds.

3

Bind one WeWeb collection to the pipeline

Call your workspace edge URL with a restricted rc_live_ client token.

                    // WeWeb REST API collection
URL:     https://realcomposer.com/v1/workspace/weweb-multiple-apis-page-load?userId={{user.id}}&customerId={{user.stripeCustomerId}}
Headers: Authorization: Bearer rc_live_client_token
Fetch:   On page load
                  
Payload Slimming Comparison
64% Bandwidth Reduction
Raw Upstream Response147 B
              {
  "supabase": [
    {
      "full_name": "Ada Lovelace"
    }
  ],
  "stripe": {
    "object": "list",
    "has_more": false,
    "data": [
      {
        "id": "sub_1Px",
        "status": "active",
        "livemode": true
      }
    ]
  }
}
            
RealComposer Slimmed Edge Payload53 B
              {
  "name": "Ada Lovelace",
  "subscriptionStatus": "active"
}
            

Recipe Specs

HTTP method
GET
Upstream calls
2
Edge cache TTL
No caching
Client auth
Restricted client token
Mapped output fields
2
Payload
147 B to 53 B (-64%)
Call from Terminal or Client
curl -X GET "https://realcomposer.com/v1/workspace/weweb-multiple-apis-page-load" \
  -H "Authorization: Bearer rc_live_client_token"
Frequently Asked Questions

Developer Questions & Troubleshooting

Is the Supabase service role key safe here?

Yes, because it stays in the RealComposer vault. The query is filtered to the requested user id, and only two fields return to WeWeb.

What if Stripe is slow?

Each step has its own timeout, and the pipeline still returns the Supabase fields if the Stripe step fails, so the page renders.

Sources & Definitions Used in This Answer

Instant Deployment

Deploy this WeWeb + Supabase, Stripe Recipe

Clone this pre-configured pipeline into your RealComposer workspace in one click. We pre-populate upstream URLs, headers, and mapping rules.

CLONE THIS RECIPE
Related Architecture Recipes