Tối ưu hóa phân phối nội dung cho thiết bị di động với Amazon CloudFront

Tram Ho

Amazon CloudFront cho phép bạn cung cấp dữ liệu, video, ứng dụng và API cho khách hàng toàn cầu một cách an toàn với độ trễ thấp và tốc độ truyền cao. Trong thế giới ưu tiên kỹ thuật số ngày nay với cơ sở khách hàng trên toàn thế giới, điều quan trọng là phải cung cấp tài sản kỹ thuật số cho người dùng cuối với thời gian tải thấp nhất có thể. Thiết bị di động hiện chiếm khoảng 70% lưu lượng truy cập internet [1]. Do đó, việc tối ưu hóa phân phối nội dung cho danh mục thiết bị này là rất quan trọng đối với trải nghiệm tổng thể của khách hàng.

Khi khách hàng truy cập internet thông qua thiết bị di động, tại bất kỳ thời điểm nào thiết bị đó có thể có các cấp độ kết nối khác nhau. Nó có thể được kết nối qua Wi-Fi và kết nối băng thông rộng gia đình, do đó cho phép tải xuống tốc độ cao và không bị giới hạn. Vào một thời điểm khác, nó có thể được kết nối thông qua kết nối di động, có thể với gói dữ liệu hạn chế hoặc đắt tiền. Bản thân kết nối di động thay đổi theo các thế hệ công nghệ viễn thông di động khác nhau — từ 2G đến 5G.

Các loại kết nối khác nhau có các đặc điểm khác nhau, đặc biệt là băng thông. Do đó, chúng có thể ảnh hưởng đáng kể đến thời gian tải nội dung. Điều này khiến bạn mong muốn tối ưu hóa nội dung được phân phối trên cơ sở loại kết nối. Các kỹ thuật tối ưu hóa nội dung truyền thống thay đổi nội dung dựa trên đặc điểm thiết bị được suy luận, ví dụ: sử dụng chuỗi Tác nhân người dùng hoặc độ phân giải màn hình thiết bị và các dấu vân tay khác. Tuy nhiên, các kỹ thuật này không hữu ích trong bối cảnh này, bởi vì các thuộc tính này không đổi bất kể kết nối mạng thực tế của thiết bị tại bất kỳ thời điểm nào.

Trong bài đăng này, chúng tôi chỉ ra cách bạn có thể tận dụng các Chức năng CloudFront và CloudFront để cung cấp nội dung được tối ưu hóa cho loại kết nối tức thời của thiết bị.

Điều kiện tiên quyết

Bài đăng này giả định một số kiến ​​thức chung về lập trình và bạn đã quen thuộc với Các chức năng Amazon Simple Storage Service (Amazon S3), CloudFront và CloudFront. Để giúp bạn bắt đầu, hãy đọc tài liệu Amazon CloudFront. Hợp tác giữa các ứng dụng khách và cơ sở hạ tầng là cần thiết để đạt được kết quả mong muốn. Do đó, trong bài đăng này, chúng tôi cũng cung cấp mã cho một ứng dụng khách đơn giản. Để kiểm tra ví dụ này, bạn phải có tài khoản AWS.

Giới thiệu

Cơ sở hạ tầng CloudFront phục vụ các yêu cầu HTTP và HTTPS không có cách nào biết trước về kết nối mạng cục bộ của bất kỳ máy khách cụ thể nào yêu cầu một đối tượng cụ thể. Để phân phát các nội dung khác nhau trên cơ sở này, chúng tôi yêu cầu một phương pháp để khách hàng báo hiệu thông tin này tới cơ sở hạ tầng. Có nhiều cách mà chúng tôi có thể thực hiện việc này, chẳng hạn như sử dụng các tên miền khác nhau hoặc thêm các hậu tố cụ thể vào tên của các đối tượng được yêu cầu khi chúng tôi muốn nhận được nội dung được tối ưu hóa.

