WebflowAirtableStripeHubSpotSecurity & Secret Vault

How to Call Private REST APIs from Webflow Custom Code Securely

Zero-Backend API Proxy for Webflow Sites & Forms

CLONE RECIPE INTO WORKSPACE View Architecture

Direct Answer & Architecture Summary

Webflow is a purely static and frontend visual builder with no backend server. To call private APIs from Webflow custom code without revealing secrets in the browser inspector, route requests through RealComposer. RealComposer stores your API keys in an AES-256-GCM vault, injects credentials at the edge, and handles CORS headers automatically.

Security LevelAES-256-GCM Vault

Edge LatencySub-10ms Response

InfrastructureZero Server Maintenance

The Problem Solved

Webflow Has No Server Environment for Secrets

When you paste JavaScript into Webflow Page Settings or Custom Embed elements, that script runs exclusively in visitors browsers. Any API key written in Webflow custom code is visible to anyone inspecting page source or network requests.

Critical Security & Operational Risks:

Exposed Airtable Personal Access Tokens, allowing full base scraping
Exposed CRM credentials allowing attackers to download lead lists
Inability to make authenticated API requests directly from Webflow forms

Architecture & Step-by-Step Implementation

How RealComposer Solves This at the Edge

Add API Credentials to RealComposer

Store your upstream Bearer token or Basic Auth keys in the Secret Vault.

Configure Webflow Origin Protection

Whitelist your Webflow site domain (e.g., https://your-site.webflow.io).

Paste Embed Script in Webflow

In Webflow Custom Code, fetch your RealComposer edge URL with your public token.

                    fetch("https://realcomposer.com/v1/acme/lead-submit", {
  method: "POST",
  headers: { "Authorization": "Bearer rc_live_..." },
  body: JSON.stringify({ email: emailField.value })
});

Payload Slimming Comparison

71% Bandwidth Reduction

Raw Upstream Response194 B

              {
  "id": "991024",
  "properties": {
    "email": "lead@startup.com",
    "hs_object_id": "991024",
    "createdate": "2026-11-01"
  },
  "createdAt": "2026-11-01T12:00:00Z",
  "updatedAt": "2026-11-01T12:00:00Z",
  "archived": false
}

RealComposer Slimmed Edge Payload57 B

              {
  "contactId": "991024",
  "createdAt": "2026-11-01T12:00:00Z"
}

Call from Terminal or Client

curl -X POST "https://realcomposer.com/v1/acme/lead-submit" \
  -H "Authorization: Bearer rc_live_..." \
  -H "Content-Type: application/json" \
  -d '{"email":"lead@example.com"}'

Frequently Asked Questions

Developer Questions & Troubleshooting

Why not use Make or Zapier from Webflow?

Make and Zapier take 3 to 10 seconds to respond, creating a poor user experience on form submissions. RealComposer executes at the edge in sub-50ms.

Does RealComposer fix Webflow CORS errors?

Yes. RealComposer handles CORS preflight (OPTIONS) automatically and attaches the necessary Access-Control headers.

Instant Deployment

Deploy this Webflow + Airtable, Stripe, HubSpot 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

FramerOpenAI, Airtable, Resend