[AWS]S3のみを使ってWEBサイトを作る

一枚ペラのWebサイトならS3で十分だと思います。わざわざサーバなんて立てる必要ないです!

てなわけで、今回はS3のみを使ってWEBサイトをホスティングしたいと思います。

流れ

  1. S3バケットを作成
  2. ファイルをアップロードする
  3. S3にWEBホスティングの設定
  4. 検証

手順

S3バケットを作成

1.S3のManegement Consoleから[バケットを作成する]を選択します。

2.バケット名を入力し、[次へ]をクリックします。

3.特に変更せず、[次へ]をクリックします。

4.ここも特に変更せず、[次へ]をクリックします。

5.確認画面が出ますので、[バケットの作成]をクリックします。

6.S3バケットが作成されたことが確認できるかと思います。
これでS3バケットの作成完了となります。

ファイルをアップロードする

1.先程、作成したバケットを選択し、[アップロード]をクリックします。

2.[ファイルを追加]をクリックして、ドラッグ&ドロップして今回の検証に使うファイルをアップロードします。

ファイル名: index.html

<html>
<head>
<h1>s3 test-page</h1>
<head>
</html>

ファイル名: error.html

<html>
<head>
<h1>s3 error-page</h1>
<head>
</html>

3.[次へ]をクリックします。

4.WEBサイトに外部からアクセスできるように、[このオブジェクトにパブリック読み取りアクセス権限を付与する]に変更し、[次へ]をクリックします。

5.この設定は特に変更せず、[次へ]をクリックします。

6.[アップロード]をクリックします。これでファイルのアップロードは完了です。

7.ファイルがアップロードされたことが確認できるかと思います。

S3にWEBホスティングの設定

1.[プロパティ]→[Static website hosting]を順にクリックします。

2.[このバケットを使用してウェブサイトをホストする]を選択し、インデックスドキュメントにindex.html、エラードキュメントにerror.htmlと入力し、[保存]をクリックします。

3.バケットホスティングのところが紫色チェックになるかと思います。
これで設定完了です。

検証

それでは、早速アクセスしてみましょう。

トップページの確認
Static Web hostingの設定に記載があるURLにアクセスすると、無事表示されるかと思います。

エラーページの確認

URLの後ろのhoge.htmlや、接続先が存在しないページを指定すると、エラーページが表示されるかと思います。

以上