Sử dụng AWS Lambda @ Edge với CloudFront

Lambda @ Edge là phần bổ sung cho dịch vụ tính toán AWS Lambda được sử dụng để tùy chỉnh nội dung mà mặt tiền đám mây cung cấp.

Sơ đồ khối cho thấy hoạt động của AWS Lambda với mặt tiền đám mây từ AWS được hiển thị bên dưới:

Có bốn cách mà AWS Lambda có thể được sử dụng:

  • Viewer Request − Người dùng cuối đưa ra yêu cầu được gọi là Yêu cầu của người xem tới CloudFront

  • Origin Request − CloudFront chuyển tiếp yêu cầu đến nguồn gốc

  • Origin Response − CloudFront nhận phản hồi từ nguồn gốc

  • Viewer Response − CloudFront gửi phản hồi đến người xem

Chúng tôi có thể sử dụng Lambda @ Edge cho các mục đích sau:

  • Để thay đổi tiêu đề theo yêu cầu và thời gian phản hồi.

  • Thêm chi tiết cookie vào tiêu đề. Thực hiện kiểm tra AB dựa trên yêu cầu và phản hồi.

  • Chuyển hướng URL đến một trang web khác, dựa trên chi tiết tiêu đề.

  • Chúng tôi có thể tìm nạp tác nhân người dùng từ các tiêu đề và tìm hiểu chi tiết về trình duyệt, hệ điều hành, v.v.

Yêu cầu

Để bắt đầu làm việc trên CloudFront và Lambda @ Edge, chúng ta cần những điều sau:

  • Tạo bộ lưu trữ S3 với chi tiết tệp

  • Tạo vai trò sẽ cho phép quyền hoạt động với CloudFront và Lambda @ Edge

  • Tạo bản phân phối CloudFront

  • Tạo hàm lambda

  • Thêm chi tiết hàm lambda vào mặt tiền đám mây

  • Kiểm tra url mặt tiền đám mây trong trình duyệt

Chúng tôi sẽ làm việc trên một ví dụ với CloudFront và Lambda @ Egde, trong đó chúng tôi sẽ lưu trữ trang và thay đổi phản hồi khi được phát hiện là máy tính để bàn và thiết bị.

Tạo nhóm lưu trữ S3 với chi tiết tệp

Đăng nhập vào bảng điều khiển AWS và tạo một nhóm trong S3 và thêm . html tệp mà bạn muốn hiển thị.

Bấm vào S3 và Create bucket như hình dưới đây -

Bây giờ, hãy nhấp vào Create bucket và thêm các chi tiết của thùng như hình dưới đây -

Bấm vào Create và tải lên .html trong đó.

Tạo vai trò

Đi tới bảng điều khiển AWS và nhấp vào IAM.

Bây giờ, hãy nhấp vào Roles -> Create role nút như hình -

Chọn quyền cho S3, Lambda và Cloudfront. Một thực tiễn tốt là tạo chính sách chỉ cấp quyền cho chức năng được yêu cầu, lưu trữ bằng cách sử dụng các chi tiết ARN.

Trong ví dụ được thảo luận dưới đây, chúng tôi đang hiển thị Full Accesssự cho phép. Các chính sách cho tên vai tròrole for cloudfrontđược thêm vào như hình trên. Nhấp vào Tạo vai trò.

Tất cả các chính sách bắt buộc đối với lambda @ edge và cloudfront như được hiển thị ở trên. Có một bước bổ sung cần được thực hiện ở đây vì url sẽ có sẵn trong khu vực và cần có mối quan hệ tin cậy giữa các dịch vụ mà chúng tôi đang sử dụng.

Bây giờ, đối với vai trò đã tạo, hãy nhấp vào Trust relationships tab như hình -

Bấm vào Edit Trust Relationship như hình dưới đây -

Nó hiển thị một tài liệu chính sách. Chúng tôi cần thêm các dịch vụ khác trongPrincipal -> Servicemà chúng tôi đang dự định sử dụng. Tài liệu chính sách về mối quan hệ tin cậy cuối cùng như được hiển thị bên dưới:

Nhấp chuột Update Trust Policy để lưu các thay đổi.

