ストレージの設定

このガイドでは、Amplify アプリでストレージを設定する方法を学びます。バックエンドリソースを設定し、ファイルの一覧表示、アップロード、ダウンロードを有効にします。

まだ Amplify アプリを作成していない場合は、クイックスタートガイドをご覧ください。

Amplify Storage は、Amazon Simple Storage Service（Amazon S3）の上に構築されたファイルストレージおよび管理機能をフロントエンド Web およびモバイルアプリにシームレスに統合します。コアファイル操作用の直感的な API と UI コンポーネントを提供し、開発者がクラウドサービスの複雑さに対処することなく、スケーラブルで安全なファイルストレージソリューションを構築できるようにします。

ストレージバックエンドの構築

最初に、amplify/storage/resource.ts ファイルを作成します。このファイルは、ストレージバックエンドを設定する場所です。defineStorage 関数を使用してストレージをインスタンス化し、ストレージバケットの name を指定します。この name はバックエンド設定でバケットを識別するためのフレンドリー名です。Amplify は UUID を使用してアプリの一意の識別子を生成します。name 属性はアプリで使用するためのものです。

import { defineStorage } from '@aws-amplify/backend';

export const storage = defineStorage({
  name: 'amplifyTeamDrive'
});

バックエンド定義を含む amplify/backend.ts ファイルにストレージ定義をインポートします。defineBackend にストレージを追加します。

import { defineBackend } from '@aws-amplify/backend';
import { auth } from './auth/resource';
Copy highlighted code example
import { storage } from './storage/resource';

defineBackend({
  auth,
Copy highlighted code example
  storage
});

npx ampx sandbox を実行するか、Amplify にアプリをデプロイすると、ファイルが保存される Amazon S3 バケットが設定されます。ストレージ内のファイルをアプリケーションでアクセスする前に、ストレージアクセスルールを設定する必要があります。

これらの変更をデプロイするには、変更を git にコミットし、変更をアップストリームにプッシュします。Amplify の CI/CD システムが自動的に変更を検出し、ビルドとデプロイを実行します。

git commit -am "add storage backend"
git push

ファイルパスアクセスの定義

デフォルトでは、ユーザーやその他のプロジェクトリソースはストレージバケット内のファイルにアクセスできません。アクセスは defineStorage 内の access コールバックを使用して明示的に許可する必要があります。

アクセスコールバックはオブジェクトを返します。このオブジェクトの各キーはファイルパスであり、各値はそのパスに適用されるアクセスルールの配列です。

以下の例は、一般的な写真共有アプリのファイルストレージ構造を設定する方法を示しています。ここでは、

1. ゲストはすべてのプロフィール画像を表示でき、プロフィール画像をアップロードしたユーザーのみが置き換えまたは削除できます。ユーザーはこの場合、Identity Pool ID（identityID）で識別されます。
2. すべてのユーザーが画像を送信できる一般的なプールもあります。

ファイルパスへのアクセスのカスタマイズについて詳しく学ぶ。

export const storage = defineStorage({
  name: 'amplifyTeamDrive',
  access: (allow) => ({
    'profile-pictures/{entity_id}/*': [
      allow.guest.to(['read']),
      allow.entity('identity').to(['read', 'write', 'delete'])
    ],
    'picture-submissions/*': [
      allow.authenticated.to(['read','write']),
      allow.guest.to(['read', 'write'])
    ],
  })
});

追加のストレージバケットを設定する

Amplify Storage は、複数のストレージリソースを自動的にプロビジョニングおよび管理するようにバックエンドを設定する柔軟性を提供します。

同じ defineStorage 関数を使用して追加のストレージバケットを定義し、ストレージバケットを識別するための一意の説明的な name を指定できます。この name をストレージ API に渡して、アクションを実行するバケットを指定できます。定義したストレージバケット間でこの name 属性が一意であることを確認して、正しいバケットを確実に識別し、競合を防いでください。

追加のストレージバケットが定義されている場合、そのうちの 1 つを isDefault フラグでデフォルトとしてマークする必要があります。

export const firstBucket = defineStorage({
  name: 'firstBucket',
  isDefault: true, // デフォルトストレージバケットを識別（必須）
});

export const secondBucket = defineStorage({
  name: 'secondBucket',
  access: (allow) => ({
    'private/{entity_id}/*': [
      allow.entity('identity').to(['read', 'write', 'delete'])
    ]
  })
})

バックエンド定義に追加のストレージリソースを追加します。

import { defineBackend } from '@aws-amplify/backend';
import { auth } from './auth/resource';
import { firstBucket, secondBucket } from './storage/resource';

defineBackend({
  auth,
  firstBucket,
Copy highlighted code example
  secondBucket
});

ストレージバケットクライアントの使用

追加のストレージバケットは、Amplify Storage API に bucket オプションを渡すことでアプリケーションコードから参照できます。Amplify Backend で割り当てられたターゲットバケットの名前を指定できます。

let downloadTask = Amplify.Storage.downloadData(
    path: .fromString("public/example/path"),
    options: .init(
        bucket: .fromOutputs(name: "secondBucket")
    )
)

または、コンソールからバケット名とリージョンを直接指定することもできます。各 Amplify Storage API ページで追加の使用例を確認してください。

