Angular JSを使用してAmazon S3プライベートバケットから画像を取得

-1

私は自分のウェブサイトの1つにAngular JSとWEB APIを使用しています。ウェブサイトの要件ごとに、私はバケツに画像を保存するためにAmazon S3を使用しています。Angular JSを使用してAmazon S3プライベートバケットから画像を取得

私は、Amazon S3バケット内で、accesskeyとsecretaccessキーを使用してイメージを動的にアップロードするためにWEB APIを使用しています。

しかし、今回はAngular JSを使用して、アップロードした画像をウェブサイトに表示したいと思います。バケツは公開されていません。

Angular JSを使用してAmazon S3から画像を取得するには、ステップごとのガイドラインで正確なコードを共有してください。

編集（新追加）私は以下のコードを追加した応答に基づいて

： -

$scope.retrieveImage = function() 
{ 
    AWS.config.update({ 
      accessKeyId: "MyAccessKey", secretAccessKey: "MySecretKey" 
     }); 

    var bucket = new AWS.S3({ params: { Bucket: "MyBucket" } }); 

    bucket.getObject({ Key: 'Datetime.png' }, function (err, file) { 
    $scope.imgUrl = ""; 
    }); 
}

私は今、以下のエラーを取得しています： -

レスポンスプリフライト要求がアクセス制御チェックを通過しない：いいえ要求された「アクセス制御許可の原点」ヘッダーが存在するリソース。したがって、オリジン 'http://localhost:PortNumber'は許可されません。応答は、HTTPステータスコード403

を持っていた私はMyBucketの許可の内側に、次のCORS設定を追加しました： -

<?xml version="1.0" encoding="UTF-8"?> 
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/"> 
<CORSRule> 
    <AllowedOrigin>*</AllowedOrigin> 
    <AllowedMethod>GET</AllowedMethod> 
    <MaxAgeSeconds>3000</MaxAgeSeconds> 
    <AllowedHeader>Authorization</AllowedHeader> 
</CORSRule> 
</CORSConfiguration>

私はこの上で行われるために何を教えてください？

解決策： - 次のCORSタグを<AllowedHeader>*</AllowedHeader>に改訂すると、charmのように動作します。すべてのあなたの応答をありがとう。

出典

2017-10-03 user1843970

キーワード「signed URL S3」を検索します。私はここで良い説明を見つけたhttps://coderwall.com/p/mtcskq/signing-amazon-s3-urls –