Tạo phân phối CloudFront

Vào dịch vụ CloudFront như hình dưới đây -

Nhấp vào dịch vụ CloudFront và nhấp vào Create Distribution -

Cài đặt gốc, cài đặt hành vi và cài đặt phân phối

Hãy để chúng tôi xem xét từng cài đặt này -

Origin Settings

Các thông số khác nhau của cài đặt Nguồn gốc được giải thích như sau:

Origin Domain Name −Đây là tên của nhóm S3 nơi chúng tôi đã lưu trữ các tệp html. Chúng tôi cũng có thể lưu trữ hình ảnh, nếu có, trong thùng S3 bằng cách tạo các thư mục mà chúng tôi chọn.

Origin Path −Tại đây bạn cần nhập tên của thư mục chứa các tập tin. Hiện tại, chúng tôi không có thư mục này, vì vậy chúng tôi sẽ giữ nó trống.

Origin ID −Nó được điền khi tên miền gốc được chọn. Bạn có thể thay đổi id theo lựa chọn của mình.

Restrict Bucket Access − Trong này, chúng tôi sẽ chọn tùy chọn yes. Ở đây chúng ta cần bảo mật cho nhóm S3 để không ai có quyền truy cập vào nhóm S3. Đối với tùy chọn này, có một số tùy chọn khác được điền nhưOrigin Access Identity, Comment and Grant Read Permission on Bucket.

Origin Access Identity −Chúng tôi đã sử dụng tạo một tùy chọn nhận dạng mới. Bạn cũng có thể chọn danh tính hiện có. Điều này tạo ra một danh tính mới được CloudFront sử dụng để đọc chi tiết từ nhóm S3.

Grand Read Permission on Bucket − Đối với điều này, hãy chọn tùy chọn Yes.

Origin Custom Headers − Chúng tôi sẽ để trống tiêu đề ở đây, vì chúng tôi không cần chi tiết ngay bây giờ.

Tiếp theo, chúng ta hãy thảo luận và điền vào Behaviour Settings cho phân phối Cloudront -

Bây giờ, chọn giao thức - https hoặc http và tùy chọn bộ nhớ đệm. Lưu ý rằng bộ nhớ đệm mặc định là 86400 hoặc 24 giờ. Bạn có thể thay đổi giá trị này theo yêu cầu.

Nhấp chuột Object Caching(tùy chọn tùy chọn) để thay đổi bộ nhớ đệm. Bạn có thể dùngsmooth streamingtrong trường hợp nếu có bất kỳ video nào trên trang của bạn. Ở đây, chúng tôi đang giữ tùy chọn mặc định có sẵn. Khi hàm lambda được tạo, các chi tiết của nó sẽ được thêm vào.

Các chi tiết về cài đặt phân phối được hiển thị bên dưới -

Các thông số khác nhau của cài đặt phân phối được giải thích bên dưới:

Price class −Nó có các chi tiết như nguồn gốc của lưu lượng người dùng. Lưu ý rằng ở đây chúng tôi đã chọn cái mặc định -Use All Edge Locations.

AWS WAF Web ACL −Đây là lựa chọn tường lửa ứng dụng web. Ở đây, nó có tùy chọn nhưNone. Đầu tiên, chúng ta cần tạo tường lửa trong AWS. Nó cung cấp bảo mật cho trang web.

Alternate Domain Names − Ở đây bạn có thể chỉ định tên miền nếu bạn có.

SSL Certificate −Điều này có tất cả các chi tiết được chọn cho chứng chỉ SSL. Chúng tôi sẽ giữ những cái mặc định.

Default Root Object −Ở đây chúng tôi sẽ chỉ định tên tệp mà chúng tôi đã tải lên trong S3. Đối với điều này, chúng tôi cần nội dung từ .html được hiển thị theo mặc định.

Phần còn lại, chúng tôi sẽ giữ nguyên cài đặt mặc định.

Nhấp chuột Create Distribution để thêm bản phân phối.

Lưu ý rằng bản phân phối sẽ mất một khoảng thời gian để hiển thị trạng thái như đã triển khai.

Tạo hàm AWS Lambda

Đi tới bảng điều khiển AWS và tạo hàm Lambda.

