Cloudflare R2 Storage: S3-Compatible Object Storage Without Egress Fees#

1
// worker.js - R2 storage operations
2
export default {
3
  async fetch(request, env) {
4
    const url = new URL(request.url);
5
    const key = url.pathname.slice(1);
6

7
    switch (request.method) {
8
      case 'GET':
9
        return await handleGet(key, env);
10
      case 'PUT':
11
        return await handlePut(key, request, env);
12
      case 'DELETE':
13
        return await handleDelete(key, env);
14
      case 'HEAD':
15
        return await handleHead(key, env);
16
      default:
17
        return new Response('Method not allowed', { status: 405 });
18
    }
19
  }
20
};
21

22
async function handleGet(key, env) {
23
  // Handle listing if no key
24
  if (!key) {
25
    const list = await env.BUCKET.list();
26
    return Response.json({
27
      objects: list.objects.map(obj => ({
28
        key: obj.key,
29
        size: obj.size,
30
        etag: obj.etag,
31
        uploaded: obj.uploaded
32
      }))
33
    });
34
  }
35

36
  // Get object
37
  const object = await env.BUCKET.get(key);
38

39
  if (!object) {
40
    return new Response('Object not found', { status: 404 });
41
  }
42

43
  // Handle range requests for video streaming
44
  const range = request.headers.get('range');
45
  if (range) {
46
    return handleRangeRequest(object, range);
47
  }
48

49
  const headers = new Headers();
50
  object.writeHttpMetadata(headers);
51
  headers.set('etag', object.httpEtag);
52
  headers.set('cache-control', 'public, max-age=31536000');
53

54
  return new Response(object.body, { headers });
55
}
56

57
async function handlePut(key, request, env) {
58
  // Validate file size
59
  const contentLength = request.headers.get('content-length');
60
  if (contentLength && parseInt(contentLength) > 100 * 1024 * 1024) { // 100MB limit
61
    return new Response('File too large', { status: 413 });
62
  }
63

64
  // Extract metadata
65
  const metadata = {
66
    uploadedBy: request.headers.get('x-user-id') || 'anonymous',
67
    uploadedAt: new Date().toISOString(),
68
    contentType: request.headers.get('content-type') || 'application/octet-stream'
69
  };
70

71
  // Handle multipart uploads for large files
72
  if (contentLength && parseInt(contentLength) > 5 * 1024 * 1024) { // 5MB
73
    return await handleMultipartUpload(key, request, env, metadata);
74
  }
75

76
  // Direct upload for small files
77
  await env.BUCKET.put(key, request.body, {
78
    httpMetadata: request.headers,
79
    customMetadata: metadata
80
  });
81

82
  return new Response('Object uploaded', {
83
    status: 201,
84
    headers: {
85
      'Location': `/${key}`
86
    }
87
  });
88
}
89

90
async function handleDelete(key, env) {
91
  await env.BUCKET.delete(key);
92
  return new Response('Object deleted', { status: 204 });
93
}
94

95
async function handleHead(key, env) {
96
  const object = await env.BUCKET.head(key);
97

98
  if (!object) {
99
    return new Response('Object not found', { status: 404 });
100
  }
101

102
  return new Response(null, {
103
    headers: {
104
      'content-length': object.size,
105
      'etag': object.httpEtag,
106
      'last-modified': object.uploaded.toUTCString()
107
    }
108
  });
109
}
110

111
async function handleRangeRequest(object, range) {
112
  const parts = range.replace(/bytes=/, '').split('-');
113
  const start = parseInt(parts[0], 10);
114
  const end = parts[1] ? parseInt(parts[1], 10) : object.size - 1;
115

116
  const headers = new Headers();
117
  headers.set('content-range', `bytes ${start}-${end}/${object.size}`);
118
  headers.set('accept-ranges', 'bytes');
119
  headers.set('content-length', end - start + 1);
120
  headers.set('content-type', object.httpMetadata.contentType || 'application/octet-stream');
121

122
  const slicedBody = object.body.slice(start, end + 1);
123

124
  return new Response(slicedBody, {
125
    status: 206,
126
    headers
127
  });
128
}
129

