Add support for hosted images api operations in the Images Binding

[mglewis]

This PR is the counterpart for this workerd change that adds support for various CRUD operations for Cloudflare Hosted Images. This replicates existing functionality already available through the Images API.

Implementation Details

This PR includes a mock implementation (packages/miniflare/src/workers/images/images.worker.ts) of the hosted images backend that uses an in-memory map for local development.

Note that support for metadata filtering in the list method will be added in a followup MR

Regenerated workerd.ts with pnpm run capnp:workerd

Testing

The tests in fixtures/vitest-pool-workers-examples/images/ have been expanded to cover the new CRUD operations. As the accompanying workerd change has just been merged, testing locally was accomplished by pointing at my local branch:

$ cd /fixtures/vitest-pool-workers-examples 
$ export MINIFLARE_WORKERD_PATH="/Users/mattl/code/workerd/bazel-bin/src/workerd/server/workerd"
$ pnpm test images
...
   ✓ Images binding > can upload an image 7ms
   ✓ Images binding > can upload a base64-encoded image 6ms
   ✓ Images binding > can get image metadata 4ms
   ✓ Images binding > can get image data 3ms
   ✓ Images binding > can update image metadata 4ms
   ✓ Images binding > can delete an image 5ms
   ✓ Images binding > can list images 10ms
   ✓ Images binding > returns null for non-existent image metadata 3ms
   ✓ Images binding > returns error for non-existent image blob 3ms
   ✓ Images binding > can return image info 109ms

 Test Files  1 passed (1)
      Tests  10 passed (10)

To sanity check the local development experience, workerd was compiled locally and run against our local miniflare with a barebones test worker:

export default {
  async fetch(request, env: Env, ctx): Promise<Response> {
    const originalImage = await fetch("https://images.mglewis.uk/snail.jpg");
    const uploadedImageMetadata = await env.IMAGES.hosted.upload(originalImage.body!);
    const uploadedImage = await env.IMAGES.hosted.image(uploadedImageMetadata.id);
    const result = await env.IMAGES.input(uploadedImage)
      .transform( { width: 500, rotate: 180 })
      .output({ format: "image/webp" });
    return result.response();
  },
} satisfies ExportedHandler<Env>;

Running this test worker against our local workerd branch:

$ export MINIFLARE_WORKERD_PATH="$HOME/code/workerd/bazel-bin/src/workerd/server/workerd"
$ cd $HOME/code/example-worker
$ node $HOME/code/workers-sdk/packages/wrangler/wrangler-dist/cli.js dev
...
[wrangler:info] GET / 200 OK (270ms)

Hurrah, our snail has been successfully uploaded, fetched and rotated!

Note that running wangler with the --remote flag currently fails with a 500. I have a bit of a gap in understanding here, but believe that this should be possible to get working once we have the necessary internal systems correctly configured.

$ node $HOME/code/workers-sdk/packages/wrangler/wrangler-dist/cli.js dev --remote
...
[wrangler:info] GET / 500 Internal Server Error (3105ms)
✘ [ERROR] env.IMAGES.upload is not a function

• Tests
  • Tests included/updated
  • Tests not necessary because:
• Public documentation
  • Cloudflare docs PR(s):
  • Documentation not necessary because: This hasn't been officially released yet

---

[changeset-bot]

🦋 Changeset detected

Latest commit: be951c1

The changes in this PR will be included in the next version bump.

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[pkg-pr-new]

create-cloudflare

npm i https://pkg.pr.new/create-cloudflare@10153

@cloudflare/kv-asset-handler

npm i https://pkg.pr.new/@cloudflare/kv-asset-handler@10153

miniflare

npm i https://pkg.pr.new/miniflare@10153

@cloudflare/pages-shared

npm i https://pkg.pr.new/@cloudflare/pages-shared@10153

@cloudflare/unenv-preset

npm i https://pkg.pr.new/@cloudflare/unenv-preset@10153

@cloudflare/vite-plugin

npm i https://pkg.pr.new/@cloudflare/vite-plugin@10153

@cloudflare/vitest-pool-workers

npm i https://pkg.pr.new/@cloudflare/vitest-pool-workers@10153

@cloudflare/workers-editor-shared

npm i https://pkg.pr.new/@cloudflare/workers-editor-shared@10153

@cloudflare/workers-utils

npm i https://pkg.pr.new/@cloudflare/workers-utils@10153

wrangler

npm i https://pkg.pr.new/wrangler@10153

commit: 02cef36

[emily-shen]

generally lgtm, could you get a review from the images team too to double check the implementation matches your team's expectations?

[mglewis]

generally lgtm, could you get a review from the images team too to double check the implementation matches your team's expectations?

I've had a chat with @dochne (Images colleague) and he's happy with the implementation.