• ガイド
  • コンセプト

高度な設定

外部ストレージの設定

スクリーンショット2022-04-0110.18.25.png

外部ストレージ機能とは、Newt管理画面からアップロードされた画像ファイルの保存先を、Newtが管理するストレージからユーザーが用意したクラウド環境のストレージ（外部ストレージ）へと切り替えることのできる機能です。この機能を活用することにより、画像データの通信コストを外部化できるためNewt経由でのデータ通信量を大幅に削減することが可能になります。
現在のストレージの対応状況は下記となっております。

クラウドサービス 対応状況
Google Cloud Storage 対応
AWS S3 対応
Azure Blob Storage 未対応

Google Cloud Storage

1. GCPプロジェクトを用意する

Google Cloud Platformのプロジェクトをお持ちでない場合は、まずGCPプロジェクトを作成します（公式ドキュメント）。
既にGCPプロジェクトをお持ちの場合は、次のステップに進みます。

2. アップロード先となるGCSバケットを作成

Cloud Storageに移動し、Newtからのファイルアップロード先として使用するバケットを作成します。
バケット名は後で利用するので控えておきましょう。（公式ドキュメント）

3. 作成したバケットに公開アクセスを設定する

バケットにアップロードした画像をインターネット上の全てのユーザーが表示できるようにアクセス権限を設定します。

  1. 2.で作成したバケットのページに移動し、権限タブを開きます
  2. [+追加] ボタンをクリックし、新しいプリンシパルに allUsers を指定し Storageオブジェクト閲覧者 ロールを付与して保存します

4. サービスアカウントを作成

NewtからGCSへとファイルをアップロードする際に必要となる秘密鍵を生成するために、まずは IAM > サービスアカウント よりサービスアカウントを作成します。作成するサービスアカウントには ストレージ管理者 ロールを割り当てます。これにより、NewtからGCS上にファイルをアップロードしたり、削除することが可能になります。

5. 秘密鍵をJSON形式でダウンロード

サービスアカウント詳細ページ > キー タブより、鍵を追加 > 新しい鍵を作成 > JSON を選択して作成します。作成をクリックすると、JSONファイルがダウンロードされます。

6. Newtで外部ストレージを設定して有効化、保存

Newt管理画面 > スペース設定 > 外部ストレージ設定 より、Google Cloud Storageを選択し、2.で作成したバケットの名前と、4.でダウンロードしたJSONファイルを設定します。設定できたら、ステータスを有効にして保存ボタンをクリックします。

AWS S3

1. AWSアカウントを用意する

AWSアカウントをお持ちでない場合は、まずAWSアカウントを作成します（公式ドキュメント）。
既にAWSアカウントをお持ちの場合は、次のステップに進みます。

2. アップロード先となるS3バケットを作成

  1. 一般的な設定 > バケット名とリージョンを選択します
  2. オブジェクト所有者 > ACL有効 を選択します
  3. このバケットのブロックパブリックアクセス設定 > パブリックアクセスをすべて ブロック のチェックを外します
  4. バケットを作成

3. S3バケットにCORSの設定を追加

NewtからS3へファイルを直接アップロードできるようにするためCORSの設定を行います。

  1. バケットの詳細ページ > アクセス許可タブを開きます
  2. Cross-Origin Resource Sharing (CORS) を下記のように編集して変更を保存します
[
    {
        "AllowedHeaders": [
            "*"
        ],
        "AllowedMethods": [
            "HEAD",
            "GET",
            "PUT",
            "POST",
            "DELETE"
        ],
        "AllowedOrigins": [
            "https://app.newt.so"
        ],
        "ExposeHeaders": []
    }
]

4. S3バケットへのアクセス権限を付与するポリシーを作成

IAM（Identity and Access Management）より、2.で作成したバケットに対するNewtからのオブジェクト（ファイル）のアップロード/削除を許可するためのポリシーを作成します。

  1. IAM > ポリシー に移動し [ポリシーの作成] をクリックします
  2. JSONエディタより、下記ポリシーを入力します（※ your-bucket-name と書いてある部分は、2.で作成したバケット名で書き換えてください）
{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Sid": "statement1",
            "Effect": "Allow",
            "Action": [
                "s3:GetObject",
                "s3:PutObject",
                "s3:PutObjectAcl",
                "s3:DeleteObject"
            ],
            "Resource": [
                "arn:aws:s3:::your-bucket-name",
                "arn:aws:s3:::your-bucket-name/*"
            ]
        }
    ]
}

5. IAMよりNewt外部ストレージ用のユーザーを作成

IAM（Identity and Access Management）より、2.で作成したバケットへのオブジェクト（ファイル）のアップロード/削除を行う際に利用するユーザーを作成します。

  1. IAM > ユーザー に移動し [ユーザーを追加] をクリックします
  2. ユーザー名を入力し、AWS認証情報タイプとして [アクセスキー - プログラムによるアクセス] にチェックをつけ次に進みます
  3. アクセス許可の設定 > 既存のポリシーを直接アタッチを選択し、3.で作成したポリシーにチェックをつけユーザーを作成します
  4. ユーザー作成の完了画面に表示されるアクセスIDとシークレットアクセスキーを控えてください

6. Newtで外部ストレージを設定して有効化、保存

Newt管理画面 > スペース設定 > 外部ストレージ設定 より、AWS S3を選択し、2.で作成したバケットのバケット名とリージョン、4.で取得したアクセスIDとシークレットアクセスキーを設定します。設定できたら、ステータスを有効にして保存ボタンをクリックします。

Azure Blob Storage（準備中）

今しばらくお待ちください。

画像最適化サービスとの連携

image-optimizer.png

画像最適化サービスとの連携は、外部ストレージ機能が有効化されている場合にのみ利用することができます。画像最適化サービスとの連携を行うことにより、画像サイズの自動最適化やキャッシング、APIを用いた画像処理などを行うことができます。
現在ご利用いただける画像最適化サービスは下記となっております。

画像最適化サービス 対応状況
ImageKit 対応
imgix 対応
Cloudinary 未対応

1. 登録済みの外部ストレージを画像最適化サービスに接続

2. 画像最適化サービスを設定して有効化

Newt管理画面 > スペース設定 > 画像最適化サービス より、画像最適化サービスの種類と接続済みのエンドポイントを設定し、有効化して保存ボタンをクリックします。

Newt Made in Newt