130
async function handleMultipartUpload(key, request, env, metadata) {
131
  const chunks = [];
132
  const reader = request.body.getReader();
133

134
  try {
135
    while (true) {
136
      const { done, value } = await reader.read();
137
      if (done) break;
138
      chunks.push(value);
139
    }
140

141
    const blob = new Blob(chunks);
142
    await env.BUCKET.put(key, blob, {
143
      httpMetadata: request.headers,
144
      customMetadata: metadata
145
    });
146

147
    return new Response('Multipart upload complete', { status: 201 });
148
  } catch (error) {
149
    return new Response(`Upload failed: ${error.message}`, { status: 500 });
150
  }
151
}

1
// image-processor.js - Real-time image transformation with R2
2
export default {
3
  async fetch(request, env) {
4
    const url = new URL(request.url);
5
    const imageKey = url.searchParams.get('key');
6
    const width = parseInt(url.searchParams.get('w') || '0');
7
    const height = parseInt(url.searchParams.get('h') || '0');
8
    const quality = parseInt(url.searchParams.get('q') || '85');
9
    const format = url.searchParams.get('f') || 'auto';
10

11
    if (!imageKey) {
12
      return new Response('Missing image key', { status: 400 });
13
    }
14

15
    // Generate cache key
16
    const cacheKey = `${imageKey}-w${width}-h${height}-q${quality}-f${format}`;
17

18
    // Check if processed image exists in R2
19
    const cachedImage = await env.BUCKET.get(`processed/${cacheKey}`);
20
    if (cachedImage) {
21
      return new Response(cachedImage.body, {
22
        headers: {
23
          'content-type': cachedImage.httpMetadata.contentType,
24
          'cache-control': 'public, max-age=31536000',
25
          'x-cache': 'HIT'
26
        }
27
      });
28
    }
29

30
    // Get original image from R2
31
    const original = await env.BUCKET.get(`originals/${imageKey}`);
32
    if (!original) {
33
      return new Response('Image not found', { status: 404 });
34
    }
35

36
    // Process image using Cloudflare Image Resizing
37
    const processedResponse = await fetch(original.body, {
38
      cf: {
39
        image: {
40
          width: width || undefined,
41
          height: height || undefined,
42
          quality: quality,
43
          format: format === 'auto' ? undefined : format,
44
          fit: 'scale-down',
45
          metadata: 'none'
46
        }
47
      }
48
    });
49

50
    const processedImage = await processedResponse.arrayBuffer();
51

52
    // Store processed image in R2 for future requests
53
    await env.BUCKET.put(`processed/${cacheKey}`, processedImage, {
54
      httpMetadata: {
55
        contentType: processedResponse.headers.get('content-type')
56
      },
57
      customMetadata: {
58
        originalKey: imageKey,
59
        width: width.toString(),
60
        height: height.toString(),
61
        quality: quality.toString(),
62
        format: format,
63
        processedAt: new Date().toISOString()
64
      }
65
    });
66

67
    return new Response(processedImage, {
68
      headers: {
69
        'content-type': processedResponse.headers.get('content-type'),
70
        'cache-control': 'public, max-age=31536000',
71
        'x-cache': 'MISS'
72
      }
73
    });
74
  }
75
};

1
// video-streaming.js - HLS video streaming from R2
2
export default {
3
  async fetch(request, env) {
4
    const url = new URL(request.url);
5
    const path = url.pathname;
6

7
    // Handle manifest files
8
    if (path.endsWith('.m3u8')) {
9
      return await handleManifest(path, env);
10
    }
11

12
    // Handle video segments
13
    if (path.endsWith('.ts')) {
14
      return await handleSegment(path, env);
15
    }
16

17
    // Handle video upload
18
    if (path === '/upload' && request.method === 'POST') {
19
      return await handleVideoUpload(request, env);
20
    }
21

22
    return new Response('Not found', { status: 404 });
23
  }
24
};
25

26
async function handleManifest(path, env) {
27
  const manifest = await env.BUCKET.get(path);
28

29
  if (!manifest) {
30
    return new Response('Manifest not found', { status: 404 });
31
  }
32

33
  return new Response(manifest.body, {
34
    headers: {
35
      'content-type': 'application/vnd.apple.mpegurl',
36
      'cache-control': 'no-cache',
37
      'access-control-allow-origin': '*'
38
    }
39
  });
40
}
41

42
async function handleSegment(path, env) {
43
  const segment = await env.BUCKET.get(path);
44

45
  if (!segment) {
46
    return new Response('Segment not found', { status: 404 });
47
  }
48

49
  return new Response(segment.body, {
50
    headers: {
51
      'content-type': 'video/mp2t',
52
      'cache-control': 'public, max-age=31536000',
53
      'access-control-allow-origin': '*'
54
    }
55
  });
56
}
57

