Importly
← Back to blog

Import Media into Bubble from URL (Production-Ready Workflow)

If you want to import media URLs in Bubble without building and maintaining ingestion infrastructure, use Bubble for UI/workflow orchestration and Importly for async URL-to-media processing.

Fast answer

The simplest production-safe pattern is:

  1. Bubble UI collects URL.
  2. Bubble API Connector sends URL to Importly.
  3. Importly processes asynchronously.
  4. Importly webhook updates your Bubble backend workflow.
  5. Bubble UI shows completed/failed state to users.

Why Bubble apps struggle with URL imports

Most no-code apps hit the same issues fast:

  • Long-running imports timeout in synchronous flows
  • Remote URLs redirect or fail unpredictably
  • File size/content-type mismatches break user journeys
  • Polling status adds complexity and API cost

A webhook-first async architecture avoids these bottlenecks.

Recommended architecture (Bubble + Importly)

  • Frontend: Bubble page/form to collect source URL
  • Orchestration: Bubble workflow + API Connector
  • Processing: Importly ingestion API job
  • State updates: Importly webhook to Bubble backend endpoint
  • Storage/output: S3 or your selected destination

Step-by-step Bubble setup

1) Configure Bubble API Connector

  • Add Importly base URL and API key header
  • Create a POST call for starting ingestion jobs
  • Map source URL and optional metadata fields

2) Send URL payload from Bubble workflow

Trigger the API call when user clicks "Import". Save returned job ID in your Bubble DB.

3) Add backend workflow for webhook events

Create a Bubble backend endpoint that receives Importly event payloads and updates the job record status.

4) Update UI state

  • queued/processing → show progress state
  • completed → unlock/play/download asset
  • failed → show actionable retry message

Example request and webhook flow

Ingestion request (conceptual)

json
1{
2  "source_url": "https://example.com/video.mp4",
3  "callback_url": "https://yourapp.com/api/1.1/wf/importly_webhook",
4  "destination": "s3"
5}

Webhook event (conceptual)

json
1{
2  "job_id": "imp_12345",
3  "status": "completed",
4  "output_url": "https://storage.example.com/path/video.mp4",
5  "duration_ms": 48211
6}

Error handling and retry playbook

  • Validate URL format before submit
  • Handle redirects and unsupported content gracefully
  • Retry transient failures with backoff
  • Surface user-safe error messages (not raw stack traces)
  • Store correlation IDs for debugging

FAQ

Can Bubble handle imports synchronously?

For real-world media ingestion, async is safer. Synchronous paths are more likely to fail on larger assets or slow hosts.

Do I need polling in Bubble?

Not usually. Webhooks reduce complexity and keep state updates near real time.

What should I implement first?

Start with URL submit + async job + webhook completion. Add retries, signatures, and analytics in phase 2.