Tuy nhiên, tốt hơn là tách quyền kiểm soát nội dung nào được trả về theo điều kiện mạng nào khỏi logic ứng dụng. Sau đó, nếu chúng tôi muốn thực hiện các thay đổi, có lẽ trên cơ sở phản hồi của người dùng, thì việc cập nhật cấu hình của bản phân phối CloudFront là một vấn đề đơn giản, thay vì đưa ra các bản cập nhật ứng dụng cho tất cả người dùng của chúng tôi. Vì lý do này, trong trường hợp mong muốn nội dung được tối ưu hóa, chúng tôi khuyên bạn nên thêm tiêu đề yêu cầu đơn giản vào các yêu cầu HTTP do ứng dụng khách thực hiện. Sự lựa chọn thực tế của tiêu đề là tùy ý, miễn là máy khách và cơ sở hạ tầng đồng ý về một tiêu chuẩn chung. Tuy nhiên, tiêu đề Lưu dữ liệu là một lựa chọn hợp lý. Nếu bạn quyết định một tiêu đề yêu cầu khác, hãy lưu ý tài liệu chi tiết liên quan đến tiêu đề yêu cầu HTTP và hành vi CloudFront (nguồn gốc tùy chỉnh và Amazon S3).

Ngành kiến ​​​​trúc

Như được hiển thị trong cấu trúc sau, ứng dụng dành cho thiết bị di động sẽ quyết định có gửi tiêu đề Save-Data: on khi hệ điều hành điện thoại di động gợi ý hay không (giải thích chi tiết trong phần sau). Khi nhận được yêu cầu, CloudFront đối sánh URL yêu cầu với các mẫu đường dẫn tương ứng. Trong ví dụ, CloudFront sẽ khớp với bất kỳ yêu cầu nào và kích hoạt Chức năng CloudFront trên lớp sự kiện Yêu cầu người xem. Sau đó, Chức năng CloudFront sẽ sửa đổi và chuyển tiếp yêu cầu để có được biến thể chính xác của nội dung dựa trên sự hiện diện hoặc vắng mặt của tiêu đề.

Thủ tục phía khách hàng

Bạn có thể tìm thấy một ứng dụng iOS đơn giản để chứng minh các quy trình phía máy khách, được viết bằng Objective C, trên github aws-samples, tại đây. Hơn nữa, chúng tôi thảo luận về các quy trình phía máy khách cho các ứng dụng Android và ứng dụng web gốc trong phần sau.

Ứng dụng mẫu sử dụng khung Mạng của Apple và cụ thể là trình quan sát nw_path_monitor_t, để theo dõi đường dẫn mạng có sẵn cho thiết bị. Khi điện thoại hoặc máy tính bảng di chuyển từ vùng phủ sóng Wi-Fi sang vùng phủ sóng dữ liệu di động hoặc quay lại một lần nữa, ứng dụng sẽ nhận cuộc gọi lại tới một trình xử lý, cho biết rằng đường dẫn mạng đã được cập nhật. Trong mã trình xử lý của chúng tôi, chúng tôi thẩm vấn các khả năng của đường dẫn bằng cách gọi nw_path_is_expensive () và nw_path_is_constrained (). Phần trước cho chúng ta biết liệu đường dẫn có sử dụng giao diện được coi là đắt tiền hay không, chẳng hạn như mạng di động hoặc điểm phát sóng cá nhân. Phần sau sẽ kiểm tra xem đường dẫn có sử dụng giao diện mạng đang ở chế độ Dữ liệu thấp hay không (xem bên dưới). Lưu ý rằng iOS không cung cấp thông tin chi tiết hơn về loại mạng di động chính xác mà thiết bị được gắn vào.

Chính xác cách chúng tôi sử dụng dữ liệu này liên quan đến các khả năng của đường dẫn là một lựa chọn cấp ứng dụng. Ví dụ: nếu ứng dụng của chúng tôi phát trực tuyến video, thì chúng tôi có thể quyết định sử dụng cờ đắt để chọn video có độ phân giải tiêu chuẩn thay vì 4K hoặc 8K. Điều này là do chúng tôi có thể nhanh chóng cạn kiệt gói dữ liệu di động của khách hàng nếu chúng tôi truyền phát video độ phân giải cao qua mạng di động. Trong trường hợp này, cũng có thể hợp lý khi kết hợp thông tin này với thông tin khả năng khác của thiết bị, chẳng hạn như kích thước và độ phân giải màn hình. Hơn nữa, CloudFront có thể suy ra danh mục thiết bị mà khách hàng đang chạy và thêm các tiêu đề như CloudFront-Is-Mobile-Viewer: đúng với yêu cầu của bạn, như được mô tả ở đây.

