Cloudflare R2 Setup Brief

1. Overview & Business Case

We've decided on Cloudflare R2 for Instagram Reels video storage. This brief provides Stitch with everything needed to set up the infrastructure when the Reels build is triggered (10+ active users posting images).

Why Cloudflare R2?

Expected Usage

Videos are temporary (7-day retention). Assuming average Instagram Reel = ~40MB:

• 100 active users: ~100 Reels/day → ~120GB in storage → ~$1.80/month
• 500 active users: ~500 Reels/day → ~600GB in storage → ~$9/month

Timeline

Not urgent. This brief is ready now, but the Reels build is deferred until we hit 10+ active users posting images daily. The infrastructure can be set up in one session when that threshold is reached.

2. Cloudflare Account Setup

R2 Pricing (Free Tier)

Setup Steps for Jason

1. Go to https://dash.cloudflare.com
2. Sign up for free Cloudflare account (or log in if existing)
3. Navigate to R2 in the left sidebar
4. Click "Create bucket"
5. Name: stylify-reels
6. Region: Leave as Automatic (Cloudflare selects geographically closest)
7. Click "Create bucket"

At 100 users, we stay well under the free tier limits (Class A: ~3M ops/month, Class B: ~1M reads/month). This remains free for Stylify indefinitely.

3. Bucket Configuration

7-Day Lifecycle Rule

Videos in R2 are temporary — Instagram downloads them during container creation, then we don't need them. Set up automatic deletion:

1. In Cloudflare R2 dashboard, select stylify-reels bucket
2. Go to Settings → Lifecycle rules
3. Click "Add lifecycle rule"
4. Rule name: auto-delete-old-videos
5. Prefix: (leave blank — applies to whole bucket)
6. Delete objects: 7 days after upload
7. Click "Create"

4. API Credentials

Creating an R2 API Token

1. In Cloudflare dashboard, go to My Profile (top right) → API Tokens
2. Click "Create Token"
3. Choose template: "Edit Cloudflare R2"
4. In Permissions section:
   • Set scope to: Account (not Zone)
   • R2 Permissions: Check "Object Read & Write"
   • Buckets: Select "stylify-reels" (specific bucket, not all)
5. Set TTL to Never expire (or your preference)
6. Click "Create Token"

This generates three values: Account ID, Access Key ID, and Secret Access Key. Copy all three immediately.

Environment Variables for Railway

Add these to the Stylify backend's Railway environment:

R2_ACCOUNT_ID=your-cloudflare-account-id-here
R2_ACCESS_KEY_ID=your-access-key-id-here
R2_SECRET_ACCESS_KEY=your-secret-access-key-here
R2_BUCKET_NAME=stylify-reels
R2_ENDPOINT=https://{R2_ACCOUNT_ID}.r2.cloudflarestorage.com

Note: Replace {R2_ACCOUNT_ID} in the endpoint URL with the actual account ID from Cloudflare.

5. CORS Configuration

The frontend needs permission to upload videos directly to R2 via presigned URLs. Configure CORS rules in the bucket:

1. In Cloudflare R2, select stylify-reels bucket
2. Go to Settings → CORS rules
3. Click "Add CORS rule"
4. Configure as follows:

This allows the frontend to upload videos (PUT) and check their status (HEAD) without browser CORS errors.

6. Backend Integration Notes

SDK & Dependencies

R2 is S3-compatible, so we use the standard AWS SDK:

npm install @aws-sdk/client-s3

Initializing the S3 Client

import { S3Client } from "@aws-sdk/client-s3";

const s3Client = new S3Client({
  region: "auto",
  endpoint: process.env.R2_ENDPOINT,
  credentials: {
    accessKeyId: process.env.R2_ACCESS_KEY_ID,
    secretAccessKey: process.env.R2_SECRET_ACCESS_KEY,
  },
});

Presigned URL Upload (24-hour expiry)

The frontend requests an upload URL from the backend, then uploads directly to R2:

import { PutObjectCommand } from "@aws-sdk/client-s3";
import { getSignedUrl } from "@aws-sdk/s3-request-presigner";

async function getUploadUrl(userId, filename) {
  const key = `reels/${userId}/${Date.now()}_${uuid()}.mp4`;

  const command = new PutObjectCommand({
    Bucket: process.env.R2_BUCKET_NAME,
    Key: key,
    ContentType: "video/mp4",
  });

  const presignedUrl = await getSignedUrl(s3Client, command, {
    expiresIn: 86400 // 24 hours
  });

  return { presignedUrl, key };
}

Public URL for Instagram Download

Critical: Instagram needs a publicly accessible URL to download the video during container creation. Two options:

Option A: Public Bucket + Custom Domain (Recommended)

• Make the R2 bucket public in settings
• Bind a custom domain: videos.stylify-ai.com → R2 bucket
• Public video URL: https://videos.stylify-ai.com/reels/{user_id}/{timestamp}_{uuid}.mp4
• Pro: Clean URLs, CDN-cached by default
• Con: Bucket is public (anyone can list objects if not configured)

Option B: Presigned GET URLs (More Secure)

• Keep bucket private
• Generate presigned GET URLs with 48-hour expiry when storing video metadata
• Pass the presigned URL to Instagram API
• Pro: Bucket stays private, access is time-limited
• Con: URLs are long and expire (Instagram won't cache if URL expires before container creation completes)

7. File Organization & Key Patterns

Store videos with a consistent key structure to keep the bucket organized and enable easy cleanup:

reels/{user_id}/{timestamp}_{uuid}.mp4

Example

reels/user_12345/1708956342_a7b3c9d1.mp4

Benefits

• User isolation: Each stylist's videos are in their own folder (useful for analytics or debugging)
• Timestamp: Enables sorting and knowing when a video was uploaded
• UUID: Prevents collisions if multiple videos upload simultaneously from the same user
• Lifecycle cleanup: The 7-day rule automatically deletes old files across all users

8. Cost Projections

Based on typical salon engagement (1 Reel/user/day, ~40MB per video, 7-day retention):

Bottom line: Reels storage will be negligible cost. At 500 users, we're spending less than $10/month on video storage — less than a single Slack enterprise plan seat.

9. Implementation Checklist

When we hit 10+ active users and trigger the Reels build, use this checklist to set up R2: