diff --git a/src/pages/[platform]/build-a-backend/storage/use-with-custom-s3/index.mdx b/src/pages/[platform]/build-a-backend/storage/use-with-custom-s3/index.mdx index 1ce67bd9ba3..285bd4854e5 100644 --- a/src/pages/[platform]/build-a-backend/storage/use-with-custom-s3/index.mdx +++ b/src/pages/[platform]/build-a-backend/storage/use-with-custom-s3/index.mdx @@ -44,74 +44,471 @@ To do this, go to **Amazon S3 console** > **Select the S3 bucket** > **Permissio ![Showing Amplify console showing Storage tab selected](/images/gen2/storage/s3-console-permissions.png) -The policy will look something like this +The policy will look something like this: ```json { - "Version": "2012-10-17", - "Statement": [ - { - "Sid": "Statement1", - "Principal": { "AWS": "arn:aws:iam:::role/" }, - "Effect": "Allow", - "Action": [ - "s3:PutObject", - "s3:GetObject", - "s3:DeleteObject", - "s3:ListBucket" - ], - "Resource": [ - "arn:aws:s3:::/*" - ] - } - ] + "Version": "2012-10-17", + "Statement": [ + { + "Sid": "Statement1", + "Principal": { + "AWS": "arn:aws:iam:::role/" + }, + "Effect": "Allow", + "Action": [ + "s3:PutObject", + "s3:GetObject", + "s3:DeleteObject", + "s3:ListBucket" + ], + "Resource": [ + "arn:aws:s3:::", + "arn:aws:s3:::/*" + ] + } + ] } ``` Replace `` with your AWS account ID and `` with the IAM role associated with your Amplify Auth setup. Replace `` with the S3 bucket name. You can refer to [Amazon S3's Policies and Permissions documentation](https://docs.aws.amazon.com/AmazonS3/latest/userguide/access-policy-language-overview.html) for more ways to customize access to the bucket. -### Specify S3 bucket in Amplify's backend config + +In order to make calls to your manually configured S3 bucket from your application, you must also set up a [CORS Policy](/[platform]/build-a-backend/storage/extend-s3-resources/#for-manually-configured-s3-resources) for the bucket. + + +### Specify the S3 bucket in Amplify's backend config -Next, use the `addOutput` method from the backend definition object to define a custom s3 bucket by specifying the name and region of the bucket in your **amplify/backend.ts** file. +Next, use the `addOutput` method from the backend definition object to define a custom S3 bucket by specifying the name and region of the bucket in your `amplify/backend.ts` file. You must also set up the appropriate resources and IAM policies to be attached to the backend. +**Important:** You can use a storage backend configured through Amplify and a custom S3 bucket at the same time using this method. However, the Amplify-configured storage will be used as the **default bucket** and the custom S3 bucket will only be used as an additional bucket. + -**Important** +#### Configure the S3 bucket -You cannot use both a storage backend configured through Amplify and a custom S3 bucket at the same time. +Below are several examples of configuring the backend to define a custom S3 bucket: -If you specify a custom S3 bucket, no sandbox storage resource will be created. The provided custom S3 bucket will be used, even in the sandbox environment. + + +Below is an example of expanding the original backend object to grant all guest (i.e. not signed in) users read access to files under `public/`: - +```ts title="amplify/backend.ts" +import { defineBackend } from "@aws-amplify/backend"; +import { Effect, Policy, PolicyStatement } from "aws-cdk-lib/aws-iam"; +import { Bucket } from "aws-cdk-lib/aws-s3"; +import { auth } from "./auth/resource"; + +const backend = defineBackend({ + auth, +}); +// highlight-start +const customBucketStack = backend.createStack("custom-bucket-stack"); + +// Import existing bucket +const customBucket = Bucket.fromBucketAttributes(bucketStack, "MyCustomBucket", { + bucketArn: "arn:aws:s3:::", + region: "" +}); + +backend.addOutput({ + storage: { + aws_region: customBucket.env.region, + bucket_name: customBucket.bucketName, + // optional: `buckets` can be used when setting up more than one existing bucket + buckets: [ + { + aws_region: customBucket.env.region, + bucket_name: customBucket.bucketName, + name: customBucket.bucketName, + /* + optional: `paths` can be used to set up access to specific + bucket prefixes and configure user access types to them + */ + paths: { + "public/*": { + // "write" and "delete" can also be added depending on your use case + guest: ["get", "list"], + }, + }, + } + ] + }, +}); -```javascript +/* + Define an inline policy to attach to Amplify's unauth role + This policy defines how unauthenticated/guest users can access your existing bucket +*/ +const unauthPolicy = new Policy(backend.stack, "customBucketUnauthPolicy", { + statements: [ + new PolicyStatement({ + effect: Effect.ALLOW, + actions: ["s3:GetObject"], + resources: [`${customBucket.bucketArn}/public/*`], + }), + new PolicyStatement({ + effect: Effect.ALLOW, + actions: ["s3:ListBucket"], + resources: [ + `${customBucket.bucketArn}`, + `${customBucket.bucketArn}/*` + ], + conditions: { + StringLike: { + "s3:prefix": ["public/", "public/*"], + }, + }, + }), + ], +}); -import { defineBackend } from '@aws-amplify/backend'; -import { auth } from './auth/resource'; -import { data } from './data/resource'; +// Add the policies to the unauthenticated user role +backend.auth.resources.unauthenticatedUserIamRole.attachInlinePolicy( + unauthPolicy, +); +// highlight-end +``` + + +Below is an example of expanding the original backend object to grant all authenticated (i.e. signed in) users with full access to files under `public/`: +```ts title="amplify/backend.ts" +import { defineBackend } from "@aws-amplify/backend"; +import { Effect, Policy, PolicyStatement } from "aws-cdk-lib/aws-iam"; +import { Bucket } from "aws-cdk-lib/aws-s3"; +import { auth } from "./auth/resource"; const backend = defineBackend({ auth, - data, }); -//highlight-start +const customBucketStack = backend.createStack("custom-bucket-stack"); + +// Import existing bucket +const customBucket = Bucket.fromBucketAttributes(bucketStack, "MyCustomBucket", { + bucketArn: "arn:aws:s3:::", + region: "" +}); + backend.addOutput({ storage: { - aws_region: "", - bucket_name: "" + aws_region: customBucket.env.region, + bucket_name: customBucket.bucketName, + buckets: [ + { + aws_region: customBucket.env.region, + bucket_name: customBucket.bucketName, + name: customBucket.bucketName, + paths: { + "public/*": { + guest: ["get", "list"], + // highlight-start + authenticated: ["get", "list", "write", "delete"], + // highlight-end + }, + }, + } + ] }, }); -//highlight-end +// ... Unauthenticated/guest user policies and role attachments go here ... +// highlight-start +/* + Define an inline policy to attach to Amplify's auth role + This policy defines how authenticated users can access your existing bucket +*/ +const authPolicy = new Policy(backend.stack, "customBucketAuthPolicy", { + statements: [ + new PolicyStatement({ + effect: Effect.ALLOW, + actions: [ + "s3:GetObject", + "s3:PutObject", + "s3:DeleteObject" + ], + resources: [`${customBucket.bucketArn}/public/*`,], + }), + new PolicyStatement({ + effect: Effect.ALLOW, + actions: ["s3:ListBucket"], + resources: [ + `${customBucket.bucketArn}`, + `${customBucket.bucketArn}/*` + ], + conditions: { + StringLike: { + "s3:prefix": ["public/*", "public/"], + }, + }, + }), + ], +}); + +// Add the policies to the authenticated user role +backend.auth.resources.authenticatedUserIamRole.attachInlinePolicy(authPolicy); +// highlight-end ``` + + +Below is an example of expanding the original backend object with user group permissions. Here, any authenticated users can read from `admin/` and `public/` and authenticated users belonging to the "admin" user group can only manage `admin/`: +{/* cSpell:disable */} +```ts title="amplify/backend.ts" +import { defineBackend } from "@aws-amplify/backend"; +import { Effect, Policy, PolicyStatement } from "aws-cdk-lib/aws-iam"; +import { Bucket } from "aws-cdk-lib/aws-s3"; +import { auth } from "./auth/resource"; + +const backend = defineBackend({ + auth, +}); + +const customBucketStack = backend.createStack("custom-bucket-stack"); + +// Import existing bucket +const customBucket = Bucket.fromBucketAttributes(bucketStack, "MyCustomBucket", { + bucketArn: "arn:aws:s3:::", + region: "" +}); + +backend.addOutput({ + storage: { + aws_region: customBucket.env.region, + bucket_name: customBucket.bucketName, + buckets: [ + { + aws_region: customBucket.env.region, + bucket_name: customBucket.bucketName, + name: customBucket.bucketName, + /* + @ts-expect-error: Amplify backend type issue + https://github.com/aws-amplify/amplify-backend/issues/2569 + */ + paths: { + "public/*": { + authenticated: ["get", "list", "write", "delete"], + }, + // highlight-start + "admin/*": { + authenticated: ["get", "list"], + groupsadmin: ["get", "list", "write", "delete"], + }, + // highlight-end + }, + } + ] + }, +}); + +// ... Authenticated user policy and role attachment goes here ... +// highlight-start +/* + Define an inline policy to attach to "admin" user group role + This policy defines how authenticated users with + "admin" user group role can access your existing bucket +*/ +const adminPolicy = new Policy(backend.stack, "customBucketAdminPolicy", { + statements: [ + new PolicyStatement({ + effect: Effect.ALLOW, + actions: [ + "s3:GetObject", + "s3:PutObject", + "s3:DeleteObject" + ], + resources: [ `${customBucket.bucketArn}/admin/*`], + }), + new PolicyStatement({ + effect: Effect.ALLOW, + actions: ["s3:ListBucket"], + resources: [ + `${customBucket.bucketArn}` + `${customBucket.bucketArn}/*` + ], + conditions: { + StringLike: { + "s3:prefix": ["admin/*", "admin/"], + }, + }, + }), + ], +}); + +// Add the policies to the "admin" user group role +backend.auth.resources.groups["admin"].role.attachInlinePolicy(adminPolicy); +// highlight-end +``` +{/* cSpell:enable */} + + +Amplify allows scoping file access to individual users via the user's identity ID. To specify the user's identity ID, you can use the token `${cognito-identity.amazonaws.com:sub}`. + +Below is an example of expanding the original backend object to define read access for guests to the `public/` folder, as well as defining a `protected/` folder where anyone can view uploaded files, but only the file owner can modify/delete them: + +{/* cSpell:disable */} +```ts title="amplify/backend.ts" +import { defineBackend } from "@aws-amplify/backend"; +import { Effect, Policy, PolicyStatement } from "aws-cdk-lib/aws-iam"; +import { Bucket } from "aws-cdk-lib/aws-s3"; +import { auth } from "./auth/resource"; + +const backend = defineBackend({ + auth, +}); + +const customBucketStack = backend.createStack("custom-bucket-stack"); + +// Import existing bucket +const customBucket = s3.Bucket.fromBucketAttributes(bucketStack, "MyCustomBucket", { + bucketArn: "arn:aws:s3:::", + region: "" +}); + +backend.addOutput({ + storage: { + aws_region: customBucket.env.region, + bucket_name: customBucket.bucketName, + buckets: [ + { + aws_region: customBucket.env.region, + bucket_name: customBucket.bucketName, + name: customBucket.bucketName, + /* + @ts-expect-error: Amplify backend type issue + https://github.com/aws-amplify/amplify-backend/issues/2569 + */ + paths: { + "public/*": { + guest: ["get", "list"], + authenticated: ["get", "list", "write", "delete"], + }, + // highlight-start + // allow all users to view all folders/files within `protected/` + "protected/*": { + guest: ["get", "list"], + authenticated: ["get", "list"], + }, + // allow owners to read, write and delete their own files in assigned subfolder + "protected/${cognito-identity.amazonaws.com:sub}/*": { + entityidentity: ["get", "list", "write", "delete"] + } + // highlight-end + }, + } + ] + }, +}); +// highlight-start +/* + Define an inline policy to attach to Amplify's unauth role + This policy defines how unauthenticated users/guests + can access your existing bucket +*/ +const unauthPolicy = new Policy(backend.stack, "customBucketUnauthPolicy", { + statements: [ + new PolicyStatement({ + effect: Effect.ALLOW, + actions: ["s3:GetObject"], + resources: [ + `${customBucket.bucketArn}/public/*` + `${customBucket.bucketArn}/protected/*` + ], + }), + new PolicyStatement({ + effect: Effect.ALLOW, + actions: ["s3:ListBucket"], + resources: [ + `${customBucket.bucketArn}` + `${customBucket.bucketArn}/*` + ], + conditions: { + StringLike: { + "s3:prefix": [ + "public/", + "public/*", + "protected/", + "protected/*" + ], + }, + }, + }), + ], +}); + +/* + Define an inline policy to attach to Amplify's auth role + This policy defines how authenticated users can access your + existing bucket and customizes owner access to their individual folder +*/ +const authPolicy = new Policy(backend.stack, "customBucketAuthPolicy", { + statements: [ + new PolicyStatement({ + effect: Effect.ALLOW, + actions: ["s3:GetObject"], + resources: [ + `${customBucket.bucketArn}/public/*` + `${customBucket.bucketArn}/protected/*` + ], + }), + new PolicyStatement({ + effect: Effect.ALLOW, + actions: ["s3:ListBucket"], + resources: [ + `${customBucket.bucketArn}` + `${customBucket.bucketArn}/*` + ], + conditions: { + StringLike: { + "s3:prefix": [ + "public/", + "public/*", + "protected/", + "protected/*" + ], + }, + }, + }), + new PolicyStatement({ + effect: Effect.ALLOW, + actions: ["s3:PutObject"], + resources: [ + `${customBucket.bucketArn}/public/*` + `${customBucket.bucketArn}/protected/${cognito-identity.amazonaws.com:sub}/*` + ], + }), + new PolicyStatement({ + effect: Effect.ALLOW, + actions: ["s3:DeleteObject"], + resources: [ + `${customBucket.bucketArn}/protected/${cognito-identity.amazonaws.com:sub}/*` + ], + }), + ], +}); + +// Add the policies to the unauthenticated user role +backend.auth.resources.unauthenticatedUserIamRole.attachInlinePolicy( + unauthPolicy, +); + +// Add the policies to the authenticated user role +backend.auth.resources.authenticatedUserIamRole.attachInlinePolicy(authPolicy); +// highlight-end +``` +{/* cSpell:enable */} + + + + +The custom authorization rules defined in the examples can be combined, and follow the same rules as Amplify-defined storage. Please refer to our documentation on [customizing authorization rules](/[platform]/build-a-backend/storage/authorization/) for more information. + -### Import latest amplify_outputs.json file +### Import latest `amplify_outputs.json` file -To ensure the local **amplify_outputs.json** file is up-to-date, you can run [the npx ampx generate outputs command](/[platform]/reference/cli-commands/#npx-ampx-generate-outputs) or download the latest **amplify_outputs.json** from the Amplify console as shown below. +To ensure the local `amplify_outputs.json` file is up-to-date, you can run [the `npx ampx generate outputs` command](/[platform]/reference/cli-commands/#npx-ampx-generate-outputs) or download the latest `amplify_outputs.json` from the Amplify console as shown below. ![](/images/gen2/getting-started/react/amplify-outputs-download.png) @@ -119,9 +516,9 @@ To ensure the local **amplify_outputs.json** file is up-to-date, you can run [th -### Import latest amplify_outputs.dart file +### Import latest `amplify_outputs.dart` file -To ensure the local **amplify_outputs.dart** file is up-to-date, you can run [the npx ampx generate outputs command](/[platform]/reference/cli-commands/#npx-ampx-generate-outputs). +To ensure the local `amplify_outputs.dart` file is up-to-date, you can run [the `npx ampx generate outputs` command](/[platform]/reference/cli-commands/#npx-ampx-generate-outputs). @@ -130,16 +527,16 @@ Now that you've configured the necessary permissions, you can start using the st ## Use storage resources without an Amplify backend -While using the Amplify Backend is the easiest way to get started, existing storage resources can also be integrated with Amplify Storage. +While using the Amplify backend is the easiest way to get started, existing storage resources can also be integrated with Amplify Storage. In addition to manually configuring your storage options, you will also need to ensure Amplify Auth is properly configured in your project and associated IAM roles have the necessary permissions to interact with your existing bucket. Read more about [using existing auth resources without an Amplify backend](/[platform]/build-a-backend/auth/use-existing-cognito-resources/#use-auth-resources-without-an-amplify-backend). -### Using Amplify configure +### Using `Amplify.configure` Existing storage resource setup can be accomplished by passing the resource metadata to `Amplify.configure`. This will configure the Amplify Storage client library to interact with the additional resources. It's recommended to add the Amplify configuration step as early as possible in the application lifecycle, ideally at the root entry point. - +{/* cSpell:disable */} ```ts -import { Amplify } from 'aws-amplify'; +import { Amplify } from "aws-amplify"; Amplify.configure({ Auth: { @@ -147,28 +544,52 @@ Amplify.configure({ }, Storage: { S3: { - bucket: '', - region: '', + bucket: "", + region: "", // default bucket metadata should be duplicated below with any additional buckets buckets: { - '': { - bucketName: '', - region: '' + "": { + bucketName: "", + region: "", + paths: { + "public/*": { + guest: ["get", "list"], + authenticated: ["get", "list", "write", "delete"], + groupsadmin: ["get", "list", "write", "delete"] + }, + "protected/*": { + guest: ["get", "list"], + authenticated: ["get", "list"], + groupsadmin: ["get", "list", "write", "delete"] + } + "protected/${cognito-identity.amazonaws.com:sub}/*": { + entityidentity: ["get", "list", "write", "delete"] + }, + "admin/*": { + authenticated: ["get", "list"], + groupsadmin: ["get", "list", "write", "delete"], + }, + } }, - '': { - bucketName: '', - region: '' + "": { + bucketName: "", + region: "", + paths: { + // ... + } } } } } }); - ``` -### Using Amplify outputs +{/* cSpell:enable */} + +### Using `amplify_outputs.json` Alternatively, existing storage resources can be used by creating or modifying the `amplify_outputs.json` file directly. +{/* cSpell:disable */} ```ts title="amplify_outputs.json" { "auth": { @@ -182,15 +603,75 @@ Alternatively, existing storage resources can be used by creating or modifying t { "name": "", "bucket_name": "", - "aws_region": "" + "aws_region": "", + "paths": { + "public/*": { + "guest": [ + "get", + "list" + ], + "authenticated": [ + "get", + "list", + "write", + "delete" + ], + "groupsadmin": [ + "get", + "list", + "write", + "delete" + ] + }, + "protected/*": { + "guest": [ + "get", + "list" + ], + "authenticated": [ + "get", + "list" + ], + "groupsadmin": [ + "get", + "list", + "write", + "delete" + ] + }, + "protected/${cognito-identity.amazonaws.com:sub}/*": { + "entityidentity": [ + "get", + "list", + "write", + "delete" + ] + }, + "admin/*": { + "authenticated": [ + "get", + "list" + ], + "groupsadmin": [ + "get", + "list", + "write", + "delete" + ] + } + } }, { "name": "", "bucket_name": "", - "aws_region": "" + "aws_region": "", + "paths": { + // add more paths for the bucket + } } ] } } ``` +{/* cSpell:enable */}