Mặt khác, chúng tôi có thể muốn duy trì một yếu tố do người dùng lựa chọn trong loại nội dung được phân phối — xét cho cùng, người dùng của chúng tôi có thể hoàn toàn sẵn lòng sử dụng gói dữ liệu di động cho phép của họ để tải xuống chương trình yêu thích của họ với chất lượng tốt nhất có thể. Chúng tôi có thể sử dụng cài đặt dành riêng cho ứng dụng hoặc thậm chí dành riêng cho hồ sơ người dùng trong ứng dụng hoặc cách khác — và như được hiển thị trong mã mẫu — chúng tôi có thể sử dụng cờ bị ràng buộc. Điều này sẽ đúng nếu người dùng đã bật chế độ Dữ liệu thấp cho gói dữ liệu có liên quan trong ứng dụng Cài đặt iOS (Cài đặt> Dữ liệu di động> Tùy chọn dữ liệu di động> chuyển đổi Chế độ dữ liệu thấp). Cài đặt này cung cấp gợi ý dễ hiểu, trên toàn thiết bị mà người dùng muốn giới hạn việc sử dụng gói dữ liệu di động của họ, điều này làm cho nó trở thành một lựa chọn hợp lý ở đây.

Khi chúng tôi nhận thấy rằng nội dung có kích thước giảm là mong muốn, như được mô tả ở trên, chúng tôi thêm tiêu đề yêu cầu Save-Data: vào mỗi yêu cầu HTTP mà chúng tôi gửi. Nếu muốn nội dung có kích thước thông thường, chúng tôi sẽ bỏ qua tiêu đề này hoàn toàn. Ứng dụng mẫu sử dụng Hệ thống tải URL của Apple, được bao hàm bởi các đối tượng NSURLSession và NSURLSessionTask, để tải các nội dung được lưu trữ trên web. Tất cả những gì chúng ta cần làm là định cấu hình đối tượng NSURLSession với trường tiêu đề yêu cầu bổ sung theo yêu cầu, như được hiển thị trong đoạn mã này:

Nếu pathConstrained là true, thì khi bây giờ chúng ta sử dụng đối tượng session để tạo các tác vụ tải xuống, các yêu cầu HTTP cơ bản được gửi đến HTTP origin sẽ chứa trường tiêu đề yêu cầu Save-Data: on.

Các nền tảng khách hàng khác

Đối với các ứng dụng gốc của Android, lớp ConnectivityManager cung cấp chức năng tương tự cho phép các ứng dụng thẩm vấn kết nối cục bộ của thiết bị. Tương đương với chế độ Dữ liệu thấp của iOS trên Android là chế độ Trình tiết kiệm dữ liệu. Các ứng dụng có thể sử dụng API ConnectivityManager để kiểm tra xem Trình tiết kiệm dữ liệu có được bật hay không và theo dõi các thay đổi về trạng thái của nó, như được mô tả trong hướng dẫn dành cho nhà phát triển Android tại đây.

Đối với các ứng dụng dựa trên web — nói cách khác, các ứng dụng được thiết kế để chạy trên thiết bị khách trong trình duyệt web — API Web Thông tin Mạng cung cấp chức năng tương tự. Cụ thể, hãy xem tiêu đề ECT, hoặc loại kết nối hiệu quả. Tuy nhiên, lưu ý rằng tại thời điểm viết API này là công nghệ thử nghiệm không được tất cả các trình duyệt hỗ trợ trên toàn cầu.

Cấu hình cơ sở hạ tầng

