Cloudflare R2 Presigned URLs: Direct Browser Uploads That Bypass Server Limits

When building FlowSub, I hit a wall: Vercel's serverless functions have a 4.5MB request body limit. Our users upload video files that can be 500MB+. The standard approach — upload to the server, then to storage — simply doesn't work.

The Problem

Serverless platforms like Vercel enforce request body size limits. For Vercel Pro, that's 4.5MB. Video files are typically 10MB–500MB. Even short 30-second clips exceed the limit.

The Solution: Presigned URLs

Cloudflare R2 (S3-compatible storage) supports presigned URLs. The flow:

1. Browser requests an upload URL from our API

2. Server generates a presigned PUT URL scoped to a specific object key

3. Browser uploads directly to R2 using the presigned URL

4. R2 accepts the file — no server body limits involved

Implementation

The upload endpoint (`src/app/api/upload/route.ts`) generates a presigned URL using the AWS SDK:

typescript

code

Why This Architecture Works

**No server bottlenecks** — files go directly to R2, not through our API

**Scalable** — R2 handles the bandwidth, not our serverless functions

**Secure** — presigned URLs expire after 1 hour, scoped to a single object

**Fast** — uploads go to Cloudflare's edge network, close to the user

The Full Pipeline

1. User selects a file → browser requests presigned URL

2. Browser uploads to R2 directly

3. On completion, browser notifies our API with the object key

4. API triggers transcription — FFmpeg reads from R2 URL, streams to Groq Whisper

5. Result stored back in R2, subtitles served to user

This architecture is what lets FlowSub process 50,000+ jobs per week without breaking a sweat.