dogrunjp
4/18/2015 - 2:23 AM

S3のWebサイトホスティングへの静的ファイルの更新にgithubとwerckerを利用する方法

S3のWebサイトホスティングへの静的ファイルの更新にgithubとwerckerを利用する方法

S3のWebサイトホスティングへの静的ファイルの更新にgithubとwerckerを利用する方法

werckerはいわゆるCI(継続的インテグレーション)を提供するツールで、テスト・ビルド・デプロイなどの自動化をWebサービスとして提供します。

GitHubとwerckerを組み合わせて使った場合、レポジトリに環境とコマンドを記述したwercker.ymlを設置するとこのyamlをもとにテスト・ビルド・デプロイを実行することができます。

Jekyllなどの静的サイトジェネレータとwerckerの組み合わせの解説は日本語でも増えているようですが、手動でサイトのアセットを更新してサイト構築作業を共有するようなケースではあまり利用されていないのかサンプルが見当たりませんでした。

ということで、手動で作成したファイルをGithubで共有しwerckerでS3に置いたサイトの更新を行うようのケースの設定をメモしておきます。

新規アプリケーションの作成

wercker.comにログインし(githubアカウントでログインできます)、「Create」メニューから「Application」を選択します。 ここからGit providerの選択>レポジトリの選択>各種設定、、、とほぼ自動的に設定が進みます。

wercker.yml

静的ファイルのデプロイでは、S3のアクセスキー、シークレットキー、バケットURLの変数を記述したyamlをレポジトリに設置します。

各変数はwerckerのsetting > pipelineで設定しておきます(新規アプリケーションを作成するときの流れで設定できます)。自分はAWSのIAM userをwercker用に作り、そのユーザのキーを入力しています。

box: wercker/default
deploy:
    steps:
        - s3sync:
            key_id: $AWS_ACCESS_KEY_ID
            key_secret: $AWS_SECRET_ACCESS_KEY
            bucket_url: $AWS_BUCKET_URL

S3のbucket

Website Hostingを選択したS3のBucketのPermissionにbucket policyを追加します。

{
    "Version": "2008-10-17",
    "Statement": [
        {
            "Sid": "AddPerm",
            "Effect": "Allow",
            "Principal": {
                "AWS": "*"
            },
            "Action": [
                "s3:GetObjectAcl",
                "s3:DeleteObject",
                "s3:GetObject",
                "s3:PutObjectAcl",
                "s3:PutObject"
            ],
            "Resource": [
                "arn:aws:s3:::[your bucket name]",
                "arn:aws:s3:::[your bucket name]/*"
            ]
        }
    ]
}

もう少し無駄の無い記述にしても良いかも。

更新

git pushするとwerckerが更新をフックして、S3上のサイトが自動的に更新されます。