Image Resizer

Fetch and resize remote images using Cloudflare Image Resizing via the fetch API and cf.image options. Returns the resized image binary with the appropriate Content-Type header.

API Reference

GET /resize

Fetches a remote image and returns a resized version.

Example Request

curl "https://your-worker.workers.dev/resize?url=https://example.com/image.jpg&width=800&fit=scale-down" --output resized.jpg

Success Response

Returns the resized image as binary data with an appropriate Content-Type header (e.g. image/jpeg, image/png).

Error Response

{
  "error": "Missing or invalid query parameter: url",
  "code": "INVALID_URL"
}

Error Codes

• 400 - Missing or invalid url (INVALID_URL)
• 400 - Invalid width value (INVALID_WIDTH)
• 400 - Invalid height value (INVALID_HEIGHT)
• 400 - Neither width nor height provided (MISSING_DIMENSION)
• 400 - Invalid fit mode (INVALID_FIT)
• 502 - Upstream fetch or resize failed (FETCH_ERROR)

Use Cases

• Serve dynamically resized thumbnails from any remote image URL
• Learn Cloudflare Image Resizing options via Workers fetch
• Build on-the-fly image proxy endpoints at the edge
• Reduce bandwidth by resizing images before delivery to clients

Limitations

• Remote image fetch is subject to a timeout
• Resizing options are limited to the query params exposed by this experiment
• Origin must allow Cloudflare to fetch the image URL
• Single image per request; no batch processing

Deployment

curl "https://your-worker.workers.dev/resize?url=https://example.com/image.jpg&width=800&fit=scale-down" --output resized.jpg

Local Development

cd apps/experiments/image-resizer
npm install
npm run dev

Test locally:

curl "http://localhost:8787/resize?url=https://example.com/image.jpg&width=800&fit=scale-down" --output resized.jpg

Cloudflare Features Used

• Workers - Edge compute runtime
• Image Resizing - fetch with cf.image transform options
• Fetch API - Remote image retrieval