We were using the v3 version of the AWS serverless image handler for image processing for our site. However, when AWS released this update, the whole thing was broken. Unfortunately, the new version (v4) does not work with the Thumbor style requests because of the following reasons:
It only works with images in the root of the s3 bucket
The security hash functionality has not been implemented to make it secure
Some of the mappings between the Thumbor request and the json request are incorrect
the 'auto_webp' functionality has not been implemented, so it cannot serve webp images to browsers that support them.
How can I get up and running on the new version of the AWS serverless-image-handler without having to make major changes to my application (ie I would like to continue to use the Thumbor style request, but with v4 of the serverless-image-handler)?
I've noticed that quite a few other people were having the same problem as this, so I hope these notes will help people sort out their problems.
With a certain amount of work on the lambda image handler function on the new v4 of this stack, I now have it working satisfactorily with Thumbor style requests, and I did not need to change the way my application requests images.
Please note that some of the fixes here are limited in that we only use a subset of Thumbor functionality, so we have only fixed what we needed to. It may be that you are using options that we are not which may also need additional or different coding in order to get working.
Once you have deployed v4 of the AWS serverless-image-handler stack, the only thing that you need to change is the Lambda 'ImageHandlerFunction' for your stack that was created by cloud formation. Here are some quick pointer for making updates to this:
Locate the ImageHandlerFunction in Lambda, go into it and click Actions --> Export function --> Download deployment package
This will download a zip file containing all the code for the image handler. Extract all the files from this zip.
You can now start making changes to code. You can run the unit tests using mocha if you want.
Once you have made changes to code, you need to create a new zip with all the files in
You need to upload your new deployment package to S3 before you can update the ImageHandlerFunction (it is too big to upload directly)
Once you have uploaded to somewhere on S3, go to the ImageHandlerFunction in lambda and select the s3 options from code entry type. Enter the link to the zip file on S3, and click save at the top of the page.
You can now test your updated function. Remember that the responses are cached on cloudfront, so you might need to create and invalidation on cloudfront to test it, or use a new image which is not yet cached.
With regards to fixing the issues mentioned above:
To get it working with images in subfolders, not just the root of the S3 bucket: See my fix here - basically you need to change this:
const key = (event["path"]).split("/");
return key[key.length - 1];
The solution I used including unit tests is in the github comment above. You may require a slightly different solution.
To get the security hash working, see my fix here
To get automatic webp support working, see my fix here
With regards to fixing the mapping between Thumbor and the json image request, this required a few minor changes but was not really a big deal. It is probably best just to do this based on your own requirements, as my fixes were quite specific to my usage. I will try to add some notes to the relevant github tickets.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With