AWS の S3 で Web サイトを公開する

AWS S3 のバケットに独自ドメインを割り当てて、静的ファイルをホスティングを参考にして、静的なコンテンツを配置しようと思います。

S3 にバケットを作成

バケット名は、公開するホスト名と一致するように指定します。

アクセスキーIDとセキュリティーキーを確認

S3 にファイルを転送

S3 でコンテンツを公開できるのは、静的なコンテンツのみです。
しかし、このサイトはブログも設置したいと考えています。そこで、静的サイトジェネレータ（Static Site Generator）を使ってヘッダやフッターなどの共通部分のパーツ化を行います。
今回採用したのは、ChatWork株式会社が開発したPhestです。コマンドラインでゴニョゴニョしなくて良いのと、S3へのデプロイ機能が標準で用意されているので、便利そうです。ありがたく利用させていただくことにします。
早速、S3にデプロイする設定をconfig.ymlに追加します。

plugins:
  - s3deploy: #S3へデプロイするファイルを確認 (実際のデプロイは行いません)
      _button:
        label: デプロイテスト
        type: primary
        icon: ok-circle
      dryrun: true                                          #ここをtrueにするとS3側のファイルを操作しません
      prefix:                                               #アップするオブジェクトにつけるprefix
      bucket: www.m-kobayashi.org                           #バケット名
      region: tokyo                                         #リージョン名
      protectpatterns:
        - logs/*
      key: ********************                             #AWSのアクセスキー
      secret: ****************************************      #AWSのシークレットキー
  - s3deploy: #S3へデプロイする
      _button:
        label: デプロイ
        type: success
        icon: cloud-upload
        confirm: true
      dryrun: false                                         #ここをtrueにするとS3側のファイルを操作しません
      prefix:                                               #アップするオブジェクトにつけるprefix
      bucket: www.m-kobayashi.org                           #バケット名
      region: tokyo                                         #リージョン名
      protectpatterns:
        - logs/*
      key: ********************                             #AWSのアクセスキー
      secret: ****************************************      #AWSのシークレットキー
            

ページを作成したらローカルに出力して内容を確認します。


公開用のコンテンツを生成します。


デプロイテストは、更新（削除もある）対象のファイルを確認することが出来ます。


S3にデプロイします。

S3 バケットに独自ドメインでアクセスする

nameは、先程作成したバケット名と同じになるようにします。

Tweet