payloadcms / payload

The best way to build a modern backend + admin UI. No black magic, all TypeScript, and fully open-source, Payload is both an app framework and a headless CMS.
https://payloadcms.com
MIT License
21.1k stars 1.27k forks source link

Image metadata stripped from image when using upload.imageSizes #6951

Open hjbugajski opened 6 days ago

hjbugajski commented 6 days ago

Link to reproduction

https://github.com/hjbugajski/payload-3.0-stripped-metadata

Payload Version

3.0.0-beta.55

Node Version

20.14.0

Next.js Version

15.0.0-rc.0

Describe the Bug

When imageSizes is set in the collection upload config, all metadata is stripped from all image sizes, including the original image. When imageSizes is removed from the collection upload config, the metadata is preserved in the image since no transformations are done.

I believe this is due to sharp stripping all metadata by default, and when uploading multiple image sizes, the "original" image is recreated with sharp with no formatting or transformations applied, thus stripping the metadata.

Possible solutions may be to use keepMetadata or withMetadata to preserve the metadata for images, or upload the original image without using sharp.

Reproduction Steps

Steps

  1. Clone the reproduction repository.
  2. Start a MongoDB container and run the Payload application.
  3. Go to the Media collection and upload a new image (example image provided in repository).
  4. Metadata should be displayed after save.
  5. Uncomment lines 41–47 in Media.ts
  6. Create a new upload with the example image.
  7. Metadata should not be displayed after save.

Video

https://github.com/payloadcms/payload/assets/22182454/6b755386-fa34-489f-a6d0-06dc2c28e60c

Adapters and Plugins

No response