Dynamic image resizing with Node.js and Serverless framework
In this example, we set up a dynamic image resizing solution with AWS S3 and a Serverless framework function written in Node.js. We use the sharp
package for image resizing.
sharp
includes native dependencies, so in this example we are building and deploying the Serverless function from a Docker container that’s based on Amazon Linux.
Pre-requisites
In order to deploy the function, you will need the following:
- API credentials for AWS, with Administrator permissions (for simplicity, not recommended in production).
- An S3 bucket in your AWS account.
- Serverless framework installed locally via
yarn global add serverless
. - Node.js 8 and
yarn
installed locally. - Docker and docker-compose installed locally.
Deploying the Serverless project
- Clone the repository and install the dependencies:\
yarn
- Add your AWS credentials into the
secrets/secrets.env
file. - Deploy the Serverless project:\
docker-compose up --build
Setting up the S3 bucket
Make sure that your S3 bucket is public. Then follow these additional setup steps:
- Configure the S3 bucket for website hosting as shown in the S3 documentation.
- In the Advanced Conditional Redirects section of the Website Hosting settings for the S3 bucket, set up the following redirect rule:
<RoutingRules> <RoutingRule> <Condition> <HttpErrorCodeReturnedEquals>404</HttpErrorCodeReturnedEquals> </Condition> <Redirect> <Protocol>https</Protocol> <HostName>your_api_endpoint.execute-api.us-east-1.amazonaws.com</HostName> <ReplaceKeyPrefixWith>dev-1/</ReplaceKeyPrefixWith> <HttpRedirectCode>307</HttpRedirectCode> </Redirect> </RoutingRule></RoutingRules>
You will need to replace your_api_endpoint
part with the URL of your Serverless endpoint. You can find out what’s the endpoint URL by running:
serverless info
or observing the output of the deployment step.
Any questions or suggestions?
Please feel free to open an issue on this repository if something doesn’t work is doesn’t behave as described here. Thanks for giving this project a try!