Trong mã AWS Lambda, chúng tôi sẽ lấy tiêu đề yêu cầu và kiểm tra tác nhân người dùng. Nếu tác nhân người dùng từ máy tính để bàn, chúng tôi sẽ thay đổi phản hồi để hiển thị thông báo dưới dạng“DESKTOP : Welcome to AWS Lambda with Cloudfront!” và nếu thiết bị, thông báo sẽ là“MOBILE DEVICES : Hello from Lambda@Edge!”

Mã AWS Lambda tương ứng như hình dưới đây -

let content = `
<\!DOCTYPE html>
<html lang="en">
   <head>
      <meta charset="utf-8">
      <title>Simple Lambda@Edge Static Content Response</title>
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
   </head>
   
   <body>
      <h1>MOBILE DEVICES : Hello from Lambda@Edge!</h1>
   </body>
</html>
`;
let content1 = `
<\!DOCTYPE html>
<html lang="en">
   <head>
      <meta charset="utf-8">
      <title>Simple Lambda@Edge Static Content Response</title>
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
   </head>
   
   <body>
      <h1>DESKTOP : Welcome to AWS Lambda with Cloudfront!</h1>
   </body>
</html>
`;
exports.handler = (event, context, callback) => {
   let request = event.Records[0].cf.request;
   let finalrequest = JSON.stringify(request);
   let headers = request.headers;
   let useragent = JSON.stringify(headers["user-agent"][0].value);
   let str = "";
   if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini|Mobile|mobile|CriOS/i.test(useragent)) {
      str = content;
   } else {
      str = content1;
   }
   const response = {
      status: '200',
      statusDescription: 'OK',        
      body: str+useragent,
   };
   callback(null, response);
};

Bây giờ, hãy lưu hàm Lambda. Lưu ý rằng chúng ta cần xuất bản hàm Lambda để nó có thể được sử dụng với tất cả các vùng. Để xuất bản, chúng ta cần làm như sau:

Từ trình đơn thả xuống Tác vụ, hãy chọn Publish new version như hình dưới đây -

Nếu bạn, hãy nhấp vào Publish new version, nó hiển thị màn hình sau -

Bây giờ, nhập mô tả phiên bản và nhấp vào Publish. ARN sẽ hiển thị phiên bản của hàm AWS Lambda được tạo như hình dưới đây -

Thêm trình kích hoạt CloudFront vào phiên bản mới được tạo như hình dưới đây -

Bây giờ, hãy thêm chi tiết cấu hình cho CloudFront. Sự kiện CloudFront có tùy chọn choViewer request, Origin request, Origin responsevà Viewer response.

Tiếp theo, chọn bản phân phối CloudFront đã tạo trước đó. Từevents, chúng tôi sẽ chọn Viewer request. Dựa trên yêu cầu của người xem, máy tính để bàn / thiết bị từ tác nhân người dùng sẽ được quyết định và phản hồi sẽ được thay đổi. Tiếp theo, thêm chi tiết kích hoạt.

Khi trình kích hoạt được thêm vào, chúng ta cần đợi triển khai phân phối từ CloudFront.

Sau khi trạng thái được thay đổi thành Deployed, chúng tôi có thể kiểm tra url CloudFront và kiểm tra tên miền trong trình duyệt.

Màn hình hiển thị trong trình duyệt máy tính để bàn như hình dưới đây. Ở đây chúng tôi đã in tác nhân người dùng từ sự kiện người xem yêu cầu.

Đây là màn hình trong thiết bị di động.

Vì vậy, trong ví dụ trên, chúng tôi đã sử dụng Lambda @ Edge để thay đổi phản hồi trên máy tính để bàn và thiết bị di động.

ja/tutorial
es/tutorial
de/tutorial
fr/tutorial
th/tutorial
pt/tutorial
ru/tutorial
vi/tutorial
it/tutorial
ko/tutorial
tr/tutorial
id/tutorial
pl/tutorial
hi/tutorial
japost
espost
depost
frpost
thpost
ptpost
rupost
vipost
itpost
kopost
trpost
idpost
plpost
hipost

© Copyright 2021 - 2024 | All Rights Reserved