search

aws-samples / image-optimization

Simple, performant and cost efficient solution for optimizing images using Amazon CloudFront, Amazon S3 and AWS Lambda
MIT No Attribution
195 stars 116 forks source link

Query string parameters (wordpress support) #19

Open dciphered opened 10 months ago

dciphered commented 10 months ago

Hi all,

I have a question regarding the query string parameters that are being passed for image transformations. On inspection of the cloudfront function, it appears as though the optimizer supports 4 query string parameters for performing image transformations (format, width, height and quality). The issue that I'm experiencing is that frameworks such as Wordpress have specific parameters that are used in image URLs, for example 'h' and 'w' for height and width respectively, which doesn't get parsed by the CF function. Other query string parameters that typically get used by image optimization CDN's include 'q' for quality, 's' for security keys, etc..

In short, anyone attempting to implement this image optimization solution on a wordpress site won't have any luck doing so unless the URIs are constructed/transformed appropriately on the web server before the image is called via the optimizer CF distribution (which isn't currently viable).

Is there a simple way to achieve this? Essentially, the requirement would be to transform the below sample URL (the first being a wordpress image url with transformation parameters) into one that can be properly interpreted by the image optimizer (second sample url):

  1. Wordpress URL which includes dimensions and other image optimizer query strings (supported by Imigix, etc.): hxxp://sample-image.jpg?q=50&h=500&w=500&s=123456789

  2. URL that AWS image-optimizer expects: hxxp://sample-image.jpg?format=auto&height=500&quality=50&width=500

Assuming the answer will require modifying the cloudfront function (and maybe a lambda function or functions)...

Alternatively (and possibly a big ask) but having a co-pilot wordpress plugin developed that would do exactly this for image URLs would be the best solution by far, avoiding having to spin up a custom branch for maintaining this stack to achieve image optimization for wordpress websites.

Many thanks and I look forward to your reply.

achrafsouk commented 10 months ago

Hello,

As you figured out, it's simply possible by changing the CloudFront Function, notably the case switches: case 'width': -> case 'w':

Thanks for the feedback regarding a wordpress plugin, it's noted.

chrillep commented 7 months ago

+1