Skip to content

Commit f329cce

Browse files
jjarvispashika112
andauthored
[Multi-bucket] Storage - add multi bucket setup and usage examples (#7858)
* adding multi bucket sections / examples * adding callout for copy * fix link * adding list example and rewording * rename to remove support * add setup section and update links * fix accessibility violations * remove from non JS sections * update download files option language Co-authored-by: ashika112 <155593080+ashika112@users.noreply.github.com> * update copy example to include alternatives * update language for alternative on download Co-authored-by: ashika112 <155593080+ashika112@users.noreply.github.com> * punctuation * unify language across pages * adding title to copy section * adding subpath strategy to options * resolve broken link * manual override amplify outputs * remove type def * remove amplify outputs in setup guide * modify existing storage examples * remove section from download * remove section from list page * remove section from remove * update copy files page * unify language * unify language * modify existing resources section * use resource config in override * addressing feedback * remove redundant link * address feedback * add / update links * add full code examples * update heading * clean up code samples * full examples on setup page * remove redundant text * consistent setup examples * restructure storage setup * simplify upload code examples * update tables with default values * update code snippets * Revamp list file code * update upload examples * fix leak * address feedback * moved / revamped storage without backend section --------- Co-authored-by: ashika112 <155593080+ashika112@users.noreply.github.com> Co-authored-by: ashika112 <akasivis@amazon.com>
1 parent 59432ba commit f329cce

File tree

7 files changed

+499
-93
lines changed

7 files changed

+499
-93
lines changed

src/pages/[platform]/build-a-backend/storage/copy-files/index.mdx

Lines changed: 42 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -66,11 +66,48 @@ Cross identity ID copying is only allowed if the destination path has the the ri
6666

6767
</Callout>
6868

69-
### More `copy` options
69+
## Specify a bucket or copy across buckets / regions
7070

71-
Option | Type | Description | Reference Links |
72-
| -- | -- | ----------- | -- |
73-
| useAccelerateEndpoint | boolean | Whether to use accelerate endpoint. | [Transfer Acceleration](/[platform]/build-a-backend/storage/extend-s3-resources/#example---enable-transfer-acceleration) |
71+
You can also perform an `copy` operation to a specific bucket by providing the `bucket` option. This option can either be a string representing the target bucket's assigned name in Amplify Backend or an object specifying the bucket name and region from the console.
72+
73+
```javascript
74+
import { copy } from 'aws-amplify/storage';
75+
76+
const copyFile = async () => {
77+
try {
78+
const response = await copy({
79+
source: {
80+
path: 'album/2024/1.jpg',
81+
// Specify a target bucket using name assigned in Amplify Backend
82+
// or bucket name from console and associated region
83+
bucket: 'assignedNameInAmplifyBackend'
84+
},
85+
destination: {
86+
path: 'shared/2024/1.jpg',
87+
// Specify a target bucket using name assigned in Amplify Backend
88+
// or bucket name from console and associated region
89+
bucket: {
90+
bucketName: 'generated-second-bucket-name',
91+
region: 'us-east-2'
92+
}
93+
}
94+
});
95+
} catch (error) {
96+
console.error('Error', err);
97+
}
98+
};
99+
```
100+
101+
<Callout>
102+
In order to copy to or from a bucket other than your default, both source and destination must have `bucket` explicitly defined.
103+
</Callout>
104+
105+
## Copy `source` and `destination` options
106+
107+
Option | Type | Default | Description |
108+
| -- | :--: | :--: | ----------- |
109+
| path | string \| <br/>(\{ identityId \}) => string | Required | A string or callback that represents the path in source and destination bucket to copy the object to or from |
110+
| bucket | string \| <br />\{ bucketName: string;<br/> region: string; \} | Default bucket and region from Amplify configuration | A string representing the target bucket's assigned name in Amplify Backend or an object specifying the bucket name and region from the console.<br/><br/>Read more at [Configure additional storage buckets](/[platform]/build-a-backend/storage/set-up-storage/#configure-additional-storage-buckets). |
74111

75112
</InlineFilter>
76113

@@ -92,7 +129,7 @@ Future<void> copy() async {
92129
}
93130
```
94131

95-
### More `copy` options
132+
## More `copy` options
96133

97134
Option | Type | Description |
98135
| -- | -- | ----------- |

src/pages/[platform]/build-a-backend/storage/download-files/index.mdx

Lines changed: 96 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -70,16 +70,10 @@ import { getUrl } from 'aws-amplify/storage';
7070
const linkToStorageFile = await getUrl({
7171
path: "album/2024/1.jpg",
7272
// Alternatively, path: ({identityId}) => `album/{identityId}/1.jpg`
73-
options: {
74-
validateObjectExistence?: false, // defaults to false
75-
expiresIn?: 20 // validity of the URL, in seconds. defaults to 900 (15 minutes) and maxes at 3600 (1 hour)
76-
useAccelerateEndpoint: true; // Whether to use accelerate endpoint.
77-
},
7873
});
7974
console.log('signed URL: ', linkToStorageFile.url);
8075
console.log('URL expires at: ', linkToStorageFile.expiresAt);
8176
```
82-
8377
Inside your template or JSX code, you can use the `url` property to create a link to the file:
8478

8579
```tsx
@@ -94,13 +88,34 @@ This function does not check if the file exists by default. As result, the signe
9488

9589
</Callout>
9690

97-
### More `getUrl` options
91+
### More getUrl options
9892

99-
Option | Type | Description |
100-
| -- | -- | ----------- |
101-
| useAccelerateEndpoint | boolean | Whether to use accelerate endpoint. <br/><br/> Read more at [Transfer Acceleration](/[platform]/build-a-backend/storage/extend-s3-resources/#example---enable-transfer-acceleration) | |
102-
| validateObjectExistence | boolean | Whether to head object to make sure the object existence before downloading. Defaults to false |
103-
| expiresIn | number | Number of seconds till the URL expires. <br/><br/> The expiration time of the presigned url is dependent on the session and will max out at 1 hour. |
93+
The behavior of the `getUrl` API can be customized by passing in options.
94+
95+
```typescript
96+
import { getUrl } from 'aws-amplify/storage';
97+
98+
const linkToStorageFile = await getUrl({
99+
path: "album/2024/1.jpg",
100+
options: {
101+
// specify a target bucket using name assigned in Amplify Backend
102+
bucket: 'assignedNameInAmplifyBackend',
103+
// ensure object exists before getting url
104+
validateObjectExistence: true,
105+
// url expiration time in seconds.
106+
expiresIn: 300,
107+
// whether to use accelerate endpoint
108+
useAccelerateEndpoint: true,
109+
}
110+
});
111+
```
112+
113+
Option | Type | Default | Description |
114+
| :--: | :--: | :--: | ----------- |
115+
| bucket | string \| <br />\{ bucketName: string;<br/> region: string; \} | Default bucket and region from Amplify configuration | A string representing the target bucket's assigned name in Amplify Backend or an object specifying the bucket name and region from the console.<br/><br/>Read more at [Configure additional storage buckets](/[platform]/build-a-backend/storage/set-up-storage/#configure-additional-storage-buckets)
116+
| validateObjectExistence | boolean | false | Whether to head object to make sure the object existence before downloading. |
117+
| expiresIn | number | 900 | Number of seconds till the URL expires. <br/><br/> The expiration time of the presigned url is dependent on the session and will max out at 1 hour. |
118+
| useAccelerateEndpoint | boolean | false | Whether to use accelerate endpoint. <br/><br/> Read more at [Transfer Acceleration](/[platform]/build-a-backend/storage/extend-s3-resources/#example---enable-transfer-acceleration) |
104119

105120
</InlineFilter>
106121

@@ -296,18 +311,7 @@ import { downloadData } from 'aws-amplify/storage';
296311

297312
// Downloads file content to memory
298313
const { body, eTag } = await downloadData({
299-
path: "/album/2024/1.jpg",
300-
options: {
301-
// optional progress callback
302-
onProgress: (event) => {
303-
console.log(event.transferredBytes);
304-
}
305-
// optional bytes range parameter to download a part of the file, the 2nd MB of the file in this example
306-
bytesRange: {
307-
start: 1024,
308-
end: 2048
309-
}
310-
}
314+
path: "album/2024/1.jpg"
311315
}).result;
312316
```
313317
</InlineFilter>
@@ -505,7 +509,7 @@ import { downloadData } from 'aws-amplify/storage';
505509

506510
try {
507511
const downloadResult = await downloadData({
508-
path: "/album/2024/1.jpg"
512+
path: "album/2024/1.jpg"
509513
}).result;
510514
const text = await downloadResult.body.text();
511515
// Alternatively, you can use `downloadResult.body.blob()`
@@ -569,6 +573,45 @@ let resultSink = downloadTask
569573
</InlineFilter>
570574

571575
<InlineFilter filters={["react", "angular", "javascript", "vue", "nextjs", "react-native"]}>
576+
577+
### Download from a specified bucket
578+
579+
You can also perform an upload operation to a specific bucket by providing the `bucket` option. You can pass in a string representing the target bucket's assigned name in Amplify Backend.
580+
581+
```ts
582+
import { downloadData } from 'aws-amplify/storage';
583+
584+
const result = await downloadData({
585+
path: 'album/2024/1.jpg',
586+
options: {
587+
// highlight-start
588+
// Specify a target bucket using name assigned in Amplify Backend
589+
bucket: 'assignedNameInAmplifyBackend'
590+
// highlight-end
591+
}
592+
}).result;
593+
594+
```
595+
Alternatively, you can also pass in an object by specifying the bucket name and region from the console.
596+
597+
```ts
598+
import { downloadData } from 'aws-amplify/storage';
599+
600+
const result = await downloadData({
601+
path: 'album/2024/1.jpg',
602+
options: {
603+
// highlight-start
604+
// Alternatively, provide bucket name from console and associated region
605+
bucket: {
606+
bucketName: 'bucket-name-from-console',
607+
region: 'us-east-2'
608+
}
609+
// highlight-end
610+
}
611+
}).result;
612+
613+
```
614+
572615
### Monitor download progress
573616
574617
```javascript
@@ -577,7 +620,7 @@ import { downloadData } from 'aws-amplify/storage';
577620
// Download a file from S3 bucket
578621
const { body, eTag } = await downloadData(
579622
{
580-
path: "/album/2024/1.jpg",
623+
path: 'album/2024/1.jpg',
581624
options: {
582625
onProgress: (progress) {
583626
console.log(`Download progress: ${(progress.transferredBytes/progress.totalBytes) * 100}%`);
@@ -592,7 +635,7 @@ const { body, eTag } = await downloadData(
592635
```javascript
593636
import { downloadData, isCancelError } from 'aws-amplify/storage';
594637
595-
const downloadTask = downloadData({ path: "/album/2024/1.jpg" });
638+
const downloadTask = downloadData({ path: 'album/2024/1.jpg' });
596639
downloadTask.cancel();
597640
try {
598641
await downloadTask.result;
@@ -602,6 +645,7 @@ try {
602645
}
603646
}
604647
```
648+
605649
</InlineFilter>
606650
607651
<InlineFilter filters={["android"]}>
@@ -905,12 +949,32 @@ Download tasks are run using `URLSessionTask` instances internally. You can lear
905949
<InlineFilter filters={["react", "angular", "javascript", "vue", "nextjs", "react-native"]}>
906950

907951
### More download options
952+
The behavior of the `downloadData` API can be customized by passing in options.
953+
954+
```javascript
955+
import { downloadData } from 'aws-amplify/storage';
956+
957+
// Downloads file content to memory
958+
const { body, eTag } = await downloadData({
959+
path: "album/2024/1.jpg",
960+
options: {
961+
// optional bytes range parameter to download a part of the file, the 2nd MB of the file in this example
962+
bytesRange: {
963+
start: 1024,
964+
end: 2048
965+
},
966+
useAccelerateEndpoint: true,
967+
}
968+
}).result;
969+
970+
```
908971

909-
Option | Type | Description | Reference Links |
910-
| -- | -- | ----------- | -- |
911-
| useAccelerateEndpoint | boolean | Whether to use accelerate endpoint. | [Transfer Acceleration](/[platform]/build-a-backend/storage/extend-s3-resources/#example---enable-transfer-acceleration) |
912-
| bytesRange | \{ start: number; end:number; \} | bytes range parameter to download a part of the file. | |
913-
| onProgress | callback | Callback function tracking the upload/download progress. | |
972+
Option | Type | Default | Description |
973+
| :--: | :--: | :--: | ----------- |
974+
| bucket | string \| <br />\{ bucketName: string;<br/> region: string; \} | Default bucket and region from Amplify configuration | A string representing the target bucket's assigned name in Amplify Backend or an object specifying the bucket name and region from the console.<br/><br/>Read more at [Configure additional storage buckets](/[platform]/build-a-backend/storage/set-up-storage/#configure-additional-storage-buckets) |
975+
| onProgress | callback | — | Callback function tracking the upload/download progress. |
976+
| bytesRange | \{ start: number; end:number; \} | — | Bytes range parameter to download a part of the file. |
977+
| useAccelerateEndpoint | boolean | false | Whether to use accelerate endpoint.<br/><br/>Read more at [Transfer Acceleration](/[platform]/build-a-backend/storage/extend-s3-resources/#example---enable-transfer-acceleration) |
914978
915979
## Frequently Asked Questions
916980

0 commit comments

Comments
 (0)