{"id":29150380,"url":"https://github.com/fe-eule/aws-cloudfront-lamda-image-resizer","last_synced_at":"2026-02-25T11:02:25.151Z","repository":{"id":248614681,"uuid":"829190459","full_name":"fe-eule/aws-cloudfront-lamda-image-resizer","owner":"fe-eule","description":"This is a simple example of how to use AWS Lambda to resize images on the fly using Amazon CloudFront.","archived":false,"fork":false,"pushed_at":"2025-04-28T02:55:35.000Z","size":20,"stargazers_count":2,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-06-30T23:11:27.331Z","etag":null,"topics":["aws","cloudfront","image","image-resize","image-resizer","lamda","resize-image"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/fe-eule.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2024-07-16T00:14:47.000Z","updated_at":"2025-04-28T02:55:38.000Z","dependencies_parsed_at":"2025-06-30T23:20:49.399Z","dependency_job_id":null,"html_url":"https://github.com/fe-eule/aws-cloudfront-lamda-image-resizer","commit_stats":null,"previous_names":["fe-eule/aws-cloudfront-lamda-image-resizer"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/fe-eule/aws-cloudfront-lamda-image-resizer","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fe-eule%2Faws-cloudfront-lamda-image-resizer","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fe-eule%2Faws-cloudfront-lamda-image-resizer/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fe-eule%2Faws-cloudfront-lamda-image-resizer/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fe-eule%2Faws-cloudfront-lamda-image-resizer/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/fe-eule","download_url":"https://codeload.github.com/fe-eule/aws-cloudfront-lamda-image-resizer/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fe-eule%2Faws-cloudfront-lamda-image-resizer/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":267598131,"owners_count":24113604,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-07-28T02:00:09.689Z","response_time":68,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["aws","cloudfront","image","image-resize","image-resizer","lamda","resize-image"],"created_at":"2025-06-30T23:10:26.258Z","updated_at":"2026-02-25T11:02:25.082Z","avatar_url":"https://github.com/fe-eule.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# aws-cloudfront-lambda-image-resizer\n\nThis is a simple example of how to use AWS Lambda to resize images on the fly using Amazon CloudFront.\n\n## Why use this?\n\n- Low-resolution images on high-resolution displays create a bad user experience.\n- High-resolution images on low-resolution displays waste bandwidth, device, and server resources, especially when using a framework that adopts images in-app and crops or resizes images, making the app heavy.\n\n## How to use\n\nAdd query parameters. That's it.\n\n- width\n- height\n- format ('auto' option checks the Accept request header)\n- quality (0~100, default: 100)\n\n### Request image example\n\n- https://your-domain/images/hangang-river.jpeg?width=1100 (940KB)\n- https://your-domain/images/hangang-river.jpeg?width=1100\u0026format=webp (658KB)\n\n\u003cimg width=\"480\" alt=\"image\" src=\"https://github.com/user-attachments/assets/259a368a-12db-4bb4-96dc-68c0beeca993\"\u003e\n\n## How it works\n\n1. The user requests an image from CloudFront.\n2. CloudFront forwards the request to the Lambda function.\n3. The Lambda function resizes the image and returns it to CloudFront.\n4. CloudFront caches the image and returns it to the user.\n5. The next time the same image is requested, CloudFront returns the cached image.\n6. If the image is updated, the cache is invalidated and the process starts over.\n7. The Lambda function is only invoked when the image is requested for the first time or when the cache is invalidated.\n\n## How to test\n\n1. Build the Docker image:\n\n```bash\ndocker build -t lambda-image-resizer .\n```\n\n2. Create a directory to store test images and run the Docker container:\n\n```bash\nmkdir -p test-images\ndocker run -it -v $(pwd)/test-images:/app/test-images lambda-image-resizer /bin/sh\n```\n\n3. After accessing the container, you can run the test as follows:\n\n```bash\naws-lambda-local -l index.mjs -h handler -e test-event.json\n```\n\n### Configuration\n\n- Modify the following environment variables in the Dockerfile if needed:\n  - AWS_REGION: AWS region\n  - S3_BUCKET: S3 bucket name\n  - If AWS credentials are required, uncomment the relevant section and provide the values.\n- To test with actual images, place test image files in the `test-images` directory and update the URI path in `test-event.json` to match the image file path.\n\nThis test environment allows you to test the Lambda function's image processing logic locally without connecting to actual AWS resources. To connect to a real S3 bucket, set up appropriate AWS credentials.\n\n## AWS setup\n\n\u003e Create a Lambda function (choose us-east-1 to use the CloudFront response trigger)\n\n\u003cimg width=\"870\" alt=\"iShot_2024-07-16_09 13 55\" src=\"https://github.com/user-attachments/assets/0d9fbb2f-8e80-4367-98d9-728bc847efc7\"\u003e\n\n\u003e Create a Cloud9 environment for writing the Lambda function source code\n\n\u003cimg width=\"870\" alt=\"image\" src=\"https://github.com/user-attachments/assets/dafcc477-d42d-4217-a64b-fd819885ba66\"\u003e\n\n\u003e Write the Lambda function\n\nWrite the code (See this repository's source code)\n\n\u003cimg width=\"870\" alt=\"image\" src=\"https://github.com/user-attachments/assets/6c21d91c-7cde-44a6-80d0-15e907d89694\"\u003e\n\n\u003e Upload the Lambda function\n\n\u003cimg width=\"450\" alt=\"image\" src=\"https://github.com/user-attachments/assets/31fcf3e0-cda4-4e08-8bd1-fa62ad8f1095\"\u003e\n\nSelect \"Directory\" -\u003e \"No\" -\u003e Select the project folder -\u003e Open (after a few minutes, a completion message will appear)\n\n\u003e Add a Trigger\n\n\u003cimg width=\"870\" alt=\"iShot_2024-07-16_09 14 17\" src=\"https://github.com/user-attachments/assets/d2396240-8b91-44e9-8b0d-d0d8e5e3b115\"\u003e\n\n\u003e Deploy\n\n\u003cimg width=\"870\" alt=\"iShot_2024-07-16_09 13 23\" src=\"https://github.com/user-attachments/assets/38ecbbbe-57ba-445d-9f1e-ba84a1a0a2ce\"\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffe-eule%2Faws-cloudfront-lamda-image-resizer","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffe-eule%2Faws-cloudfront-lamda-image-resizer","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffe-eule%2Faws-cloudfront-lamda-image-resizer/lists"}