58
async function handleVideoUpload(request, env) {
59
  const formData = await request.formData();
60
  const file = formData.get('video');
61
  const videoId = crypto.randomUUID();
62

63
  if (!file) {
64
    return new Response('No video file provided', { status: 400 });
65
  }
66

67
  // Store original video
68
  await env.BUCKET.put(`videos/${videoId}/original.mp4`, file, {
69
    customMetadata: {
70
      uploadedAt: new Date().toISOString(),
71
      fileName: file.name,
72
      fileSize: file.size.toString()
73
    }
74
  });
75

76
  // Trigger transcoding job (via queue or external service)
77
  await env.QUEUE.send({
78
    videoId,
79
    action: 'transcode',
80
    formats: ['1080p', '720p', '480p'],
81
    generateHLS: true
82
  });
83

84
  return Response.json({
85
    videoId,
86
    status: 'processing',
87
    message: 'Video uploaded successfully and queued for processing'
88
  });
89
}

1
// backup-system.js - Automated backup to R2
2
class BackupSystem {
3
  constructor(env) {
4
    this.env = env;
5
    this.bucket = env.BACKUP_BUCKET;
6
  }
7

8
  async createBackup(data, metadata) {
9
    const backupId = crypto.randomUUID();
10
    const timestamp = new Date().toISOString();
11
    const key = `backups/${timestamp.split('T')[0]}/${backupId}.zip`;
12

13
    // Compress data
14
    const compressed = await this.compressData(data);
15

16
    // Encrypt backup
17
    const encrypted = await this.encryptData(compressed);
18

19
    // Store in R2 with metadata
20
    await this.bucket.put(key, encrypted, {
21
      customMetadata: {
22
        backupId,
23
        timestamp,
24
        ...metadata,
25
        checksum: await this.calculateChecksum(encrypted),
26
        encryption: 'AES-256-GCM'
27
      }
28
    });
29

30
    return {
31
      backupId,
32
      key,
33
      size: encrypted.byteLength,
34
      timestamp
35
    };
36
  }
37

38
  async restoreBackup(backupId) {
39
    // Find backup
40
    const list = await this.bucket.list({
41
      prefix: 'backups/'
42
    });
43

44
    const backup = list.objects.find(obj =>
45
      obj.customMetadata?.backupId === backupId
46
    );
47

48
    if (!backup) {
49
      throw new Error('Backup not found');
50
    }
51

52
    // Retrieve encrypted data
53
    const encrypted = await this.bucket.get(backup.key);
54

55
    // Verify checksum
56
    const checksum = await this.calculateChecksum(encrypted.body);
57
    if (checksum !== backup.customMetadata.checksum) {
58
      throw new Error('Backup integrity check failed');
59
    }
60

61
    // Decrypt
62
    const decrypted = await this.decryptData(encrypted.body);
63

64
    // Decompress
65
    const data = await this.decompressData(decrypted);
66

67
    return {
68
      data,
69
      metadata: backup.customMetadata,
70
      restoredAt: new Date().toISOString()
71
    };
72
  }
73

74
  async cleanupOldBackups(retentionDays = 30) {
75
    const cutoffDate = new Date();
76
    cutoffDate.setDate(cutoffDate.getDate() - retentionDays);
77

78
    const list = await this.bucket.list({
79
      prefix: 'backups/'
80
    });
81

82
    const toDelete = list.objects.filter(obj => {
83
      const uploadDate = new Date(obj.uploaded);
84
      return uploadDate < cutoffDate;
85
    });
86

87
    for (const obj of toDelete) {
88
      await this.bucket.delete(obj.key);
89
    }
90

91
    return {
92
      deleted: toDelete.length,
93
      retained: list.objects.length - toDelete.length
94
    };
95
  }
96

97
  async compressData(data) {
98
    const stream = new CompressionStream('gzip');
99
    const writer = stream.writable.getWriter();
100
    writer.write(data);
101
    writer.close();
102

103
    const compressed = await new Response(stream.readable).arrayBuffer();
104
    return compressed;
105
  }
106

107
  async decompressData(compressed) {
108
    const stream = new DecompressionStream('gzip');
109
    const writer = stream.writable.getWriter();
110
    writer.write(compressed);
111
    writer.close();
112

113
    const decompressed = await new Response(stream.readable).arrayBuffer();
114
    return decompressed;
115
  }
116

117
  async encryptData(data) {
118
    // Simplified encryption - use Web Crypto API in production
119
    const key = await crypto.subtle.importKey(
120
      'raw',
121
      new TextEncoder().encode(this.env.ENCRYPTION_KEY),
122
      { name: 'AES-GCM' },
123
      false,
124
      ['encrypt']
125
    );
126

127
    const iv = crypto.getRandomValues(new Uint8Array(12));
128
    const encrypted = await crypto.subtle.encrypt(
129
      { name: 'AES-GCM', iv },
130
      key,
131
      data
132
    );
133

134
    // Combine IV and encrypted data
135
    const combined = new Uint8Array(iv.length + encrypted.byteLength);
136
    combined.set(iv, 0);
137
    combined.set(new Uint8Array(encrypted), iv.length);
138

139
    return combined.buffer;
140
  }
141

142
  async decryptData(encrypted) {
143
    const data = new Uint8Array(encrypted);
144
    const iv = data.slice(0, 12);
145
    const ciphertext = data.slice(12);
146

147
    const key = await crypto.subtle.importKey(
148
      'raw',
149
      new TextEncoder().encode(this.env.ENCRYPTION_KEY),
150
      { name: 'AES-GCM' },
151
      false,
152
      ['decrypt']
153
    );
154

155
    const decrypted = await crypto.subtle.decrypt(
156
      { name: 'AES-GCM', iv },
157
      key,
158
      ciphertext
159
    );
160

161
    return decrypted;
162
  }
163

164
  async calculateChecksum(data) {
165
    const hashBuffer = await crypto.subtle.digest('SHA-256', data);
166
    const hashArray = Array.from(new Uint8Array(hashBuffer));
167
    return hashArray.map(b => b.toString(16).padStart(2, '0')).join('');
168
  }
169
}

