cloudflare / cloudflare/workerd
🐛 Bug Report — Runtime APIs: Local image transform binding result does not play nice with `waitUntil`
- Dominant language
- C++
- Stars
- 8.7k
- Forks
- 739
- Avg merge
- 2d 20h
- Merged PRs (30d)
- 174
Description
Hi, I'm trying to use Image Transform binding to transform images then save it to cache using cache API and serve it to the user. My current code looks like this (using from Sveltekit):
```typescript
const imageURL = "Some URL"
const resp = await fetch(
imageURL,
{
cf: {
cacheTtl: 31536000
}
}
);
const cacheKey = 'someKey'
const transformedImage = (await platform!.env.IMAGES.input(resp.body!)
.transform({ width: 190, height: 250, fit: 'squeeze' })
.output({ format: 'image/webp' })).response()
const newResp = new Response(transformedImage.body, transformedImage);
newResp.headers.set('Cache-Control', 'public, max-age=31536000, immutable');
platform!.ctx.waitUntil(cache.put(cacheKey, newResp.clone()));
return newResp
```
Whenever I use waitUntil function to put the image into the cache, the image responded to the user is broken in half, like the buffer was unexpectedly exhausted, result a half finished image like this (Chrome tried to render the image but the binary is broken):
To workaround this at local, instead of using `waitUntil`, I have to use the traditional `await` method to put the data into cache:
```typescript
await cache.put(cacheKey, newResp.clone())
return newResp
```
Oddly enough, this code is only broken in miniflare, but still works fine on the CF environment.
Could you guys check this out? Thank you!
Contributor guide
Assessment
This issue has not been assessed yet.