Amazon S3と連携して、Storageにファイルを保存する

Amazon S3との連携方法を解説します。
Amazon S3と連携することで、Kurocoからアップロードした画像や動画ファイルを、Amazon S3のStorageに格納し利用できます。

Amazon S3の設定

バケットを作成する

Amazon S3のサイトへアクセスし、[Simple Storage Service (Amazon S3) の使用を開始する]をクリックします。
Image from Gyazo

ルートユーザーでサインインします。
AWSのアカウントを持っていない場合はこちらからサインアップしてください。
Image from Gyazo

[バケットを作成]をクリックします。
Image from Gyazo

以下のように設定し、[バケットを作成]をクリックします。

項目
バケット名任意の名称を入力する。(本チュートリアルではkuroco-sample)
AWSリージョンアジアパシフィック (東京) ap-northeast-1
オブジェクト所有者[ACL有効]にチェックを入れる。
[希望するバケット所有者]を選択する。
このバケットのブロックパブリックアクセス設定・パブリックアクセスをすべて ブロック:チェックを外す
・新しいアクセスコントロールリスト (ACL) を介して付与されたバケットとオブジェクトへのパブリックアクセスをブロックする:チェックを外す
・任意のアクセスコントロールリスト (ACL) を介して付与されたバケットとオブジェクトへのパブリックアクセスをブロックする:チェックを外す
・新しいパブリックバケットポリシーまたはアクセスポイントポリシーを介して付与されたバケットとオブジェクトへのパブリックアクセスをブロックする:チェックを入れる
・任意のパブリックバケットポリシーまたはアクセスポイントポリシーを介したバケットとオブジェクトへのパブリックアクセスとクロスアカウントアクセスをブロックする:チェックを入れる
パブリックアクセスのブロックをすべてオフにすると、このバケットとバケット内のオブジェクトが公開される可能性があります。[現在の設定により、このバケットとバケット内のオブジェクトが公開される可能性があることを承認します。]にチェックを入れる
バケットのバージョニング[無効にする]にチェックを入れる
デフォルトの暗号化[無効にする]にチェックを入れる

Image from Gyazo

Cross-Origin Resource Sharing (CORS)の設定をする

続いて、Amazon S3のCORSの設定をします。
Amazon S3のバケットページから先ほど作成したバケット名をクリックします。
Image from Gyazo

[アクセス許可]のタブをクリックします。
Image from Gyazo

[Cross-Origin Resource Sharing (CORS)]の[編集]をクリックします。
Image from Gyazo

Cross-Origin Resource Sharing (CORS)の編集画面が表示されるので、下記を設定します。
https://****.g.kuroco-mng.appの部分はご自身のKuroco管理画面のURLにしてください。

[
    {
        "AllowedHeaders": [
            "Content-Type",
            "x-amz-acl",
            "x-amz-meta-*",
            "Origin"
        ],
        "AllowedMethods": [
            "GET",
            "POST",
            "HEAD"
        ],
        "AllowedOrigins": [
            "https://****.g.kuroco-mng.app"
        ],
        "ExposeHeaders": [],
        "MaxAgeSeconds": 3000
    }
]

Image from Gyazo

入力が完了したら[変更の保存]をクリックします。

ポリシーを作成する

次に、ポリシーを作成し、Kurocoに与えるアクセス許可の内容を定義します。
画面右上のユーザ名から[セキュリティ認証情報]をクリックします。
Image from Gyazo

[ポリシー]をクリックします。
Image from Gyazo

[ポリシーの作成]をクリックします。
Image from Gyazo

ポリシーの作成画面が表示されるので、JSONのタブを開き、下記を設定します。
%%yourbucket%%の部分は該当バケット名にしてください。(本チュートリアルではkuroco-sample)

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Effect": "Allow",
            "Action": [
                "s3:ListBucket",
                "s3:GetBucketLocation"
            ],
            "Resource": "arn:aws:s3:::%%yourbucket%%"
        },
        {
            "Action": [
                "s3:*"
            ],
            "Effect": "Allow",
            "Resource": [
                "arn:aws:s3:::%%yourbucket%%/*"
            ]
        }
    ]
}

入力が完了したら[次のステップ:タグ]をクリックします。

Image from Gyazo

タグについては設定不要なので、そのまま[次のステップ:確認]をクリックして進みます。
Image from Gyazo

ポリシーの確認ページが表示されるので、名前の項目を入力して[ポリシーの作成]をクリックします。
今回はkuroco-s3という名前を付けました。
Image from Gyazo

アクセスキーを作成する

次に、Kurocoと接続するためのアクセスキーを作成しますが、ルートユーザーでのアクセスキー作成は、AWSアカウント全体への無制限アクセスが可能になるため、推奨されていません。
そこで、制限されたアクセス許可を持つ新しい IAM ユーザーを作成し、そのユーザーのアクセスキーを生成するようにします。

[ユーザー]をクリックします。
Image from Gyazo

[ユーザーを追加]をクリックします。
Image from Gyazo

ユーザー名を入力し、AWS 認証情報タイプは[アクセスキー - プログラムによるアクセス]を選択し、[次のステップ:アクセス権限]をクリックします。

項目
ユーザー名kuroco-sample-admin
AWS 認証情報タイプを選択[アクセスキー - プログラムによるアクセス]にチェックを入れる

Image from Gyazo

[既存のポリシーを直接アタッチ]を選択し、先ほど作成したポリシーを検索して選択し、[次のステップ:タグ]をクリックします。

項目
アクセス許可の設定既存のポリシーを直接アタッチ
ポリシー名kuroco-s3 を選択
アクセス権限の境界の設定アクセス権限の境界を設定せずにuserを作成するを選択

Image from Gyazo

タグについては設定不要なので、そのまま[次のステップ:確認]をクリックして進みます。
Image from Gyazo

内容を確認し、[ユーザーの作成]をクリックします。
Image from Gyazo

ユーザーが作成されたら「アクセスキー ID」と「シークレットアクセスキー」が表示されるので、メモをして[閉じる]をクリックします。
シークレットアクセスキーは画面を閉じると再表示できませんので、ご注意ください。
Image from Gyazo

Kurocoの設定

ここからはKurocoの管理画面にて作業をします。
[外部システム連携]->[Amazon S3]をクリックします。
Image from Gyazo

Amazon S3との連携画面が表示させるので、「バケット名」「アクセスキーID」「シークレットアクセスキー」を入力して[更新する]をクリックします。
Image from Gyazo

利用方法

ファイル

接続完了後、[ファイルマネージャー]をクリックすると、S3の表示が確認でき、ファイルをアップロードできます。
Image from Gyazo

Image from Gyazo

Image from Gyazo

コンテンツ定義

Kuroco管理画面のコンテンツ定義より、設定項目で[ファイル(S3)]を選択します。
Image from Gyazo

コンテンツ編集画面にファイルアップロードフィールドが表示されます。
Image from Gyazo

こちらからファイルをアップロードすると、Amazon S3のStorageにファイルがアップロードされるようになります。

お探しのページは見つかりましたか?解決しない場合は、問い合わせフォームからお問い合わせいただくか、Slackコミュニティにご参加ください。