1
// cdn-cache.js - Intelligent CDN with R2 backend
2
export default {
3
  async fetch(request, env, ctx) {
4
    const cache = caches.default;
5
    const url = new URL(request.url);
6

7
    // Create cache key
8
    const cacheKey = new Request(url.toString(), request);
9
    let response = await cache.match(cacheKey);
10

11
    if (!response) {
12
      // Parse path to get R2 key
13
      const key = url.pathname.slice(1);
14

15
      // Check R2
16
      const object = await env.BUCKET.get(key);
17

18
      if (!object) {
19
        // Try to fetch from origin
20
        const originUrl = `https://origin.example.com${url.pathname}`;
21
        response = await fetch(originUrl);
22

23
        if (response.ok) {
24
          // Store in R2 for future requests
25
          await env.BUCKET.put(key, response.body, {
26
            httpMetadata: response.headers
27
          });
28

29
          // Recreate response since body was consumed
30
          const object = await env.BUCKET.get(key);
31
          response = new Response(object.body, response);
32
        }
33
      } else {
34
        // Serve from R2
35
        const headers = new Headers();
36
        object.writeHttpMetadata(headers);
37
        headers.set('cache-control', getCacheControl(key));
38
        headers.set('cf-cache-status', 'MISS');
39

40
        response = new Response(object.body, { headers });
41
      }
42

43
      // Store in edge cache
44
      ctx.waitUntil(cache.put(cacheKey, response.clone()));
45
    } else {
46
      // Add cache hit header
47
      response = new Response(response.body, response);
48
      response.headers.set('cf-cache-status', 'HIT');
49
    }
50

51
    return response;
52
  }
53
};
54

55
function getCacheControl(key) {
56
  // Determine cache duration based on file type
57
  const ext = key.split('.').pop().toLowerCase();
58

59
  const cacheMap = {
60
    // Images - long cache
61
    'jpg': 'public, max-age=31536000, immutable',
62
    'jpeg': 'public, max-age=31536000, immutable',
63
    'png': 'public, max-age=31536000, immutable',
64
    'webp': 'public, max-age=31536000, immutable',
65
    'gif': 'public, max-age=31536000, immutable',
66

67
    // Videos - moderate cache
68
    'mp4': 'public, max-age=86400',
69
    'webm': 'public, max-age=86400',
70

71
    // Documents - short cache
72
    'html': 'public, max-age=3600',
73
    'css': 'public, max-age=86400',
74
    'js': 'public, max-age=86400',
75

76
    // Dynamic content - no cache
77
    'json': 'no-cache',
78
    'xml': 'no-cache'
79
  };
80

81
  return cacheMap[ext] || 'public, max-age=3600';
82
}