Upload large files to Dropbox with chunking & web UI progress tracking

Dropbox Large File Upload System

How It Works

This workflow enables uploading large files (300MB+) to Dropbox through a web interface with real-time progress tracking. It bypasses Dropbox's 150MB single-request limit by breaking files into 8MB chunks and uploading them sequentially using Dropbox's upload session API.

Upload Flow:

1. User accesses page - Visits /webhook/upload-page and sees HTML form with file picker and folder path input 2. Selects file - Chooses file and clicks "Upload to Dropbox" button 3. JavaScript initiates session - Calls /webhook/start-session → Dropbox creates upload session → Returns sessionId 4. Chunk upload loop - JavaScript splits file into 8MB chunks and for each chunk: - Calls /webhook/append-chunk with sessionId, offset, and chunk binary data - Dropbox appends chunk to session - Progress bar updates (e.g., 25%, 50%, 75%) 5. Finalize upload - After all chunks uploaded, calls /webhook/finish-session with final offset and target path 6. File committed - Dropbox commits all chunks into complete file at specified path (e.g., /Uploads/video.mp4)

Why chunking? Dropbox API has a 150MB limit for single upload requests. The upload session API (uploadsession/start, appendv2, finish) allows unlimited file sizes by chunking.

Technical Architecture: - Four webhook endpoints handle different stages (serve UI, start, append, finish) - All chunk data sent as multipart/form-data with binary blobs - Dropbox API requires cursor metadata (sessionid, offset) in Dropbox-API-Arg header - autorename: true prevents file overwrites

Setup Steps