javascript - 如何从 ClientSide javascript 将资产上传到 AWS presignedurl

Question

我正在使用 presignedUrl 方法上传一个大文件。

我从我的角度代码调用一个 API 到服务器端，它给了我 presignedUrl ，然后我需要上传一个 URL 。

我对此有一些疑问

1) 我的 Angular 端是否需要 AWS SDK？

我假设我不需要它，我只是将 PUT 请求发送到未签名的 URL 和文件

  uploadfileAWSS3old(e,f){    

    const formData = new FormData();
    formData.append("data",JSON.stringify({name:"testname"}));
    formData.append("file", f.files[0]);

    let contentType = f.files["0"].type;

     const headers = new HttpHeaders(
       {
         'Content-Type': contentType
        });
     const req = new HttpRequest('PUT',this.URL,formData,
     {
       headers: headers,
       reportProgress: true, //This is required for track upload process
     });

     console.log(req)
      this.http.request(req)
        .subscribe(event=>{
          console.log(event)
        })

    }

但得到错误

SignatureDoesNotMatch我们计算的请求签名与您提供的签名不匹配。检查您的密钥和签名方法。ASIAU7D2TEMAFBDCV3P5PUT

image/jpeg 1533112061 x-amz-acl:authenticated-read x-amz-security-token:FQoGZXIvYXdzEBoaDAqHuJwkAGpv42+GiiL5AeMmnOw3lETTKkYJNrcAC9BWzOuG0NW40sdXNqhYQWvNYacXZPUP8cXt2EQ/a95bMalAoUA1ZwF5U2H6wrjltrYmKkhOArtRuQ/E556o8hOfYts3l62AufhCEN+xr1ZoaX/uBIQMjhLTypP96rNesPc5cp9eT3CEG2tXa6q3nD6DaBh6tqX9ECTaoGAQHcW0Qm3oP+iIilUfft+7HmDc7ml6IH9utJwtJdfYuC6+v4fAcIhp60flapB8DIusKdvUumD1bik4WgXCsxSF4KyzPC0n1QdugXFb9EzYuXN1juXO3HQsYiVXkHMxByB5trMXkTsDBfw4uOAViij41oXbBQ== /iclp-camp-qa.recipients.us -west-2/2b6224b9-8f33-48e8-8188-34149a659bea.cjk7zh9l9000001ozon5ziuik.cjkausvhx000001qe7jlssdu8。csvbzCxrflT/R7JzMcXcFccr3nrFCo=50 55 54 0a 0a 69 6d 61 67 65 2f 6a 70 65 67 0a 31 35 33 33 31 31 32 30 36 31 0a 78 2d 61 6d 7a 2d 61 63 6c 3a 61 75 74 68 65 6e 74 69 63 61 74 65 64 2d 72 65 61 64 0a 78 2d 61 6d 7a 2d 73 65 63 75 72 69 74 79 2d 74 6f 6b 65 6e 3a 46 51 6f 47 5a 58 49 76 59 58 64 7a 45 42 6f 61 44 41 71 48 75 4A 77 6B 41 47 70 76 34 32 2B 47 69 69 69 69 4C 35 41 65 4D 6D 6E 4F 77 33 6C 45 54 54 54 4B 6B 6B 59 4A 4E 4A 4E 72 63 41 41 41 43 43 43 39 42 42 57 7A 4F 75 47 a 4f 75 47 f 75 47 30 47 30 34 33 34 30 34 30 34 30 34 30 34 30 73 64 58 4E 71 68 59 51 51 57 76 4E 59 61 61 63 58 5A 50 55 50 38 63 58 63 58 74 32 45 51 2F 61 39 39 39 35 62 4D 61 61 6C 41 6C 41 6F 55 41 31 31 31 31 5A 77 46 35 55 32 48 32 48 32 48 36 77 77 72 6A 77 77 72 6A 6C 74 72 59 6D 4B 6B 68 4F 41 72 74 52 75 51 2F 45 35 35 35 36 6F 38 68 4F 66 59 74 74 74 73 33 33 33 6C 36 32 41 75 66 66 68 43 43 43 43 43 43 43 43 45 4E 2B 78 78 72 31 5A 61 5A 61 5A 61 5A 61 5A 61 58 2F 75 42 F 75 42 42 49 51 4d 6a 68 4c 54 79 70 50 39 36 72 4e 65 73 50 63 35 63 70 39 6554 33 43 45 47 32 74 58 61 36 71 33 6e 44 36 44 61 42 68 36 74 71 58 39 45 43 54 61 6f 47 41 51 48 63 57 30 51 6d 33 6f 50 2b 69 49 69 6c 55 66 66 74 2B 37 48 6D 44 63 37 6D 6C 36 49 49 48 39 75 74 4A 4A 77 74 4A 64 64 64 64 66 59 75 43 36 2B 76 34 66 34 66 41 63 49 68 70 366 366 30 66 66 6C 61 61 70 75 6D 44 31 62 69 6B 34 57 67 58 43 73 73 78 53 46 34 34 4B 79 7A 50 43 30 6E 31 51 64 75 67 58 46 62 39 45 7A 59 45 7A 59 75 58 58 4E 56 58 6B 48 4D 78 42 79 42 35 74 74 72 4D 58 6B 54 73 44 44 42 66 77 34 77 34 75 4F 41 56 69 69 69 69 69 69 6A 34 34 31 6F 58 62 42 42 42 42 42 42 3D 3D 3D 3D 3D 3D 3D 3D 3D 0A 2F 69 69 69 6C 6C 70 2D 63 63 63 61 61 61 61 6D 70 70 70 70 2D 70 70 71 61 2e 72 65 63 69 70 69 65 6e 74 73 2e 75 73 2d 77 65 73 74 2d 32 2f 32 62 36 32 32 34 62 39 2d 38 66 33 33 2d 34 38 65 38 2d 38 31 38 38 2d 33 34 31 34 39 61 36 35 39 62 65 61 2e 63 6a 6b 37 7a 68 39 6c 39 30 30 30 30 30 31 6f 7a6f 6e 35 7a 69 75 69 6b 2e 63 6a 6b 61 75 73 76 68 78 30 30 30 30 30 31 71 65 37 6a 6c 73 73 64 75 38 2e 63 73 76750CAACBFE902B69CLf4hUHXcMFdTG8JqYtnxHUGZqiDhv17n3/qSFG3c8PtJYMhizUkAnOSIMypVzX0EEUl28ZCN2M=

标签： javascriptangularamazon-web-servicesaws-sdkpre-signed-url