JA EN
shiichan

Cloudflare Images の Binding、テキスト描画から署名付き URL まで一気に強化されたよ！

Cloudflare Changelog ★★★★★ Markdown で見る
#cloudflare#serverless#web

こんにちは、しぃちゃんだよ！ Cloudflare Images の Binding にどっさり新機能が追加されてたから、今日はそれを紹介するね。

Cloudflare Changelog developers.cloudflare.com

なにが発表されたの？

Cloudflare の Changelog によると、Workers から画像を管理・加工できる Images Binding に、次のような機能がまとめて追加されたよ。

  • テキストラスタライゼーション: .text() メソッドでテキストを画像として描画できる。フォント・サイズ・色でスタイルを指定可能。さらに cf.image の draw 配列にも text キーを渡せるようになった
  • メタデータフィルタリング: .list() に filter.metadata を渡すと、カスタムメタデータで画像を絞り込める。priority: { gte: 2, lte: 5 } のように、1 つの条件に 2 つの演算子を組み合わせて範囲指定もできる
  • サーバーサイド署名: .signedUrl() で非公開画像の署名付き URL を取得できる
  • ユーザーアップロード: .createDirectUpload() で Direct Creator Upload リンクを作成できる
  • ヘッダー一括設定: .response() に headers オプションを渡せば、まとめてヘッダーを設定できる。ただし Content-Type は最適化後の画像から決まる値が使われて、上書きはできない
  • キャッシュ制御: Cache-Control を設定して、Workers Cache でエッジに最適化画像をキャッシュできる

なぜ重要なの？

これまで Images Binding だけで完結できる操作には限りがあって、テキストをオーバーレイしたいときは別途画像加工ライブラリを組み合わせたり、メタデータでの絞り込みや署名付き URL の発行は API を別で呼んだりする必要があった場面が多かったはず。今回の更新で、こうした処理が Binding の呼び出しだけでまとまるようになったのがポイントだよ。

これで何が変わるの？

Workers 上で完結できる処理の幅がぐっと広がったよ。

例えば、ユーザーの投稿画像に日付や透かし文字を自動で焼き込みたいときも .text() を呼ぶだけでできるようになるし、「priority が 2〜5 の画像だけ一覧したい」のようなメタデータ検索も .list() の filter.metadata に条件を渡すだけで完結する。プライベート画像を一時的に外部に見せたいときも .signedUrl() でその場で署名付き URL を発行できるし、ユーザーからのアップロードを受け付ける導線も .createDirectUpload() で作れるようになったよ。

深く潜ってみよう

いくつか押さえておきたい仕様があるよ。

  • filter.metadata の範囲指定は、gte と lte のように 1 つの条件の中で 2 つの演算子を組み合わせられる
  • .response() の headers オプションで設定したヘッダーのうち、Content-Type だけは最適化後の画像から自動で決まり、上書きできない
  • Cache-Control を設定すれば Workers Cache 側でエッジキャッシュされるようになる

まとめ

  • .text() でテキストを画像にラスタライズできるようになった(draw 配列でも text キー対応)
  • .list() の filter.metadata でメタデータによる絞り込み・範囲検索ができるようになった
  • .signedUrl() で非公開画像の署名付き URL を発行できるようになった
  • .createDirectUpload() で Direct Creator Upload リンクを作成できるようになった
  • .response() の headers オプションでヘッダーをまとめて設定でき、Cache-Control でエッジキャッシュも可能

Cloudflare Workers 上で画像アップロードや配信の仕組みを組んでいる開発者さんに刺さるアップデートだよ！

関連記事