Direct Upload Architecture for Mobile App Media: S3, GCS, R2

Direct Upload Architecture for Mobile App Media: S3, GCS, R2

Uploading photos and videos from a mobile app is a task easily underestimated. A single 50 MB video request through a backend proxy creates colossal server load, increases response time, and doubles traffic usage. Users abandon uploads if they take longer than three seconds. We offer a proven architecture: presigned URL → direct upload from the client to S3 or GCS. The backend only issues a token and receives confirmation—the heavy lifting is handled by cloud infrastructure. This turnkey approach reduces server load by up to 70%, speeds up content delivery by 3x, and guarantees security. Our experience: over 5 years integrating cloud storage into iOS and Android mobile apps, with 50+ successful projects.

Why Upload Media Directly to S3?

Direct upload via presigned URL solves performance and reliability issues. Compare with the proxy method:

We strongly recommend direct upload for media—it reduces infrastructure costs and improves app responsiveness. Official AWS documentation: Presigned URLs.

Cloud Storage Provider Comparison

R2 and B2 are S3 API-compatible—same client code, different endpoint. Provider choice depends on traffic region and budget. For projects with high outgoing traffic, Cloudflare R2 can reduce egress costs to zero.

How We Implement Upload with Progress

Users see a progress bar—this is not optional for videos. Implementation steps:

1. The app requests a presigned URL from the backend, passing file type and size.
2. The backend generates a temporary token with limited permissions (e.g., PUT on a specific object).
3. The client uploads the file directly to cloud storage using the obtained URL and standard progress tracking mechanisms.

iOS using URLSession.uploadTask with delegate:

class MediaUploader: NSObject, URLSessionTaskDelegate { private lazy var session: URLSession = { URLSession(configuration: .default, delegate: self, delegateQueue: nil) }() func upload(fileURL: URL, presignedURL: URL, progress: @escaping (Double) -> Void, completion: @escaping (Result<Void, Error>) -> Void) { var request = URLRequest(url: presignedURL) request.httpMethod = "PUT" request.setValue(fileURL.mimeType, forHTTPHeaderField: "Content-Type") let task = session.uploadTask(with: request, fromFile: fileURL) task.taskDescription = fileURL.lastPathComponent uploadCompletionHandlers[task.taskIdentifier] = completion uploadProgressHandlers[task.taskIdentifier] = progress task.resume() } func urlSession(_ session: URLSession, task: URLSessionTask, didSendBodyData bytesSent: Int64, totalBytesSent: Int64, totalBytesExpectedToSend: Int64) { let progress = Double(totalBytesSent) / Double(totalBytesExpectedToSend) uploadProgressHandlers[task.taskIdentifier]?(progress) } } 

On Android using OkHttp with custom RequestBody:

class ProgressRequestBody( private val file: File, private val contentType: MediaType, private val onProgress: (Int) -> Unit ) : RequestBody() { override fun contentType() = contentType override fun contentLength() = file.length() override fun writeTo(sink: BufferedSink) { val buffer = ByteArray(8192) var uploaded = 0L file.inputStream().use { input -> var bytesRead: Int while (input.read(buffer).also { bytesRead = it } != -1) { sink.write(buffer, 0, bytesRead) uploaded += bytesRead val progress = (uploaded * 100 / file.length()).toInt() onProgress(progress) } } } } 

What to Do with Large Video Files?

S3 requires multipart for files larger than 5 MB (recommended from 100 MB). Benefits: parallel part upload, ability to resume after interruption.

class S3MultipartUploader(private val s3Client: S3Client) { suspend fun upload(bucketName: String, key: String, file: File): String { // 1. Initiate multipart upload val createResponse = s3Client.createMultipartUpload { bucket = bucketName this.key = key contentType = file.detectMimeType() } val uploadId = createResponse.uploadId!! val partSize = 10 * 1024 * 1024L // 10 MB per part val parts = mutableListOf<CompletedPart>() try { file.inputStream().use { stream -> var partNumber = 1 val buffer = ByteArray(partSize.toInt()) var bytesRead: Int while (stream.read(buffer).also { bytesRead = it } != -1) { val partData = buffer.copyOf(bytesRead) val uploadPartResponse = s3Client.uploadPart { bucket = bucketName this.key = key this.uploadId = uploadId this.partNumber = partNumber body = ByteStream.fromBytes(partData) } parts.add(CompletedPart { this.partNumber = partNumber eTag = uploadPartResponse.eTag }) partNumber++ } } // 3. Complete multipart upload s3Client.completeMultipartUpload { bucket = bucketName this.key = key this.uploadId = uploadId multipartUpload = CompletedMultipartUpload { this.parts = parts } } return "https://$bucketName.s3.amazonaws.com/$key" } catch (e: Exception) { // Clean up incomplete upload—otherwise you get charged s3Client.abortMultipartUpload { bucket = bucketName this.key = key this.uploadId = uploadId } throw e } } } 

abortMultipartUpload on error is important. Incomplete multipart uploads continue to incur charges in AWS. Add a Lifecycle Rule to delete incomplete uploads after 7 days as a safety net.

Media Processing Before Upload

4K video at 200 MB uploaded directly to S3 is rarely needed. On the client before upload:

• Images: compress using UIGraphicsImageRenderer (iOS) or BitmapFactory.Options.inSampleSize (Android). WebP instead of JPEG gives better quality/size ratio (up to 30% smaller).
• Videos: transcode using AVAssetExportSession (iOS) or MediaCodec/Transformer (Android) down to 1080p/720p. For React Native—react-native-video-processing.

// iOS: compress video before upload let exporter = AVAssetExportSession(asset: asset, presetName: AVAssetExportPreset1280x720)! exporter.outputURL = outputURL exporter.outputFileType = .mp4 exporter.shouldOptimizeForNetworkUse = true await exporter.export() // After export—upload outputURL to S3 

Client-side compression is a trade-off: less traffic, faster upload, but CPU load on the device. This saves on storage and outgoing traffic (especially at scale). Compression can cut upload time by 50%.

CDN for Delivery

S3 directly is only for private files. Public media (avatars, content) should go through CloudFront or Cloudflare CDN. This caches content on edge nodes worldwide and provides HTTPS without additional setup. Connecting a CDN can reduce latency by up to 50 ms for users in remote regions.

{ "CORSRules": [ { "AllowedOrigins": ["*"], "AllowedMethods": ["PUT", "POST"], "AllowedHeaders": ["*"], "ExposeHeaders": ["ETag"] } ] }