This content originally appeared on DEV Community and was authored by Van Hoang Kha
Table of Content
1. Create Lambda@Edge function
In this section, we will create a Lambda@Edge function.
Go to the AWS Console and make sure you are in the US-EAST-1 N. Virginia region.
Go to Lambda console and select Create function
Perform configuration:
- Select "Author from scratch"
- Select "Create function"
- Name: "LambdaEdgeImmersionDayLabFunction"
- Runtime: "Node.js 18.x"
Role: "Create new role from AWS policy templates"
- Role name: "lambda_edge_execution_role"
- Policy templates: "Basic Lambda@Edge permissions (for CloudFront trigger)"
- Click "Create function"
Finish creating Lambda function. You have successfully created a new IAM role, which is used to allow CloudFront to invoke Lambda and log to CloudWatch.
Select tab Test
- Select Create new test event
- Event Name : “TestEvent”
Replace Hello World JSON with the following json:
{
"Records": [
{
"cf": {
"config": {
"distributionDomainName": "d123.cloudfront.net",
"distributionId": "EDFDVBD6EXAMPLE",
"eventType": "viewer-request",
"requestId": "MRVMF7KydIvxMWfJIglgwHQwZsbG2IhRJ07sn9AkKUFSHS9EXAMPLE=="
},
"request": {
"clientIp": "2001:0db8:85a3:0:0:8a2e:0370:7334",
"method": "GET",
"querystring": "size=large",
"uri": "/picture.jpg",
"headers": {
"host": [
{
"key": "Host",
"value": "d111111abcdef8.cloudfront.net"
}
],
"user-agent": [
{
"key": "User-Agent",
"value": "curl/7.51.0"
}
]
},
"origin": {
"custom": {
"customHeaders": {
"my-origin-custom-header": [
{
"key": "My-Origin-Custom-Header",
"value": "Test"
}
]
},
"domainName": "example.com",
"keepaliveTimeout": 5,
"path": "/custom_path",
"port": 443,
"protocol": "https",
"readTimeout": 5,
"sslProtocols": [
"TLSv1",
"TLSv1.1"
]
},
"s3": {
"authMethod": "origin-access-identity",
"customHeaders": {
"my-origin-custom-header": [
{
"key": "My-Origin-Custom-Header",
"value": "Test"
}
]
},
"domainName": "my-bucket.s3.amazonaws.com",
"path": "/s3_path",
"region": "us-east-1"
}
}
}
}
}
]
}
- Select Create
Return to the Lambda function interface and select Code
Now we will write a function to generate generated HTML.
Copy and paste the following code into the function code window:
const handler = (event, context, callback) => {
console.log("Request Event:" + JSON.stringify(event, null, 2));
const requestHeaders = event.Records[0].cf.request.headers;
var htmlContent;
//Insert code to generate the html content content here.
const response = {
status: '200',
statusDescription: 'OK',
headers: {
'cache-control': [{
key: 'Cache-Control',
value: 'max-age=100'
}],
'content-type': [{
key: 'Content-Type',
value: 'text/html'
}],
'content-encoding': [{
key: 'Content-Encoding',
value: 'UTF-8'
}],
},
body: htmlContent,
};
callback(null, response);
};
module.exports.handler = handler;
- Save
- Chọn Deploy
- Sau đó chọn Test
View Test Results
Let's see the result of the execution. Notice that the output is a JSON version of the HTTP 200 response that CloudFront will use to respond to the request. In this case, the response is still missing the body.
In the Log output, we can see that the test event we configured is logged as a Request Event on the function's input. This JSON represents the properties of the request received by CloudFront, which can be read or modified. In this exercise, we will read the headers and return the result as a nice HTML table.
Replace the comment with the code needed to generate the HTML body. You can use console.log to output and debug your code.
exports.handler = (event, context, callback) => {
const requestHeaders = event.Records[0].cf.request.headers;
let str = '<table border="1" width="100%">' +
'<thead>' +
'<tr><td><h1>Header</h1></td><td><h1>Value</h1></td></tr>' +
'</thead>' +
'<tbody>';
for (const key in requestHeaders) {
if (requestHeaders.hasOwnProperty(key)) {
str += '<tr><td>' + key + '</td><td>' + requestHeaders[key][0].value + '</td></tr>';
}
}
str += '</tbody></table>';
const htmlContent = `
<html lang="en">
<body>
<table border="1" width="100%">
<thead>
<tr><td><h1>Lambda@Edge Lab</h1></td></tr>
</thead>
<tfoot>
<tr><td>Immersion Days - Edge Services - Module 3</td></tr>
</tfoot>
<tbody>
<tr><td>Response sent by API</td></tr>
</tbody>
<tbody>
<tr><td>${str}</td></tr>
</tbody>
</table>
</body>
</html>
`;
const response = {
status: '200',
statusDescription: 'OK',
headers: {
'cache-control': [{ key: 'Cache-Control', value: 'max-age=100' }],
'content-type': [{ key: 'Content-Type', value: 'text/html' }],
'content-encoding': [{ key: 'Content-Encoding', value: 'UTF-8' }],
},
body: htmlContent,
};
callback(null, response);
};
- Save
- Select Deploy
- Select Test
View Test Result
Return to Lambda function, select Versions
- Select Push new version
Enter
version 1
and select Publish
Complete Lambda Function creation using CloudFront.
2. Deploy Lambda@Edge function to CloudFront
In this section, we will add CloudFront as a trigger for your Lambda function.
In the same lambda console, you have implemented version 1 of the Lambda function. Click the Add trigger button and select CloudFront.
Click Deploy to Lambda@Edge.
Configure the trigger to use the previously created CloudFront Distribution and Cache Behavior with the following settings:
- Distribution:
- Cache behavior: "/serverless"
- CloudFront event: Origin request
- Select "I acknowledge that on deploy a new version of this function will be published with the above trigger and replicated across all available AWS regions."
- Click Deploy
Deployment will take approximately 5 minutes to complete for CloudFront distribution. In some cases, you can start testing in less than 5 minutes, depending on your location.
Return to Lambda interface and select Replicas.
Now search for your Lambda function in the Lambda functions list and you will find a Lambda function Replica in us-east-1 for the Lambda function you created.
When you move to other AWS regions, you will find that there is a Lambda function replica in all regions where CloudFront has a Regional Edge Cache. These are the Lambda functions that will be called when your CloudFront distribution executes Lambda@Edge. Once your CloudFront distribution has been deployed, test your CloudFront distribution by accessing Distribution in a browser with a serverless path.
3. Metrics and Logs
To generate traffic from different geographic locations, you can use CloudShell to send HTTP requests. It is a shell environment that includes the curl tool to safely interact with your AWS resources. Send multiple requests using the curl tool to generate traffic to CloudFront from different regions.
Go to the AWS Lambda console and select an AWS region near one of the locations you selected to send requests.
View CloudWatch Logs.
View detailed Log events.
Clean up resources
Delete S3 bucket
Step 1: Log in to the AWS Management Console.
Step 2: Select S3 service.
Step 3: Select the bucket you want to delete.
Step 4: Click the Delete bucket button at the top of the screen.
Step 5: Enter the bucket name in the confirmation box and click Delete.
Note: If the bucket contains any objects, you will not be able to delete the bucket directly. You must delete all objects in the bucket before deleting the bucket. If you want to delete some specific objects, select the object and click the Delete button.
Use the AWS Command Line Interface (CLI) to delete a bucket
You can also use the AWS CLI to delete buckets. Here are the steps to delete a bucket using the AWS CLI:
Step 1: Open Command Prompt or Terminal.
Step 2: Sign in to the AWS CLI.
Step 3: Use the following command to delete the bucket:
aws s3 rb s3://bucket-name --force
Where, bucket-name is the name of the bucket you want to delete. The --force option is used to confirm the deletion of the bucket.
Note: If the bucket contains any objects, you will not be able to delete the bucket directly. You must delete all objects in the bucket before deleting the bucket. If you want to delete some specific objects, use aws s3 rm command to delete them.
With the steps above, you can delete a bucket in AWS S3 using the user interface or the AWS CLI. Make sure you back up all your data before deleting the bucket, and do this carefully.
Terminate EC2
-
Step 1: Login to AWS Management Console
- To delete EC2, you first need to log in to the AWS Management Console. This can be done by going to https://aws.amazon.com and logging in with your AWS account.
-
Step 2: Search for EC2 instance to delete
- After logging in to the AWS Management Console, you need to find the EC2 instance that you want to delete. You can use the search engines or browse the EC2 instance lists to find the instances you want to delete.
Step 3: Delete EC2 instance
-
Once you find an EC2 instance to delete, you can delete it by performing the following steps:
- Right click on the EC2 instance you want to delete.
- Select "Instance State" from the menu that appears.
- Select "Terminate" to delete EC2 instance.
- You will receive a warning to confirm the deletion of the EC2 instance. If you are sure you want to delete the EC2 instance, select "Yes, Terminate".
Delete CloudFront Distribution
Step 1: Access AWS Console
First, you need to sign in to the AWS Console with your account at https://console.aws.amazon.com/.
Step 2: Select CloudFront . service
After logging in to the AWS Console, you need to select the CloudFront service by clicking the "Services" icon on the top bar and searching for CloudFront. You can enter the keyword "CloudFront" in the search box to find the service faster.
Step 3: Select CloudFront Distribution to delete
In the CloudFront screen, you will see a list of CloudFront Distributions. Find and select the CloudFront Distribution you want to remove by clicking on its name.
Step 4: Delete CloudFront Distribution
After selecting the CloudFront Distribution to delete, you need to click the "Distribution Settings" button. In the distribution settings page you will see a "Delete" button. Click this button and confirm deletion of CloudFront Distribution by entering "Yes" in the confirmation dialog.
Note: When deleting CloudFront Distribution, all data related to it will be deleted from the system and cannot be recovered. Therefore, make sure that you have backed up your important data before performing the delete operation.
Delete Lambda Function
Step 1: Log in to your AWS account and go to the Lambda service management page.
Step 2: Find and select the Lambda Function you want to delete.
Step 3: Click the Actions button and select Delete Function.
Step 4: Confirm deletion by pressing Delete.
Note: You cannot restore a deleted Lambda Function.
Remove Lambda Edge
Step 1: Log in to your AWS account and go to the Lambda service management page.
Step 2: Select the Functions tab and select the Lambda Function used by Lambda Edge.
Step 3: Find and click the Triggers tab and select Edge Association.
Step 4: Click the Delete button and confirm by pressing Yes.
Note: After removing Lambda Edge, you need to wait about 10 minutes for the changes to take effect across the CDN network.
This content originally appeared on DEV Community and was authored by Van Hoang Kha
Van Hoang Kha | Sciencx (2023-03-01T21:05:42+00:00) Get started with CloudFront – Part 4: Lambda@Edge function. Retrieved from https://www.scien.cx/2023/03/01/get-started-with-cloudfront-part-4-lambdaedge-function/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.