最終更新: 2023-11-15 12:20
TAEKO AKATSUKA
タイトルとリード文を調整
Updated by taea 2015-03-08 16:07:55 +0900
  • esa.ioでは、記事やコメントのテキストエリアにファイルをドラッグアンドドロップすることで簡単にファイルを添付することができます。
  • esa.ioでは、添付ファイルのアップロード先を独自のS3 Bucketに設定することができます。
  • 独自のS3 Bucketを使うことで、ファイルサイズ制限の拡大やセキュリティ面などにメリットがあります。
  • # 独自のS3 Bucketを使用する方法
  • もしあなたのチームが、独自のAmazon S3 bucketをお持ちで、記事やコメントに貼り付ける画像やファイルをesa.ioのサーバ上に置きたくない場合、独自のAmazon S3 bucketにファイルを保存することができます。
  • **注意**
  • - 独自のS3 Bucketを使う設定をした場合はesa.ioのサーバ上には記事やコメントに添付されたファイルは保存されません。ファイルの管理は各自でお願い致します。
  • - S3 Bucketは無料ではありません。 S3 Bucketのご利用料金はesa.ioのご利用料金とは別にAmazon Web Servicesに支払う必要があります。
  • - 設定を開始する前に、[料金 - Amazon S3](http://aws.amazon.com/jp/s3/pricing/?nc1=f_ls)をお読みになってから本当に設定すべきかどうかをお考え下さい。
  • 独自のS3 Bucketを使うことに関して不明点がある場合は お気軽に info@esa.io までお問い合わせ下さい
  • ## 独自S3 Bucketを使った場合の違い
  • | | デフォルト | 独自S3 Bucket |
  • | --- | --- | --- |
  • | 最大ファイルサイズ | 5MB | 20MB |
  • | 画像へのCDN適用 | ○ | x |
  • ## 設定手順
  • ### 1. S3 Bucketの作成
  • - AWS ConsoleのDashboardからS3を選び"Create Bucket"します
  • - bucket名は任意です(今回は`esa-custom-bucket-test`にしました)
  • - regionはチームがいる場所に近い方がUploadが速いのでおすすめです
  • ![AWS_Management_Console.png](https://img.esa.io/uploads/production/pictures/105/6275/image/789622a61bf24991c37fcd1738654f27.png)
  • ![S3_Management_Console_と_esa_-_Google_Search.png](https://img.esa.io/uploads/production/pictures/105/6276/image/5bc9115feeae2e48bf90e212bddba7a1.png)
  • ![ss 2015-03-07 21.32.03.png](https://img.esa.io/uploads/production/pictures/105/6255/image/f282be21fb715f2fa210baea07c65813.png)
  • #### CORSの設定
  • - S3にCORSの設定をします
  • ![S3_Management_Console.png](https://img.esa.io/uploads/production/pictures/105/6273/image/3f96fb172161116c19eb23a722a6d681.png)
  • ![ss 2015-03-07 22.29.34.png](https://img.esa.io/uploads/production/pictures/105/6267/image/168051d662764fbba1f556a5da88eae0.png)
  • ```
  • <CORSConfiguration>
  • <CORSRule>
  • <AllowedOrigin>*</AllowedOrigin>
  • <AllowedMethod>POST</AllowedMethod>
  • <MaxAgeSeconds>3000</MaxAgeSeconds>
  • <AllowedHeader>*</AllowedHeader>
  • </CORSRule>
  • </CORSConfiguration>
  • ```
  • ### 2. IAMでUserを追加
  • - User名は任意です(今回は `esa-user` にしました)
  • - Userを作るとAccess Keyが発行されるので控えておきます。
  • ![ss 2015-03-07 21.38.42.png](https://img.esa.io/uploads/production/pictures/105/6256/image/5c8fc1a680a8f1db949da41ebb8fd7c5.png)
  • ![ss 2015-03-07 21.40.57.png](https://img.esa.io/uploads/production/pictures/105/6257/image/4aea1f487311532ca9106cd76a820058.png)
  • ### 3. IAMでCustom Policyの作成
  • ![ss 2015-03-07 22.58.22.png](https://img.esa.io/uploads/production/pictures/105/6268/image/0f19df6ef6311dca4e27d5c36d54f4c1.png)
  • ![ss 2015-03-07 22.59.14.png](https://img.esa.io/uploads/production/pictures/105/6269/image/988069696b32cf69fae4e4825784e32b.png)
  • ![ss 2015-03-07 23.07.25.png](https://img.esa.io/uploads/production/pictures/105/6271/image/9de0233b35adc1facf7de061e913040f.png)
  • ```
  • {
  • "Version": "2012-10-17",
  • "Statement": [
  • {
  • "Sid": "Stmt1425733999000",
  • "Effect": "Allow",
  • "Action": [
  • "s3:DeleteObject",
  • "s3:GetObject",
  • "s3:ListBucket",
  • "s3:PutObject",
  • "s3:PutObjectAcl"
  • ],
  • "Resource": [
  • "arn:aws:s3:::esa-custom-bucket-test",
  • "arn:aws:s3:::esa-custom-bucket-test/*"
  • ]
  • }
  • ]
  • }
  • ```
  • ※ esa-custom-bucket-testの部分は1. で作ったbucket名に置き換えて下さい
  • ### 4. IAMでUser Policyの紐付け
  • - 2.で追加したユーザに3. で作成したpolicyを紐付けます
  • ![ss 2015-03-07 21.58.17.png](https://img.esa.io/uploads/production/pictures/105/6262/image/c11a9eeb7c787cd3d0002d9e947d40a5.png)
  • ![ss 2015-03-07 22.17.33.png](https://img.esa.io/uploads/production/pictures/105/6264/image/fb058271408f1ffbe6e1ce64810999d5.png)
  • ![ss 2015-03-07 22.18.52.png](https://img.esa.io/uploads/production/pictures/105/6265/image/57cfa7571ebe67a28004e496e90950b6.png)
  • ### 5. Bucket EndpointとAccess Keyをesa.ioに設定
  • - Bucket EndpointとAccess KeyをTeam管理ページのAdminメニューで設定します
  • - Bucket Endpointは`[bucket name].[S3 Endpoint]`の形式になっています
  • - [S3 Endpointの一覧はこちら](http://docs.aws.amazon.com/ja_jp/general/latest/gr/rande.html#s3_region)
  • ![ss 2015-03-07 21.54.56.png](https://img.esa.io/uploads/production/pictures/105/6260/image/dd94ed11bce39ef3b92ae39c028ebaf9.png)
  • ![ss 2015-03-07 21.55.36.png](https://img.esa.io/uploads/production/pictures/105/6261/image/f8d4161db420db0716f7257169370d65.png)
  • ### 6. アップロードを試してみる
  • 以上で設定は完了です。お疲れ様でした。
  • 正しく設定されていれば、1. で設定したbucketにファイルがアップロードされるはずです。
  • アップロードがうまくいかない場合は、以下の点をもう一度お確かめ下さい
  • - S3のCORS設定は正しいか
  • - IAM UserにS3にアクセス権限のあるPolicyが紐付いているか
  • - Bucket Endpointがesa.io上に正しく設定されているか
  • 解決しない場合は、 info@esa.io までお問い合わせ下さい

esa.ioでは、記事やコメントのテキストエリアにファイルをドラッグアンドドロップすることで簡単にファイルを添付することができます。esa.ioでは、添付ファイルのアップロード先を独自のS3 Bucketに設定することができます。
独自のS3 Bucketを使うことで、ファイルサイズ制限の拡大やセキュリティ面などにメリットがあります。

独自のS3 Bucketを使用する方法

もしあなたのチームが、独自のAmazon S3 bucketをお持ちで、記事やコメントに貼り付ける画像やファイルをesa.ioのサーバ上に置きたくない場合、独自のAmazon S3 bucketにファイルを保存することができます。

注意

  • 独自のS3 Bucketを使う設定をした場合はesa.ioのサーバ上には記事やコメントに添付されたファイルは保存されません。ファイルの管理は各自でお願い致します。
  • S3 Bucketは無料ではありません。 S3 Bucketのご利用料金はesa.ioのご利用料金とは別にAmazon Web Servicesに支払う必要があります。
    • 設定を開始する前に、料金 - Amazon S3をお読みになってから本当に設定すべきかどうかをお考え下さい。

独自のS3 Bucketを使うことに関して不明点がある場合は お気軽に info@esa.io までお問い合わせ下さい

独自S3 Bucketを使った場合の違い

デフォルト 独自S3 Bucket
最大ファイルサイズ 5MB 20MB
画像へのCDN適用 x

設定手順

1. S3 Bucketの作成

  • AWS ConsoleのDashboardからS3を選び"Create Bucket"します
  • bucket名は任意です(今回はesa-custom-bucket-testにしました)
  • regionはチームがいる場所に近い方がUploadが速いのでおすすめです

AWS_Management_Console.png

S3_Management_Console_と_esa_-_Google_Search.png

ss 2015-03-07 21.32.03.png

CORSの設定

  • S3にCORSの設定をします

S3_Management_Console.png

ss 2015-03-07 22.29.34.png

<CORSConfiguration>
    <CORSRule>
        <AllowedOrigin>*</AllowedOrigin>
        <AllowedMethod>POST</AllowedMethod>
        <MaxAgeSeconds>3000</MaxAgeSeconds>
        <AllowedHeader>*</AllowedHeader>
    </CORSRule>
</CORSConfiguration>

2. IAMでUserを追加

  • User名は任意です(今回は esa-user にしました)
  • Userを作るとAccess Keyが発行されるので控えておきます。

ss 2015-03-07 21.38.42.png

ss 2015-03-07 21.40.57.png

3. IAMでCustom Policyの作成

ss 2015-03-07 22.58.22.png

ss 2015-03-07 22.59.14.png

ss 2015-03-07 23.07.25.png

{
  "Version": "2012-10-17",
  "Statement": [
    {
      "Sid": "Stmt1425733999000",
      "Effect": "Allow",
      "Action": [
        "s3:DeleteObject",
        "s3:GetObject",
        "s3:ListBucket",
        "s3:PutObject",
        "s3:PutObjectAcl"
      ],
      "Resource": [
        "arn:aws:s3:::esa-custom-bucket-test",
        "arn:aws:s3:::esa-custom-bucket-test/*"
      ]
    }
  ]
}

※ esa-custom-bucket-testの部分は1. で作ったbucket名に置き換えて下さい

4. IAMでUser Policyの紐付け

  • 2.で追加したユーザに3. で作成したpolicyを紐付けます

ss 2015-03-07 21.58.17.png

ss 2015-03-07 22.17.33.png

ss 2015-03-07 22.18.52.png

5. Bucket EndpointとAccess Keyをesa.ioに設定

  • Bucket EndpointとAccess KeyをTeam管理ページのAdminメニューで設定します
  • Bucket Endpointは[bucket name].[S3 Endpoint]の形式になっています

ss 2015-03-07 21.54.56.png

ss 2015-03-07 21.55.36.png

6. アップロードを試してみる

以上で設定は完了です。お疲れ様でした。
正しく設定されていれば、1. で設定したbucketにファイルがアップロードされるはずです。

アップロードがうまくいかない場合は、以下の点をもう一度お確かめ下さい

  • S3のCORS設定は正しいか
  • IAM UserにS3にアクセス権限のあるPolicyが紐付いているか
  • Bucket Endpointがesa.io上に正しく設定されているか

解決しない場合は、 info@esa.io までお問い合わせ下さい

esa.ioでは、添付ファイルのアップロード先を独自のS3 Bucketに設定することができます。
独自のS3 Bucketを使うことで、ファイルサイズ制限の拡大やセキュリティ面などにメリットがあります。

# 独自のS3 Bucketを使用する方法

もしあなたのチームが、独自のAmazon S3 bucketをお持ちで、記事やコメントに貼り付ける画像やファイルをesa.ioのサーバ上に置きたくない場合、独自のAmazon S3 bucketにファイルを保存することができます。

**注意**

- 独自のS3 Bucketを使う設定をした場合はesa.ioのサーバ上には記事やコメントに添付されたファイルは保存されません。ファイルの管理は各自でお願い致します。
- S3 Bucketは無料ではありません。 S3 Bucketのご利用料金はesa.ioのご利用料金とは別にAmazon Web Servicesに支払う必要があります。
    - 設定を開始する前に、[料金 - Amazon S3](http://aws.amazon.com/jp/s3/pricing/?nc1=f_ls)をお読みになってから本当に設定すべきかどうかをお考え下さい。

独自のS3 Bucketを使うことに関して不明点がある場合は お気軽に info@esa.io までお問い合わせ下さい

## 独自S3 Bucketを使った場合の違い

| | デフォルト | 独自S3 Bucket |
| --- | --- | --- |
| 最大ファイルサイズ | 5MB | 20MB |
| 画像へのCDN適用 | ○ | x |

## 設定手順

### 1. S3 Bucketの作成
- AWS ConsoleのDashboardからS3を選び"Create Bucket"します
- bucket名は任意です(今回は`esa-custom-bucket-test`にしました)
- regionはチームがいる場所に近い方がUploadが速いのでおすすめです


![AWS_Management_Console.png](https://img.esa.io/uploads/production/pictures/105/6275/image/789622a61bf24991c37fcd1738654f27.png)

↓

![S3_Management_Console_と_esa_-_Google_Search.png](https://img.esa.io/uploads/production/pictures/105/6276/image/5bc9115feeae2e48bf90e212bddba7a1.png)

↓

![ss 2015-03-07 21.32.03.png](https://img.esa.io/uploads/production/pictures/105/6255/image/f282be21fb715f2fa210baea07c65813.png)

#### CORSの設定

- S3にCORSの設定をします

![S3_Management_Console.png](https://img.esa.io/uploads/production/pictures/105/6273/image/3f96fb172161116c19eb23a722a6d681.png)

↓

![ss 2015-03-07 22.29.34.png](https://img.esa.io/uploads/production/pictures/105/6267/image/168051d662764fbba1f556a5da88eae0.png)

```
<CORSConfiguration>
    <CORSRule>
        <AllowedOrigin>*</AllowedOrigin>
        <AllowedMethod>POST</AllowedMethod>
        <MaxAgeSeconds>3000</MaxAgeSeconds>
        <AllowedHeader>*</AllowedHeader>
    </CORSRule>
</CORSConfiguration>
```

### 2. IAMでUserを追加

- User名は任意です(今回は `esa-user` にしました)
- Userを作るとAccess Keyが発行されるので控えておきます。

![ss 2015-03-07 21.38.42.png](https://img.esa.io/uploads/production/pictures/105/6256/image/5c8fc1a680a8f1db949da41ebb8fd7c5.png)

↓

![ss 2015-03-07 21.40.57.png](https://img.esa.io/uploads/production/pictures/105/6257/image/4aea1f487311532ca9106cd76a820058.png)

### 3. IAMでCustom Policyの作成

![ss 2015-03-07 22.58.22.png](https://img.esa.io/uploads/production/pictures/105/6268/image/0f19df6ef6311dca4e27d5c36d54f4c1.png)

↓

![ss 2015-03-07 22.59.14.png](https://img.esa.io/uploads/production/pictures/105/6269/image/988069696b32cf69fae4e4825784e32b.png)

↓

![ss 2015-03-07 23.07.25.png](https://img.esa.io/uploads/production/pictures/105/6271/image/9de0233b35adc1facf7de061e913040f.png)

```
{
  "Version": "2012-10-17",
  "Statement": [
    {
      "Sid": "Stmt1425733999000",
      "Effect": "Allow",
      "Action": [
        "s3:DeleteObject",
        "s3:GetObject",
        "s3:ListBucket",
        "s3:PutObject",
        "s3:PutObjectAcl"
      ],
      "Resource": [
        "arn:aws:s3:::esa-custom-bucket-test",
        "arn:aws:s3:::esa-custom-bucket-test/*"
      ]
    }
  ]
}
```

※ esa-custom-bucket-testの部分は1. で作ったbucket名に置き換えて下さい

### 4. IAMでUser Policyの紐付け

- 2.で追加したユーザに3. で作成したpolicyを紐付けます


![ss 2015-03-07 21.58.17.png](https://img.esa.io/uploads/production/pictures/105/6262/image/c11a9eeb7c787cd3d0002d9e947d40a5.png)

↓


![ss 2015-03-07 22.17.33.png](https://img.esa.io/uploads/production/pictures/105/6264/image/fb058271408f1ffbe6e1ce64810999d5.png)

↓


![ss 2015-03-07 22.18.52.png](https://img.esa.io/uploads/production/pictures/105/6265/image/57cfa7571ebe67a28004e496e90950b6.png)

### 5. Bucket EndpointとAccess Keyをesa.ioに設定
- Bucket EndpointとAccess KeyをTeam管理ページのAdminメニューで設定します
- Bucket Endpointは`[bucket name].[S3 Endpoint]`の形式になっています
    - [S3 Endpointの一覧はこちら](http://docs.aws.amazon.com/ja_jp/general/latest/gr/rande.html#s3_region)


![ss 2015-03-07 21.54.56.png](https://img.esa.io/uploads/production/pictures/105/6260/image/dd94ed11bce39ef3b92ae39c028ebaf9.png)

↓

![ss 2015-03-07 21.55.36.png](https://img.esa.io/uploads/production/pictures/105/6261/image/f8d4161db420db0716f7257169370d65.png)

### 6. アップロードを試してみる

以上で設定は完了です。お疲れ様でした。
正しく設定されていれば、1. で設定したbucketにファイルがアップロードされるはずです。

アップロードがうまくいかない場合は、以下の点をもう一度お確かめ下さい

- S3のCORS設定は正しいか
- IAM UserにS3にアクセス権限のあるPolicyが紐付いているか
- Bucket Endpointがesa.io上に正しく設定されているか

解決しない場合は、 info@esa.io までお問い合わせ下さい

esa.ioでは、添付ファイルのアップロード先を独自のS3 Bucketに設定することができます。
独自のS3 Bucketを使うことで、ファイルサイズ制限の拡大やセキュリティ面などにメリットがあります。

独自のS3 Bucketを使用する方法

もしあなたのチームが、独自のAmazon S3 bucketをお持ちで、記事やコメントに貼り付ける画像やファイルをesa.ioのサーバ上に置きたくない場合、独自のAmazon S3 bucketにファイルを保存することができます。

注意

  • 独自のS3 Bucketを使う設定をした場合はesa.ioのサーバ上には記事やコメントに添付されたファイルは保存されません。ファイルの管理は各自でお願い致します。
  • S3 Bucketは無料ではありません。 S3 Bucketのご利用料金はesa.ioのご利用料金とは別にAmazon Web Servicesに支払う必要があります。
    • 設定を開始する前に、料金 - Amazon S3をお読みになってから本当に設定すべきかどうかをお考え下さい。

独自のS3 Bucketを使うことに関して不明点がある場合は お気軽に info@esa.io までお問い合わせ下さい

独自S3 Bucketを使った場合の違い

デフォルト 独自S3 Bucket
最大ファイルサイズ 5MB 20MB
画像へのCDN適用 x

設定手順

1. S3 Bucketの作成

  • AWS ConsoleのDashboardからS3を選び"Create Bucket"します
  • bucket名は任意です(今回はesa-custom-bucket-testにしました)
  • regionはチームがいる場所に近い方がUploadが速いのでおすすめです

AWS_Management_Console.png

S3_Management_Console_と_esa_-_Google_Search.png

ss 2015-03-07 21.32.03.png

CORSの設定

  • S3にCORSの設定をします

S3_Management_Console.png

ss 2015-03-07 22.29.34.png

<CORSConfiguration>
    <CORSRule>
        <AllowedOrigin>*</AllowedOrigin>
        <AllowedMethod>POST</AllowedMethod>
        <MaxAgeSeconds>3000</MaxAgeSeconds>
        <AllowedHeader>*</AllowedHeader>
    </CORSRule>
</CORSConfiguration>

2. IAMでUserを追加

  • User名は任意です(今回は esa-user にしました)
  • Userを作るとAccess Keyが発行されるので控えておきます。

ss 2015-03-07 21.38.42.png

ss 2015-03-07 21.40.57.png

3. IAMでCustom Policyの作成

ss 2015-03-07 22.58.22.png

ss 2015-03-07 22.59.14.png

ss 2015-03-07 23.07.25.png

{
  "Version": "2012-10-17",
  "Statement": [
    {
      "Sid": "Stmt1425733999000",
      "Effect": "Allow",
      "Action": [
        "s3:DeleteObject",
        "s3:GetObject",
        "s3:ListBucket",
        "s3:PutObject",
        "s3:PutObjectAcl"
      ],
      "Resource": [
        "arn:aws:s3:::esa-custom-bucket-test",
        "arn:aws:s3:::esa-custom-bucket-test/*"
      ]
    }
  ]
}

※ esa-custom-bucket-testの部分は1. で作ったbucket名に置き換えて下さい

4. IAMでUser Policyの紐付け

  • 2.で追加したユーザに3. で作成したpolicyを紐付けます

ss 2015-03-07 21.58.17.png

ss 2015-03-07 22.17.33.png

ss 2015-03-07 22.18.52.png

5. Bucket EndpointとAccess Keyをesa.ioに設定

  • Bucket EndpointとAccess KeyをTeam管理ページのAdminメニューで設定します
  • Bucket Endpointは[bucket name].[S3 Endpoint]の形式になっています

ss 2015-03-07 21.54.56.png

ss 2015-03-07 21.55.36.png

6. アップロードを試してみる

以上で設定は完了です。お疲れ様でした。
正しく設定されていれば、1. で設定したbucketにファイルがアップロードされるはずです。

アップロードがうまくいかない場合は、以下の点をもう一度お確かめ下さい

  • S3のCORS設定は正しいか
  • IAM UserにS3にアクセス権限のあるPolicyが紐付いているか
  • Bucket Endpointがesa.io上に正しく設定されているか

解決しない場合は、 info@esa.io までお問い合わせ下さい