Đầu tiên, chúng ta phải tạo một thùng S3 để lưu trữ các hình ảnh.

  1. Mở bảng điều khiển Amazon S3 .
  2. Chọn Tạo nhóm .
  3. Cung cấp một tên, chẳng hạn như “example-testxyz” (hãy nhớ rằng tên này phải là duy nhất).
  4. Chọn Tạo .
  5. Sau khi tạo, hãy mở nhóm “example-testxyz”.
  6. Chọn Tạo thư mục và chọn “lưu” làm tên thư mục, sau đó chọn Tạo thư mục . Bây giờ bạn đã có nhóm S3 và thư mục, hãy tải lên hai hình ảnh — một hình ảnh trong thư mục gốc của nhóm và hình ảnh thứ hai trong thư mục “save”. Các hình ảnh phải có cùng tên “example.jpg”. Nhưng hãy đảm bảo chúng khác nhau để bạn có thể dễ dàng hiểu được cái nào đang được phân phối (phiên bản được tối ưu hóa hay phiên bản thông thường).
  7. Chọn Tải lên, kéo và thả hình ảnh example.jpg đầu tiên và chọn Tải lên. Chọn Đóng .
  8. Mở thư mục “lưu”, kéo và thả hình ảnh example.jpg thứ hai và chọn Tải lên. Chọn Đóng .

Bây giờ chúng ta có một thùng S3 với hai hình ảnh khác nhau có cùng tên, example.jpg, với một bức nằm trong thư mục gốc của thùng S3, trong khi bức ảnh kia nằm trong / save. Tiếp theo, thiết lập CloudFront:

  1. Mở bảng điều khiển CloudFront.
  2. Trong Phân phối, hãy chọn Tạo phân phối
  3. Đối với Tên miền gốc, hãy chọn nhóm S3 mà bạn đã tạo trước đó.
  4. Trong Quyền truy cập nguồn gốc, hãy chọn Cài đặt kiểm soát truy cập nguồn gốc (được khuyến nghị).
  5. Chọn Tạo cài đặt điều khiển.
  6. Trong hộp thoại phương thức xuất hiện, bạn có thể chấp nhận cài đặt mặc định và chọn Tạo. Thao tác này sẽ tạo cài đặt điều khiển có cùng tên với nhóm S3 gốc. Lưu ý nhận xét “Bạn phải cập nhật chính sách nhóm S3”. Chúng tôi sẽ thực hiện việc này trong bước sau.
  7. Chọn Tạo phân phối ở cuối trang
  8. Trên trang tiếp theo, bạn sẽ thấy một biểu ngữ cho biết “Chính sách nhóm S3 cần được cập nhật”. Thay đổi này đối với chính sách cho phép dịch vụ CloudFront truy cập các đối tượng trong nhóm một cách an toàn. Chọn Sao chép chính sách để sao chép tuyên bố chính sách vào khay nhớ tạm.
  9. Điều hướng trở lại bảng điều khiển S3 và chọn nhóm bạn đã tạo ở trên.
  10. Trên tab Quyền, trong Chính sách nhóm, hãy chọn Chỉnh sửa.
  11. Dán từ khay nhớ tạm vào vùng văn bản Chỉnh sửa chính sách, vùng này sẽ trống cho nhóm mới tạo này. Bạn sẽ thấy một tài liệu chính sách JSON cho phép dịch vụ CloudFront đọc các đối tượng từ nhóm cho một bản phân phối cụ thể.
  12. Chọn Lưu thay đổi. Bây giờ bạn có thể điều hướng trở lại bảng điều khiển CloudFront. Khi bản phân phối CloudFront mới được định cấu hình đã hoàn tất việc triển khai — có thể mất vài phút — trường Trạng thái cho bản phân phối sẽ có nội dung Đã bật. Lưu ý tên miền Phân phối, sẽ giống như dXXXXXXXXXXXX.cloudfront.net .

Bây giờ, hãy tải lên Chức năng CloudFront của chúng tôi. Mã sau đặt tiền tố / lưu vào URL nếu tiêu đề Save-Data hiện diện và có giá trị trên.

  1. Mở bảng điều khiển CloudFront.
  2. Chọn Chức năng và chọn Tạo chức năng.
  3. Thêm tên “chức năng blog” và chọn Tạo chức năng.
  4. Sao chép và dán đoạn mã trên.
  5. Chọn Lưu thay đổi.
  6. Sau khi lưu, chọn tab Xuất bản và chọn chức năng Xuất bản
  7. Chọn Thêm liên kết.
  8. Một cửa sổ bật lên mới sẽ xuất hiện. Chọn bản phân phối CloudFront mới được tạo của bạn, chọn Yêu cầu người xem trong Loại sự kiện và chọn Mặc định (*) cho hành vi Bộ nhớ cache.
  9. Chọn Thêm liên kết.

