將靜態網站部署到 Amazon S3 - AWS Prescriptive Guidance

本文為英文版的機器翻譯版本,如內容有任何歧義或不一致之處,概以英文版為準。

將靜態網站部署到 Amazon S3

由桑卡爾桑古波特拉 (AWS) 創作

R 型態:N/A

來源:應用程式開發

目標:S3

建立者:AWS

Environment PoC 或試驗

技術:網站與網路應用程式;DevOps

AWS 服務:Amazon S3; AWS CodePipeline

Summary

此模式說明將持續整合與持續交付 (CI/CD) 管道新增至 Amazon Web Services (AWS) 儲存貯體服務 (Amazon S3) 的現有儲存貯體所需的步驟。此模式使用 GitHub 作為源提供者。當認可新項目時,會啟動管線,然後變更會反映在 S3 儲存貯體中。

先決條件和限制

先決條件

  • 作用中的 AWS 帳戶

  • Amazon S3 和 AWS CodePipeline 的知識

  • 靜態網站,包括輸出/來源檔案,例如 HTML 4/5、CSS 2/4、影像、字型和圖示

  • GitHub 儲存庫

限制

  • 建議使用此程序來顯示唯讀內容。不建議收集或傳輸敏感資訊,因為 Amazon S3 使用 HTTP 通訊協定。

  • 不支援使用 PHP、JSP 或 APS.NET 建置的網站,因為 Amazon S3 不支援伺服器端指令碼。

Architecture

來源架構

 

目標技術堆疊

  • AWS CodePipeline

  • AWS CodeStar

  • Amazon S3

  • 任何 web 伺服器

目標架構

Tools

工具

  • AWS CodePipeline— 持續交付的服務,讓您能夠將發行軟體所需的步驟模型化、視覺化和自動化。您可以使用快速模型化和設定軟體發行程序的不同階段。CodePipeline 會持續將發佈軟體變更所需的步驟自動化。

  • AWS CodeStar— AWS CodeStar 是一種雲端服務,用於建立、管理和處理 AWS 上的軟體開發專案。

  • Amazon S3— 可高度擴充的物件儲存服務。它可用於各種儲存解決方案,包括網站、行動應用程式、備份和資料湖。

Epics

任務描述所需的技能
建立 S3 儲存貯體。

開啟 Amazon S3 主控台並選擇建立儲存貯體來建立 S3 儲存貯體,用於託管網站和上傳內容。

AWS 一般,開發人員
輸入儲存貯體名稱。

為儲存貯體輸入唯一且符合 DNS 規範的名稱。S3 儲存貯體的名稱必須必須是全域唯一,因為命名空間會由所有 AWS 帳戶共享。

AWS 一般,開發人員
選取 Region (區域)。

選擇預設的 AWS 區域或選取儲存貯體所在的特定區域。

AWS 一般,開發人員
設定許可。

允許公開存取您的儲存貯體,方法是選擇Permissions (許可),然後選擇Edit (編輯)。選擇關閉for封鎖所有公有存取。根據預設,會為安全考量選取此核取方塊。選擇Save (儲存),並在選擇建立儲存貯體。這將關閉彈出窗口並創建存儲桶。

AWS 一般,開發人員
上傳資料夾和檔案。

遵循 Amazon S3 文件中的說明,上傳您的資料夾和檔案。如需連結,請參閱相關資源區段。

AWS 一般,開發人員
任務描述所需的技能
啟用靜態網站託管。

在 中屬性索引標籤上選擇靜態網站託管,然後使用此儲存貯體託管網站

AWS 一般,開發人員
定義首頁和錯誤頁面。

指定首頁和錯誤頁面的檔案名稱和副檔名 (例如,index.html 和 error.html)。請確定根資料夾包含這些檔案,而且它們做為登陸頁面。

AWS 一般,開發人員
任務描述所需的技能
附加儲存貯體策略。

建立儲存貯體政策,以便其他 AWS 應用程式可以在儲存貯體上存取和執行動作。在 中Permissions (許可)索引標籤上選擇儲存貯體政策。在 中貯體政策編輯器,貼上提供的儲存貯體策略其他資訊區段。

AWS 一般,開發人員
存取並測試網站。

輸入端點 URL 以存取網站;例如:http://www.spsbuddy.xyz.s3-website-us-east-1.amazonaws.com。端點採用兩種格式,視您的區域而定。如需詳細資訊,請參閲 。相關資源區段。

AWS 一般,開發人員
任務描述所需的技能
選取 CodePipeline 名稱。

登入 AWS 管理主控台,並開啟 AWS 程式碼管道主控台。選擇建立管道並輸入專案的名稱。

AWS 一般,開發人員
建立服務角色。

建立服務角色或從服務角色清單中選取 (若有提供)。

AWS 一般,開發人員
選取人工因素存放區。

如果您希望 Amazon S3 建立儲存貯體並將工件存放在其中,請選擇自訂位置並指定現有儲存貯體。如果沒有,請使用預設位置。

AWS 一般,開發人員
選擇來源供應商。

選擇GitHub (第 2 版)從來源提供者清單中。

AWS 一般,開發人員
Connect 至 GitHub。

授權 GitHub 通過按照指示授予您的 GitHub 存儲庫的 CodePipeline 訪問權限步驟 2:創建一個與 GitHub 的連接中的GitHub 連線能力從 AWS 代碼管道文檔。

AWS 一般,開發人員
建立儲存庫和分支。

選擇要在確認步驟中建立的儲存庫和分支。

AWS 一般,開發人員
變更偵測選項。

這會在原始程式碼發生變更時自動啟動管道。如果關閉,您的管線只會在您手動啟動或按照排程啟動時執行。

AWS 一般,開發人員
部署提供者。

選擇Amazon S3作為可用目標清單中的目標。

AWS 一般,開發人員

References

其他資訊

若要授予您網站的公有讀取存取權,請複製以下儲存貯體政策,並將它貼上至儲存貯體政策編輯器): 

{ "Version": "2012-10-17", "Statement": [ { "Sid": "PublicReadGetObject", "Effect": "Allow", "Principal": "*", "Action": [ "s3:GetObject" ], "Resource": [ "arn:aws:s3:::example.com/*" ] } ] }