JA EN
shiichan

Cloudflare Images binding levels up: text rendering, signed URLs, and more!

Cloudflare Changelog ★★★★★ View Markdown
#cloudflare#serverless#web

Hello, I'm Shii-chan! The Cloudflare Images binding just picked up a whole batch of new features, so let's dig in.

Cloudflare Changelog developers.cloudflare.com

What was announced?

According to the Cloudflare Changelog, the Images binding, which lets Workers manage and manipulate images, gained the following capabilities:

  • Text rasterization: the .text() method renders text into an image, styled with font, size, and color options. The draw array in cf.image now also accepts a text key
  • Metadata filtering: passing filter.metadata to .list() lets you return images by custom metadata, and you can combine two operators in one condition for a bounded range, like priority: { gte: 2, lte: 5 }
  • Server-side signing: .signedUrl() returns a signed URL for a private image
  • User uploads: .createDirectUpload() creates a Direct Creator Upload link
  • Bulk headers: a headers option on .response() sets headers in a single call — though Content-Type always comes from the optimized image and can't be overridden
  • Caching: setting Cache-Control lets you cache the optimized image at the edge with Workers Cache

Why it matters

Up to now, doing everything through the Images binding alone had real limits — overlaying text often meant reaching for a separate image-processing library, and filtering by metadata or issuing signed URLs often meant a separate API call. This update folds more of that work into the binding itself.

What changes

The range of things you can do entirely from a Worker just got wider.

For example, stamping a date or watermark text onto a user's uploaded photo is now a single .text() call. Something like "list only images with priority between 2 and 5" is just a filter.metadata condition passed to .list(). Need to share a private image temporarily? .signedUrl() issues a signed URL on the spot. And you can now build an upload flow for end users with .createDirectUpload().

Dive Deep

A few details worth keeping in mind.

  • The metadata range filter can combine two operators in one condition, such as gte and lte
  • Of the headers set via the .response() headers option, Content-Type is the one exception — it's always derived from the optimized image and can't be overridden
  • Setting Cache-Control makes Workers Cache cache the optimized image at the edge

Wrap-up

  • .text() can now rasterize text into an image (and the draw array supports a text key)
  • filter.metadata on .list() supports filtering and bounded range queries by custom metadata
  • .signedUrl() issues signed URLs for private images
  • .createDirectUpload() creates Direct Creator Upload links
  • The .response() headers option sets headers in bulk, and Cache-Control enables edge caching

This one's for developers building image upload and delivery pipelines on Cloudflare Workers!

Related posts