Hiện bản phân phối CloudFront đã được thiết lập và chạy. Bất cứ khi nào nó nhận được yêu cầu có tiêu đề Save-Data: on, nó sẽ chuyển hướng yêu cầu đến / save. Trong phần tiếp theo, chúng ta sẽ xem hai cách để kiểm tra nó.

Để đơn giản hóa ví dụ này, chúng tôi đã định cấu hình chức năng này để chạy cho bất kỳ đối tượng nào được yêu cầu từ bản phân phối CloudFront. Trên thực tế, bạn có thể sử dụng tab Hành vi của bản phân phối CloudFront để giới hạn ứng dụng của nó chỉ trong các mẫu đường dẫn URI nhất định — chẳng hạn như / media / mpeg / .mp4 hoặc / images / .jpg — nơi phương tiện được tối ưu hóa được biết là tồn tại trong tiền tố thùng tương ứng / save / media / mpeg / và / save / images /. Điều này hữu ích cho các trường hợp trong đó một số phương tiện đã được tối ưu hóa, nhưng phương tiện được tìm thấy trong các đường dẫn URI khác, có thể chẳng hạn như nội dung kế thừa hoặc phần tử giao diện người dùng, không có biến thể được tối ưu hóa.

Thử nghiệm giải pháp

Nếu bạn muốn tạo ứng dụng iOS cục bộ và thử nghiệm nó bằng thiết bị iOS hoặc trình mô phỏng, hãy sử dụng Xcode IDE của Apple. Bắt đầu bằng cách sao chép kho lưu trữ https://github.com/aws-samples/ios-objective-c-simple-image-loader (Source Control> Clone…). Chọn một vị trí để lưu bản sao cục bộ. Bây giờ bạn có thể chọn một thiết bị hoặc trình mô phỏng từ thanh trên cùng của IDE, sau đó chọn Sản phẩm> Chạy để xây dựng, cài đặt và chạy ứng dụng.

Khi khởi động, ứng dụng trông giống như hình 3 (a). Dán tên miền phân phối CloudFront và /example.jpg của bạn vào trường văn bản và chọn Tìm nạp. Tùy thuộc vào kết nối của bạn, như được mô tả ở trên, ứng dụng sẽ hoặc không bao gồm tiêu đề Save-Data: on và bản phân phối CloudFront sẽ trả về hình ảnh thích hợp — xem hình 3 (b) và (c). Ứng dụng cũng hiển thị kích thước của đối tượng đã tải xuống.

Để buộc thiết bị của bạn sử dụng đường dẫn mạng hạn chế, hãy chuyển đến ứng dụng Cài đặt iOS. Đầu tiên, tắt Wi-Fi (Cài đặt> Wi-Fi> Tắt Wi-Fi) và thứ hai, bật Chế độ dữ liệu thấp cho kết nối di động của bạn (Cài đặt> Dữ liệu di động> Tùy chọn dữ liệu di động> Bật chế độ dữ liệu thấp).

Nếu bạn muốn kiểm tra hành vi của cơ sở hạ tầng độc lập với bất kỳ ứng dụng nào, thì bạn có thể sử dụng curl như sau:

Để thêm tiêu đề Save-Data: on:

Khi bạn đã thử nghiệm giải pháp, để tránh phát sinh chi phí liên tục, trước tiên hãy vô hiệu hóa và sau đó xóa bản phân phối trong bảng điều khiển CloudFront.

Sự kết luận

Trong bài đăng này, chúng tôi đã chỉ ra cách các ứng dụng khách trên thiết bị di động có thể báo hiệu kết nối mạng cục bộ hiện tại của chúng với cơ sở hạ tầng phụ trợ. Bằng cách tập trung các quyết định về cách kết nối mạng sẽ ảnh hưởng đến nội dung được cung cấp cho các ứng dụng và tách các quyết định đó khỏi logic ứng dụng, chúng tôi đơn giản hóa quá trình tối ưu hóa nội dung cho các điều kiện khác nhau. Người dùng cuối được hưởng lợi từ trải nghiệm người dùng đáp ứng tốt hơn mà vẫn phù hợp với sở thích của họ, trong khi các nhà khai thác mạng di động được hưởng lợi từ việc giảm tải trên các mạng cũ.

Chia sẻ bài viết ngay

Nguồn bài viết : Viblo