Images with INVALID_IMAGE_OPTIMIZE_REQUEST in Vercel deploy about payload

[poofy25]

Here (https://github.com/payloadcms/payload/discussions/6704#discussioncomment-9821934),
I opened the same exact issue about a month prior.

Basically the workaround I found is to give a website url before the image url

For example

Before:
<Image src={image.url} ...>

After
<Image src={${process.env.WEBSITE_URL}${image.url}} />

[denisprado]

Here (https://github.com/payloadcms/payload/discussions/6704#discussioncomment-9821934), I opened the same exact issue about a month prior.

Basically the workaround I found is to give a website url before the image url

For example

Before: <Image src={image.url} ...>

After <Image src={${process.env.WEBSITE_URL}${image.url}} />

Here (https://github.com/payloadcms/payload/discussions/6704#discussioncomment-9821934), I opened the same exact issue about a month prior.

Basically the workaround I found is to give a website url before the image url

For example

Before: <Image src={image.url} ...>

After <Image src={${process.env.WEBSITE_URL}${image.url}} />

Unfortunately this approach does not worked for me.

[denisprado]

Worked for me using Aws s3 adapter (I guess it will be not necessary) and adding the parâmeter loader={() => src} to the Images components.

[marvinengelmann]

<Image
  src={`${process.env.NEXT_PUBLIC_URL}${image.url}`}
/>

This approach is working for me. I am using Vercel Blob store, Vercel Postgres and beta 53.

[marvinengelmann]

Worked for me using Aws s3 adapter (I guess it will be not necessary) and adding the parâmeter loader={() => src} to the Images components.

As far as I know, a custom loader that just returns the image url disables Vercel image optimization.

[denisprado]

Worked for me using Aws s3 adapter (I guess it will be not necessary) and adding the parâmeter loader={() => src} to the Images components.

As far as I know, a custom loader that just returns the image url disables Vercel image optimization.

May be, but if I only disable the optimization for entire app, the error continues.. with loader, the error stopped.

[denisprado]

Now, I am using an s3 bucket and an image loader like this:

const imageLoader = ({ src, width, quality }: ImageLoaderProps) => { const params = [w=${width}]; if (quality) { params.push(q=${quality}); } const paramsString = params.join("&"); return https://${process.env.S3_BUCKET}.s3.${process.env.S3_REGION}.amazonaws.com/${src}?${paramsString}; };

to achieve image optimization. I don't think this is fully integrated with Payload's image sizes, but it makes it viable to continue using it.