Fork of Serverless Image Handler
- New URL scheme. Edit with Sharp using search (query) parameters for better SEO. See Usage
- Custom domain. A certificate and hosted zone is automatically generated for your domain
- Improved cache hit ratio when
AutoWebPParameter
is enabled - Origin Shield support for improved cache hit ratio and performance
- Disabled data collection
- Upgraded dependencies
- Scripts are only run from local dependencies (uses
npm run
instead ofnpx
) for greater reliability
- AWS Command Line Interface
- Node.js 20.x or later
git clone https://github.com/GeKorm/aws-sih.git
cd aws-sih
export MAIN_DIRECTORY=$PWD
After making changes, run unit tests to make sure added customization passes the tests:
cd $MAIN_DIRECTORY/deployment
chmod +x run-unit-tests.sh && ./run-unit-tests.sh
Pick either
cd $MAIN_DIRECTORY/source/constructs
npm run clean:install
overrideWarningsEnabled=false npm run cdk -- bootstrap --profile <PROFILE_NAME>
overrideWarningsEnabled=false npm run cdk -- deploy\
--parameters DeployDemoUIParameter=No\
--parameters SourceBucketsParameter=<MY_BUCKET>\
--profile <PROFILE_NAME>
cd $MAIN_DIRECTORY/source/constructs
npm run clean:install
overrideWarningsEnabled=false npm run cdk -- bootstrap --profile <PROFILE_NAME>
overrideWarningsEnabled=false npm run cdk -- deploy --all\
--parameters ServerlessImageHandlerStack:DeployDemoUIParameter=No\
--parameters ServerlessImageHandlerStack:SourceBucketsParameter=<MY_BUCKET>\
--context customDomain=<MY_DOMAIN>\
--profile <PROFILE_NAME>
The first deployment with a custom domain requires verifying ownership, if not already verified. Until verified, the deployment will seem stuck at the Certificate create_in_progress
step. Please see https://docs.aws.amazon.com/acm/latest/userguide/domain-ownership-validation.html
for instructions. The solution will have created a Hosted zone for you custom domain, which you can view in the AWS Route 53 dashboard.
Note:
- MY_BUCKET: name of an existing bucket or buckets in your account
- PROFILE_NAME: name of an AWS CLI profile that has appropriate credentials for deploying in your preferred region
- MY_DOMAIN: full domain to use as a Cloudfront alias, eg
--context customDomain=x.example.com
See all parameters: Parameters reference
For automated deployments with GitHub actions, see .github/workflows/pipeline-workflow.yml
.
- Fork this repo
- Bootstrap locally if not already done
- Change
if: github.repository_owner == 'GeKorm'
to your user or organization name - Add the following variables and secrets:
- Secret DISPATCHER_ROLE_ARN (for
role-to-assume
in aws credentials action) - Secret SOURCE_BUCKETS (for
SourceBucketsParameter
) - [Optional] Variable DEMO_UI (for
DeployDemoUIParameter
) - [Optional] Secret CUSTOM_DOMAIN (for
customDomain
) - [Optional] Secret AWS_REGION (environment variable)
- Secret DISPATCHER_ROLE_ARN (for
For further customization, such as using Origin Shield, please modify the pipeline workflow command.
The new URL scheme is https://<domain>/<s3-url-or-path-to-image>?edits=<edits>
. The bucket and key are part of the URL unencoded. All other parameters like moved to the query string portion of the URL.
// How to use edits https://docs.aws.amazon.com/solutions/latest/serverless-image-handler/create-and-use-image-requests.html#dynamically-resize-photos
const edits = {};
// Stringify and encode URI
// For s3 bucket "bucket" and image key "/folder/image.jpg":
const url = `https://example.cloudfront.net/bucket/folder/image.jpg?edits=${encodeURIComponent(
JSON.stringify(edits),
)}`;
The image's full S3 URL can be used. This is a non-exhaustive list of accepted formats
- https://example.cloudfront.net/bucket/folder/image.jpg?edits=
- https://example.cloudfront.net/s3.us-east-1.amazonaws.com/bucket/test.jpg?edits=
- https://example.cloudfront.net/https://s3.amazonaws.com/bucket/test?edits= (extension is optional)
- https://example.cloudfront.net/s3.amazonaws.com/bucket/test.jpg?edits=
- https://example.cloudfront.net/https://s3-us-east-1.amazonaws.com/source-bucket/test.jpg?edits=
Please open an issue if your preferred S3 URL format isn't supported.
Key | Value |
---|---|
signature |
string |
effort |
number (Default: 4 , see Sharp options.effort ) |
outputFormat |
ImageFormatTypes |
edits |
encodeURIComponent(JSON.stringify(edits)) |
headers |
encodeURIComponent(JSON.stringify(headers)) |
As an alternative to encodeURIComponent
you can use URL
or URLSearchParams
const url = new URL("https://cdn.example.com/bucket/image.jpg");
url.searchParams.set("outputFormat", "webp");
url.searchParams.set("edits", JSON.stringify(edits));
console.log(url.toString());
// https://cdn.example.com/bucket/image.jpg?outputFormat=webp&edits=%7B%22
// or equivalent
const params = new URLSearchParams();
params.set("outputFormat", "webp");
params.set("edits", JSON.stringify(edits));
console.log("https://cdn.example.com/bucket/image.jpg?" + params.toString());
// https://cdn.example.com/bucket/image.jpg?outputFormat=webp&edits=%7B%22
Thumbor and the Rewrite feature may work, but are not supported. Please use the original solution if required.
Required in bold
These parameters can be added using the --parameters ServerlessImageHandlerStack:<PARAMETER>
command line flag.
Name | Type | Default | |||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
String
|
No |
||||||||||||||||||
CorsOriginParameterIf you selected 'Yes' above, please specify an origin value here. A wildcard (*) value will support any origin. We recommend specifying an origin (i.e. https://example.domain) to restrict cross-site access to your API. |
String | * |
|||||||||||||||||
String | defaultBucket, bucketNo2, bucketNo3, ... |
||||||||||||||||||
String
|
Yes |
||||||||||||||||||
Number
|
1 |
||||||||||||||||||
String
|
No |
||||||||||||||||||
String
|
No |
||||||||||||||||||
String | |
||||||||||||||||||
String | |
||||||||||||||||||
String
|
No |
||||||||||||||||||
String | |
||||||||||||||||||
String | |
||||||||||||||||||
CloudFrontPriceClassParameterThe AWS CloudFront price class to use. For more information see: Cloudfront documentation |
String
|
PriceClass_All |
These parameters can be added under context
in cdk.json
, or using the --context
command line flag.
Name | Type | Default | ||
---|---|---|---|---|
customDomainAlternative domain name for this distribution. For more information, see Cloudfront documentation |
String | |
||
originShieldEnabledEnable Origin Shield to improve cache hit ratio and performance. For more information, see Origin Shield documentation |
String
|
No |
||
originShieldRegionMust be specified if Origin Shield is not supported in your AWS_REGION. See Origin Shield regions |
String | process.env.AWS_REGION |
Name | Type | Default |
---|---|---|
AWS_REGIONDeploy the solution to this region. Supported regions |
String | us-east-1 |
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
SPDX-License-Identifier: Apache-2.0