Rất có thể, bạn có thể không cần một máy chủ web đầy đủ như NGINX chạy trên EC2 để thiết lập và chạy trang web của mình. Nếu bạn chỉ muốn lưu trữ một trang web tĩnh, bạn có thể lưu trữ tất cả nội dung trong S3 và lưu trữ nó từ đó.
Chờ đã, tôi không cần máy chủ?
Nếu trang web của bạn không sử dụng bất kỳ xử lý phía máy chủ nào (như PHP), chỉ cần lưu trữ các tệp trên S3, định cấu hình bộ chứa để lưu trữ trang web và trỏ DNS của bạn đến bộ chứa sẽ thay thế việc sử dụng NGINX hoặc Apache.
“Xử lý phía máy chủ” ít rộng hơn nhiều so với âm thanh của nó. Chỉ vì trang web của bạn là “tĩnh” không có nghĩa là nó trông giống như một trang GeoCities những năm 1990, không có JavaScript. Tất cả những gì “tĩnh” có nghĩa là tất cả nội dung của bạn (trang HTML, mã JS, bảng định kiểu CSS) không thay đổi theo yêu cầu. Với các ngôn ngữ như PHP, tất cả quá trình xử lý được thực hiện ở phía máy chủ; nếu hai người dùng yêu cầu trang hồ sơ của họ, máy chủ sẽ gửi cho họ các trang khác nhau. Điều này không thể được thực hiện trên S3, vì vậy nếu bạn đang sử dụng PHP, bạn sẽ phải thiết lập một máy chủ web thực. Điều này đáng chú ý nhất là áp dụng cho WordPress, sử dụng PHP để cung cấp nội dung.
Tuy nhiên, việc các trang web trở thành các ứng dụng JavaScript lớn ngày càng trở nên phổ biến. Với một framework như React, tất cả những gì cần được phân phối là một bundle.js
tập tin. Công việc của máy khách, không phải máy chủ, là chạy tệp này và khởi chạy ứng dụng. Các ứng dụng như thế này có thể được lưu trữ trên S3 mà không có vấn đề gì. Điều này cũng không loại bỏ phần phụ trợ của bạn — bạn vẫn có thể để ứng dụng của mình giao tiếp với máy chủ API và nói chuyện với cơ sở dữ liệu, bạn sẽ chỉ phải xác thực các yêu cầu đến từ ứng dụng khách. Kết hợp với API Gateway và Lambda của AWS, bạn có thể không phải chạy một máy chủ EC2 duy nhất.
Đừng để bị lừa bởi thiết lập đơn giản — đối với các trang web nhỏ, S3 có thể cắt giảm chi phí của bạn xuống đến từng xu trên đô la và bởi vì không có máy chủ để lo lắng, nó hoàn toàn mở rộng quy mô lên đến hàng triệu người dùng. Bạn chỉ cần trả một khoản phí cố định cho băng thông vào và ra, cũng như mọi chi phí liên quan cho Lambda, RDS hoặc bất kỳ dịch vụ nào khác mà bạn sử dụng với ứng dụng của mình. Ngay cả đối với các doanh nghiệp lớn hơn đang triển khai các ứng dụng sản xuất, lưu trữ từ S3 là một lựa chọn rất khả thi và tiết kiệm chi phí nếu ứng dụng của bạn có thể hỗ trợ.
S3 không hỗ trợ HTTPS cho các trang web tĩnh, đây sẽ là một công cụ phá vỡ giao dịch, nhưng bạn có thể đặt nó sau CloudFront (CDN của AWS), ngoài việc cải thiện bộ nhớ đệm và hiệu suất, có thể sử dụng miền tùy chỉnh với HTTPS. Nó thậm chí còn có cấp miễn phí hào phóng hơn để truyền dữ liệu — 50 GB thay vì 1 GB của S3.
Thiết lập điều này
Đối với hướng dẫn này, thay vì triển khai trang HTML đơn giản, chúng tôi sẽ triển khai dự án bắt đầu từ create-react-app
, vì nó thể hiện tốt hơn tiềm năng thực sự của S3.
Sau khi chạy yarn build
, chúng tôi còn lại các nội dung sau trong /build
thư mục:
Toàn bộ thư mục này sẽ được sao chép sang S3. Đi tới Bảng điều khiển quản lý S3 và nhấp vào “Tạo nhóm”.
Đặt tên cho nó (nó phải là duy nhất trong số tất cả các tài khoản AWS) và nhấp vào “Tiếp theo”. Bạn có thể bật lập phiên bản trong các tùy chọn ở đây, nhưng không có nhiều thứ khác để xem xét. Nhấp vào “Tiếp theo” một lần nữa.
LIÊN QUAN: Cách cài đặt và định cấu hình AWS CLI
Trên màn hình tiếp theo, bạn sẽ muốn bỏ chọn “Chặn mọi quyền truy cập công khai”. Tính năng này được bật theo mặc định để ngăn các đối tượng trong nhóm hiển thị với Internet đang mở, điều này sẽ khiến nhóm của bạn không thể truy cập được. AWS sẽ bật lên với một cảnh báo cho biết hãy bật lại trừ khi bạn đang sử dụng “các trường hợp sử dụng cụ thể và đã được xác minh”, chẳng hạn như lưu trữ trang web tĩnh. Bởi vì đó chính xác là những gì chúng tôi đang làm, bạn có thể bỏ qua điều này.
Nhấp vào “Tạo” trên thùng và mở nó lên.
Bạn có thể kéo nội dung thư mục HTML của mình vào nhóm theo cách thủ công, nhưng một phương pháp tốt hơn là sử dụng AWS CLI để đồng bộ hóa toàn bộ thư mục với nhóm của bạn. Lệnh khá đơn giản:
aws s3 sync . s3://bucket-name
Bây giờ, bạn sẽ thấy nội dung thư mục của mình trong nhóm:
Sau khi mọi thứ được đồng bộ hóa, bạn có thể định cấu hình bộ chứa để cho phép lưu trữ trang web. Từ tab thuộc tính, hãy bật tùy chọn “Lưu trữ trang web tĩnh” và chọn tệp chỉ mục của bạn. Bạn cũng có thể chọn một tệp lỗi để hiển thị cho người dùng 404 được cá nhân hóa hơn.
Điều này bật tính năng lưu trữ trang web tĩnh, nhưng không cấp quyền truy cập đọc một cách rõ ràng. Để làm điều đó, bạn sẽ cần thêm chính sách nhóm sau trong Quyền> Chính sách nhóm:
{ "Version":"2012-10-17", "Statement":[{ "Sid":"PublicReadGetObject", "Effect":"Allow", "Principal": "*", "Action":["s3:GetObject"], "Resource":["arn:aws:s3:::example-bucket/*" ] } ] }
Thao tác này sẽ bật lên một cảnh báo khác cho bạn biết rằng quyền truy cập công khai đang bật. Bạn có thể bỏ qua điều này một lần nữa.
Giờ đây, nhóm của bạn sẽ có thể xem được từ điểm cuối sau:
http://BUCKET-NAME.s3-website.REGION.amazonaws.com/
Tuyệt quá! Mọi thứ hoạt động chính xác. Khách hàng yêu cầu nhóm, phục vụ index.html
tệp này tải xuống tất cả các nội dung JS và CSS bắt buộc, đồng thời hiển thị biểu trưng React đang quay.
Tuy nhiên, điểm cuối này rõ ràng là không thân thiện với người dùng, vì vậy có thể bạn sẽ muốn định cấu hình miền tùy chỉnh cho trang S3 của mình. Phương pháp đơn giản nhất là sử dụng CloudFront để phục vụ các yêu cầu, đây là cách duy nhất để hỗ trợ HTTPS. Nếu không muốn sử dụng CloudFront, bạn có thể thiết lập miền tùy chỉnh bằng cách sử dụng Route 53 để làm bí danh cho điểm cuối mặc định của nhóm.
Đi tới Bảng điều khiển CloudFront. Chọn “Tạo phân phối” và chọn loại “Web”. Trên màn hình tiếp theo, trong “Tên miền gốc”, hãy chọn nhóm S3 của bạn từ menu thả xuống. Đảm bảo bạn cũng chọn “Chuyển hướng HTTP sang HTTPS”.
Sâu hơn nữa, bạn sẽ muốn định cấu hình miền của mình. Nhập tên miền thay thế của bạn và chọn “SSL tùy chỉnh”. Yêu cầu một từ ACM; có thể mất đến nửa giờ để xác minh tùy thuộc vào nhà cung cấp DNS của bạn, mặc dù nếu bạn đang sử dụng Route 53, bạn có thể tạo và xác minh bản ghi tự động trong vòng vài phút.
Sau đó, nhấp vào “Tạo phân phối” ở dưới cùng và đợi khoảng 15 phút để CloudFront giải quyết mọi thứ. Sau khi hoàn tất, bạn sẽ có thể truy cập tên miền tùy chỉnh của mình và xem ứng dụng của bạn được phân phối trực tiếp từ S3.
Nếu muốn quản lý phiên bản dễ dàng hơn, bạn có thể thiết lập quy trình triển khai tự động với AWS CodePipeline. Chỉ cần chọn triển khai tới S3 và AWS sẽ tự động triển khai các bản cập nhật mã nguồn, bao gồm cả tạo tác bản dựng.