S3ブラウザから事前に署名されたURLで画像をアップロードします。

ブラウザからs3バケットにデータをアップロードしようとしています。私は事前に署名されたURLを生成しましたが、私は403禁止された応答を取得します。S3ブラウザから事前に署名されたURLで画像をアップロードします。

私のサーバー・コードは

const s3 = new AWS.S3({ 
    accessKeyId: settings.resourceBucketKey, 
    secretAccessKey: settings.resourceBucketSecret, 
    region: 'eu-west-1' 
}) 

const params = { 
    Bucket: 'my-bucket', 
    Key: 'photo.png', 
    ContentType: 'image/png', 
    ACL: 'authenticated-read', 
} 

const url = s3.getSignedUrl('putObject', params) 

console.log(url)

私のクライアントコードは（生成されたURLを使用して）であると私はバケットにCORSをオンに設定している

const input = $('#myinput') 

     input.on('change', (res) => { 
     var theFormFile = $('#myinput').get()[0].files[0]; 

     $.ajax({ 
      url: url, 
      type: 'PUT', 
      contentType: 'image/png', 
      processData: false, 
      data: theFormFile, 
     }).success(function(){ 
      alert('success') 
     }) 
     }, false)

です：

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

しかし、私はまだ403の応答を禁止されています。アップロードしようとしている画像は「photo.png」です。私はここに何かを逃していますか

出典

2016-09-16 wazzaday

事前署名されたURLの作成者（あなた）は、ファイルをアップロードするためにS3バケットにアクセスできる権限が必要です。事前に署名したURLを使用すると、URLで特定されたオブジェクトにアクセスすることができます

、は事前に署名したURLの作成者がアクセス、そのオブジェクトへのアクセス権を持っていることを提供する：これは、より雄弁S3 documentationに記載されています。つまり、オブジェクトをアップロードするために事前に署名されたURLを受け取った場合は、の署名済みURLの作成者がそのオブジェクトをアップロードするために必要な権限を持っている場合にのみオブジェクトをアップロードできます。

事前署名されたURLを作成しているIAMユーザーに、必要な権限があることを確認してください。

出典

2016-09-18 20:55:30 jbird

ありがとう、これはまさに問題でした。 – wazzaday

ブラウザから署名付きURLを取得することの完全な実装 - お楽しみください！

<body> 
    <img height="200" width="200"> 
    <script> 

    var mimes = { 
     'jpeg': 'data:image/jpeg;base64,' 
    }; 

     AWS.config.update({ 
      signatureVersion: 'v4', 
      region: 'us-east-1', 
      accessKeyId: '', 
      secretAccessKey: '' 
     }); 

     var bucket = new AWS.S3({params: {Bucket: 'xxxx'}}); 

     function encode(data) 
     { 
      var str = data.reduce(function(a,b){ return a+String.fromCharCode(b) },''); 
      return btoa(str).replace(/.{76}(?=.)/g,'$&\n'); 
     } 

     function getUrlByFileName(fileName,mimeType) { 
      return new Promise(
       function (resolve, reject) { 
        bucket.getObject({Key: fileName}, function (err, file) { 
         var result = mimeType + encode(file.Body); 
         resolve(result) 
        }); 
       } 
     ); 
     } 

     function openInNewTab(url) { 
      var redirectWindow = window.open(url, '_blank'); 
      redirectWindow.location; 
     } 

     getUrlByFileName('sprites.png', mimes.jpeg).then(function(data) { 
      //openInNewTab(data); 
      document.querySelector('img').src = data; 
     }); 

    </script> 
</body>

出典

2018-01-10 15:23:09

を追加することを忘れないでください - –

S3ブラウザから事前に署名されたURLで画像をアップロードします。

答えて

関連する問題