2016年4月3日 星期日

AWS 隨意筆記 (5) S3 架設靜態網站:基本設定、網址設定

0

上一篇申請了 AWS Certificate SSL 憑證讓 CloudFront 的自訂網址成為 HTTPS,接下來嘗試靜態網站的基本設定。

將 S3 的 Bucket 設定為靜態網站:

進入S3主控畫面,建立一個 Bucket, Bucket 名稱是網站的網址,例如,www.carol-caracol.com ,www 為子網域。

然後察看此 bucket 的屬性,找到「靜態網站託管」 > 按下「啟用網站託管」。

也要輸入「索引文件」的檔名(網站首要頁面)、錯誤文件等等。

圖一:

上圖的終端節點就是此網站的預設網址,這串網址的組成為: "bucket name" + " s3-website-ap-northeast-1.amazonaws.com" ( northeast-1 可能是其他字,隨著此 bucket 所存放的區域而變。)

再來也是到 bucket 的屬性中,找到「權限」 > 按下「編輯儲存桶策略」,出現編輯畫面。

圖二:

圖三:

為了要讓網站正常顯示,也就是任何人都可以讀取到此bucket中的內容,,要將bucket的權限策略( Bucket Policy ) 加上「允許任何人讀取 ( GetObject )」。

可以參考 官方文件:存儲桶策略示例-向匿名用戶授予只讀權限、或 官方文件:為網站託管配置儲存桶-網站訪問所需的權限 中的格式,也可以用 AWS Policy Generator (策略生成器) 幫忙編寫。

大致格式如下 (要將 examplebicket 改為正確的 bucket 名稱):

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

保存策略之後,再上傳 index.html 到 bucket 裡面,用預設網址例如 http://www.carol-caracol.com.s3-website-ap-northeast-1.amazonaws.com/ 已經可以正常顯示網站了。

Bucket 中的資料也可以被察看,例如一張在此 bucket 中的圖片,用這兩個網址都可以顯示:

(此圖檔的預設終端網址)
https://s3-ap-northeast-1.amazonaws.com/www.carol-caracol.com/test.jpg

(透過此網站的預設終端網址訪問其下的圖檔)
http://www.carol-caracol.com.s3-website-ap-northeast-1.amazonaws.com/test.jpg

如果要用自訂域名,設定方式也很簡單,到網址的管理後台新增一筆CNAME紀錄即可,例如:

CNAME: www
值:www.carol-caracol.com.s3-website-ap-northeast-1.amazonaws.com (即此網站bucket的預設終端網址)

就可以用 http://www.carol-caracol.com/ 自訂域名拜訪網站、以及bucket中其他內容例如 http://www.carol-caracol.com/test.jpg 。

P.S.
如果要使用根域名例如 example.com 作為自訂網址,「一定」要用 AWS Route53 作為此網域的 DNS 服務,Route 53 是屬於收費服務,不包含在新手免費方案中。詳細作法可參考 官方文件:示例:使用自定義域設置靜態網站 。

0 意見:

張貼留言

歡迎分享本文~