let downloadTask = Amplify.Storage.downloadData(
    path: .fromString("public/example/path"),
    options: .init(
        bucket: .fromBucketInfo(.init(
            bucketName: "another-bucket-name",
            region: "another-bucket-region")
        )    
    )
)

ストレージ削除動作の設定

デフォルトでは、ストレージリソースを削除するか Amplify アプリを削除するときに、Amplify は S3 バケットとそのすべてのオブジェクトを削除します。バケットとそのデータを保持するには、keepOnDelete を true に設定します。

export const storage = defineStorage({
  name: 'myProjectFiles',
  // リソースが削除されたときにバケットを保持する
  keepOnDelete: true,
});

アプリコードをストレージバックエンドに接続する

Amplify Storage ライブラリは、定義したバックエンドリソースに接続するクライアント API を提供します。

前提条件

Amplify ライブラリが統合されたアプリケーションと、以下のいずれかの最小ターゲット：

• iOS 13.0 （Xcode 14.1 以上使用）
• macOS 10.15 （Xcode 14.1 以上使用）
• tvOS 13.0 （Xcode 14.3 以上使用）
• watchOS 9.0 （Xcode 14.3 以上使用）
• visionOS 1.0 （Xcode 15 beta 2 以上使用。プレビューサポート -詳細は以下を参照してください。）

完全な例については、プロジェクト設定チュートリアルに従ってください。

Swift Package Manager 経由で Amplify ライブラリをインストールする

1. アプリケーションに Amplify Libraries for Swift をインストールするには、Xcode でプロジェクトを開き、ファイル > パッケージを追加 を選択します。

2. Amplify Library for Swift GitHub リポジトリ URL（https://github.com/aws-amplify/amplify-swift）を検索バーに入力し、パッケージを追加 をクリックします。

3. 最後に、AWSS3StoragePlugin、AWSCognitoAuthPlugin、Amplify を選択します。次に、パッケージを追加 をクリックします。

プロジェクトで Amplify を設定する

Amplify.add(plugin:) を呼び出して Amplify Storage カテゴリを初期化します。初期化を完了するには Amplify.configure() を呼び出します。

import Amplify
import AWSCognitoAuthPlugin
import AWSS3StoragePlugin

@main
struct MyAmplifyApp: App {
    var body: some Scene {
        WindowGroup {
            ContentView()
        }
    }

    init() {
        do {
            try Amplify.add(plugin: AWSCognitoAuthPlugin())
            try Amplify.add(plugin: AWSS3StoragePlugin())
            try Amplify.configure(with: .amplifyOutputs)
            print("Amplify configured with Auth and Storage plugins")
        } catch {
            print("Failed to initialize Amplify with \(error)")
        }
    }
}

import Amplify
import AWSCognitoAuthPlugin
import AWSS3StoragePlugin

func application(
    _ application: UIApplication,
    didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?
) -> Bool {
    do {
        try Amplify.add(plugin: AWSCognitoAuthPlugin())
        try Amplify.add(plugin: AWSS3StoragePlugin())
        try Amplify.configure(with: .amplifyOutputs)
        print("Amplify configured with Auth and Storage plugins")
    } catch {
        print("Failed to initialize Amplify with \(error)")
    }

    return true
}

このアプリケーションをビルドして実行すると、コンソールウィンドウに以下が表示されます。

Amplify configured with Auth and Storage plugins

最初のファイルをアップロードする

次に、picture-submissions/ パスに写真をアップロードしましょう。

import Amplify
import SwiftUI
import PhotosUI

struct ContentView: View {
    @State private var selectedPhoto: PhotosPickerItem?
    @State private var image: Image?

    var body: some View {
        NavigationStack {
            VStack {
                image?
                    .resizable()
                    .scaledToFit()
            }
            .padding()
            PhotosPicker(
                selection: $selectedPhoto
            ) {
                Text("Select a photo to upload")
            }
            .task(id: selectedPhoto) {
                if let imageData = try? await selectedPhoto?.loadTransferable(type: Data.self) {
                    if let uiImage = UIImage(data: imageData) {
                        image = Image(uiImage: uiImage)
                    }
                    let uploadTask = Amplify.Storage.uploadData(
                        path: .fromString("picture-submissions/myPhoto.png"),
                        data: imageData
                    )
                }
            }
        }
    }
}

Amplify コンソールでのファイル管理

ストレージバックエンドをデプロイし、プロジェクトをクライアント API に接続した後、Amplify コンソールでファイルとフォルダを管理できます。コンソールの Storage タブでアップロード、ダウンロード、コピーなどのオンデマンドアクションを実行できます。詳細については、Amplify コンソールでのファイル管理ガイドを参照してください。

まとめ

おめでとうございます！Amplify Storage の設定ガイドを完了しました。このガイドでは、バックエンドリソースを設定して接続し、ファイルパスとアクセス定義をカスタマイズし、アプリケーションをバックエンドに接続してファイルのアップロードとダウンロードなどの機能を実装しました。

次のステップ

Amplify アプリでストレージの設定が完了したので、ファイル管理機能をアプリに追加できます。以下のガイドを使用してアップロード機能とダウンロード機能を実装するか、左側のナビゲーションからさらに多くの機能にアクセスできます。

• ファイルをアップロード
• ファイルをダウンロード