How to use autojpg() filter on a cloudfront request ?

[aligajani]

I basically want to add a filter:autojpg() to this and I have tried various combinations, but to no avail.

The PNG never converts to JPG. Any help would be appreciated. Thank you.

const cloudifyUrl = (uuid, width = 500, height = 500) => {
    const imageRequest = JSON.stringify({
        bucket: process.env.NEXT_PUBLIC_BUCKET_NAME,
        key: uuid,
        edits: {
            resize: {
                width,
                height,
                fit: 'cover',
            },
        },
    });
    return `${process.env.NEXT_PUBLIC_CLOUDFRONT_URL}/${btoa(imageRequest)}`;
};

[dougtoppin]

@aligajani We will get back to you on this

[dougtoppin]

@aligajani

Can you try using toFormat in your request to see if that does what you need?

const imageRequest = JSON.stringify({
    bucket: process.env.NEXT_PUBLIC_BUCKET_NAME,
    key: uuid,
    edits: {
        resize: {
            width : 400,
            height: 200,
            fit: 'cover',
        },
        toFormat: 'jpeg'
    }
});

I also should include that many of the sharp library functions can be used in edits.

These are not individually documented in the Implementation Guide so some experimentation may be necessary to confirm the expected behavior.

For example, the toFormat usage can be found at https://sharp.pixelplumbing.com/api-output#toformat

[dougtoppin]

Converting this to a Q&A Discussion