Need to configure your backend?See Build a Backend →
ファイルのダウンロード
アプリ内の体験をさらにカスタマイズするには、Amplify Library for StorageからgetUrlまたはdownloadData APIを使用できます。
URLからファイルを取得またはダウンロードする
getUrl APIを使用すると、デフォルトで900秒または15分間有効な署名付きURLを取得できます。このURLを使用して、ユーザーがクリックするためのダウンロードリンクを作成できます。expiresAtプロパティはURLが期限切れになる時間を表すDateオブジェクトです。
import { getUrl } from 'aws-amplify/storage';
const linkToStorageFile = await getUrl({ path: "album/2024/1.jpg", // または、path: ({identityId}) => `album/${identityId}/1.jpg`});console.log('署名付きURL: ', linkToStorageFile.url);console.log('URLの有効期限: ', linkToStorageFile.expiresAt);テンプレートまたはJSXコード内では、urlプロパティを使用してファイルへのリンクを作成できます:
<a href={linkToStorageFile.url.toString()} target="_blank" rel="noreferrer"> {fileName} </a>getUrlのその他のオプション
getUrl APIの動作は、オプションを渡すことでカスタマイズできます。
import { getUrl } from 'aws-amplify/storage';
const linkToStorageFile = await getUrl({ path: "album/2024/1.jpg", options: { // Amplify Backendで割り当てられた名前を使用してターゲットバケットを指定 bucket: 'assignedNameInAmplifyBackend', // オブジェクトが存在することを確認してからURLを取得 validateObjectExistence: true, // URLの有効期限(秒単位) expiresIn: 300, // アクセラレートエンドポイントを使用するかどうか useAccelerateEndpoint: true, // リクエストされたバケットを所有するアカウントID expectedBucketOwner: '123456789012', }});| オプション | タイプ | デフォルト | 説明 |
|---|---|---|---|
| method | 'GET' | 'PUT' | 'GET' | 署名付きURLのHTTPメソッド。'GET'はオブジェクトをダウンロードするためのURLを生成します。'PUT'はオブジェクトをアップロードするためのURLを生成します。 署名付きURLを使用したアップロードを参照してください |
| bucket | string | { bucketName: string; region: string; } | Amplify設定のデフォルトバケットとリージョン | Amplify Backendのターゲットバケットのアサイン名を表す文字列、またはコンソールから指定されたバケット名とリージョンを指定するオブジェクト。 追加ストレージバケットの構成を参照してください |
| validateObjectExistence | boolean | false | ダウンロード前にオブジェクトが存在することを確認するためにheadオブジェクトを実行するかどうか。 |
| expiresIn | number | 900 | URLが期限切れになるまでの秒数。 署名付きURLの有効期限はセッションに依存し、最大1時間になります。 |
| useAccelerateEndpoint | boolean | false | アクセラレートエンドポイントを使用するかどうか。 転送高速化を参照してください |
| expectedBucketOwner | string | オプション | リクエストされたバケットを所有するアカウントID。 |
ファイルへのダウンロード
downloadData APIを使用してファイルをローカルにダウンロードします。
import { downloadData } from 'aws-amplify/storage';
// ファイルコンテンツをメモリにダウンロードconst { body, eTag } = await downloadData({ path: "album/2024/1.jpg"}).result;ダウンロードされたファイルのテキスト値を取得
ファイルの値は、blob、json、またはtextの3つの形式で取得できます。bodyプロパティのそれぞれのメソッドを呼び出して、それぞれの形式でデータを取得できます。
import { downloadData } from 'aws-amplify/storage';
try { const downloadResult = await downloadData({ path: "album/2024/1.jpg" }).result; const text = await downloadResult.body.text(); // または、`downloadResult.body.blob()`を使用することもできます // または`downloadResult.body.json()`でボディをBlobまたはJSON形式で読み込みます。 console.log('成功: ', text);} catch (error) { console.log('エラー: ', error);}指定されたバケットからダウンロード
bucketオプションを指定して、特定のバケットにアップロード操作を実行することもできます。Amplify Backendでアサインされたターゲットバケットのアサイン名を表す文字列を渡すことができます。
import { downloadData } from 'aws-amplify/storage';
const result = await downloadData({ path: 'album/2024/1.jpg', options: { // Amplify Backendで割り当てられた名前を使用してターゲットバケットを指定 bucket: 'assignedNameInAmplifyBackend' }}).result;あるいは、コンソールからバケット名とリージョンを指定してオブジェクトを渡すこともできます。
import { downloadData } from 'aws-amplify/storage';
const result = await downloadData({ path: 'album/2024/1.jpg', options: { // または、コンソールからバケット名と関連リージョンを指定 bucket: { bucketName: 'bucket-name-from-console', region: 'us-east-2' } }}).result;ダウンロード進捗の監視
import { downloadData } from 'aws-amplify/storage';
// S3バケットからファイルをダウンロードconst { body, eTag } = await downloadData( { path: 'album/2024/1.jpg', options: { onProgress: (progress) => { console.log(`ダウンロード進捗: ${(progress.transferredBytes/progress.totalBytes) * 100}%`); } } }).result;ダウンロードをキャンセル
import { downloadData, isCancelError } from 'aws-amplify/storage';
const downloadTask = downloadData({ path: 'album/2024/1.jpg' });downloadTask.cancel();try { await downloadTask.result;} catch (error) { if (isCancelError(error)) { // タスクキャンセルによってスローされたエラーを処理します。 }}その他のダウンロードオプション
downloadData APIの動作は、オプションを渡すことでカスタマイズできます。
import { downloadData } from 'aws-amplify/storage';
// ファイルコンテンツをメモリにダウンロードconst { body, eTag } = await downloadData({ path: "album/2024/1.jpg", options: { // オプションのバイト範囲パラメータでファイルの一部をダウンロード。この例ではファイルの2番目のMB bytesRange: { start: 1024, end: 2048 }, useAccelerateEndpoint: true, }}).result;| オプション | タイプ | デフォルト | 説明 |
|---|---|---|---|
| bucket | string | { bucketName: string; region: string; } | Amplify設定のデフォルトバケットとリージョン | Amplify Backendのターゲットバケットのアサイン名を表す文字列、またはコンソールから指定されたバケット名とリージョンを指定するオブジェクト。 追加ストレージバケットの構成を参照してください |
| onProgress | callback | — | アップロード/ダウンロード進捗を追跡するコールバック関数。 |
| bytesRange | { start: number; end:number; } | — | ファイルの一部をダウンロードするバイト範囲パラメータ。 |
| useAccelerateEndpoint | boolean | false | アクセラレートエンドポイントを使用するかどうか。 転送高速化を参照してください |
| expectedBucketOwner | string | オプション | リクエストされたバケットを所有するアカウントID。 |
よくある質問
- 画像圧縮またはS3バケット用のCloudFront CDNキャッシングはまだ利用できません。
downloadDataはキャッシュ制御オプションを提供していません。実行時HTTPキャッシング動作に依存しています。キャッシュをバイパスする必要がある場合は、getUrlAPIを使用してファイルをダウンロードするための署名付きURLを作成できます。downloadDataはS3オブジェクトバージョニングをサポートしていません。常に最新バージョンをダウンロードします。