如何解决在使用Angular上传AWS期间发生的错误？

时间：2019-02-20 10:20:25

标签： amazon-web-services angular6

如何减少使用Angular 6将图像上传到s3存储桶时发生的以下错误。它显示了以下错误。 我曾使用aws-SDK模块将图像或文件上传到aws的s3存储桶。 我正在使用angular6.2.0版本。 我得到的错误是：

PUT https://youtube-images-777.s3.amazonaws.com/ai2.png 400 (Bad Request)
zone.js:3243 PUT https://youtube-images-777.s3.amazonaws.com/ai2.png 403 (Forbidden)
scheduleTask @ zone.js:3243
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ zone.js:410
onScheduleTask @ zone.js:301
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ zone.js:404
push../node_modules/zone.js/dist/zone.js.Zone.scheduleTask @ zone.js:238
push../node_modules/zone.js/dist/zone.js.Zone.scheduleMacroTask @ zone.js:261
scheduleMacroTaskWithCurrentZone @ zone.js:1245
(anonymous) @ zone.js:3276
proto.(anonymous function) @ zone.js:1569
handleRequest @ xhr.js:81
executeSend @ event_listeners.js:334
SEND @ event_listeners.js:348
callListeners @ sequential_executor.js:102
emit @ sequential_executor.js:78
emit @ request.js:683
transition @ request.js:22
runTo @ state_machine.js:14
(anonymous) @ state_machine.js:26
(anonymous) @ request.js:38
(anonymous) @ request.js:685
callListeners @ sequential_executor.js:116
callNextListener @ sequential_executor.js:96
(anonymous) @ event_listeners.js:233
finish @ config.js:350
(anonymous) @ config.js:368
get @ credentials.js:127
getAsyncCredentials @ config.js:362
getCredentials @ config.js:382
SIGN @ event_listeners.js:204
callListeners @ sequential_executor.js:102
callNextListener @ sequential_executor.js:96
discoverEndpoint @ discover_endpoint.js:326
callListeners @ sequential_executor.js:102
emit @ sequential_executor.js:78
emit @ request.js:683
transition @ request.js:22
runTo @ state_machine.js:14
(anonymous) @ state_machine.js:26
(anonymous) @ request.js:38
(anonymous) @ request.js:685
callListeners @ sequential_executor.js:116
callNextListener @ sequential_executor.js:96
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:423
onInvokeTask @ core.js:14051
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:422
push../node_modules/zone.js/dist/zone.js.Zone.runTask @ zone.js:195
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask @ zone.js:498
ZoneTask.invoke @ zone.js:487
timer @ zone.js:2281
setTimeout (async)
scheduleTask @ zone.js:2302
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ zone.js:410
onScheduleTask @ zone.js:301
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ zone.js:404
push../node_modules/zone.js/dist/zone.js.Zone.scheduleTask @ zone.js:238
push../node_modules/zone.js/dist/zone.js.Zone.scheduleMacroTask @ zone.js:261
scheduleMacroTaskWithCurrentZone @ zone.js:1245
(anonymous) @ zone.js:2317
proto.(anonymous function) @ zone.js:1569
RESET_RETRY_STATE @ event_listeners.js:470
callListeners @ sequential_executor.js:102
emit @ sequential_executor.js:78
emit @ request.js:683
transition @ request.js:22
runTo @ state_machine.js:14
(anonymous) @ state_machine.js:26
(anonymous) @ request.js:38
(anonymous) @ request.js:685
callListeners @ sequential_executor.js:116
callNextListener @ sequential_executor.js:96
reqRegionForNetworkingError @ s3.js:638
callListeners @ sequential_executor.js:102
emit @ sequential_executor.js:78
emit @ request.js:683
transition @ request.js:22
runTo @ state_machine.js:14
(anonymous) @ state_machine.js:26
(anonymous) @ request.js:38
(anonymous) @ request.js:685
callListeners @ sequential_executor.js:116
callNextListener @ sequential_executor.js:96
requestBucketRegion @ s3.js:609
callListeners @ sequential_executor.js:102
emit @ sequential_executor.js:78
emit @ request.js:683
transition @ request.js:22
runTo @ state_machine.js:14
(anonymous) @ state_machine.js:26
(anonymous) @ request.js:38
(anonymous) @ request.js:685
callListeners @ sequential_executor.js:116
emit @ sequential_executor.js:78
emit @ request.js:683
transition @ request.js:22
runTo @ state_machine.js:14
(anonymous) @ state_machine.js:26
(anonymous) @ request.js:38
(anonymous) @ request.js:685
callListeners @ sequential_executor.js:116
callNextListener @ sequential_executor.js:96
onEnd @ event_listeners.js:299
push../node_modules/aws-sdk/node_modules/events/events.js.EventEmitter.emit @ events.js:78
finishRequest @ xhr.js:124
(anonymous) @ xhr.js:39
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:423
onInvokeTask @ core.js:14051
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:422
push../node_modules/zone.js/dist/zone.js.Zone.runTask @ zone.js:195
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask @ zone.js:498
invokeTask @ zone.js:1744
globalZoneAwareCallback @ zone.js:1770
XMLHttpRequest.send (async)
scheduleTask @ zone.js:3243
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ zone.js:410
onScheduleTask @ zone.js:301
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ zone.js:404
push../node_modules/zone.js/dist/zone.js.Zone.scheduleTask @ zone.js:238
push../node_modules/zone.js/dist/zone.js.Zone.scheduleMacroTask @ zone.js:261
scheduleMacroTaskWithCurrentZone @ zone.js:1245
(anonymous) @ zone.js:3276
proto.(anonymous function) @ zone.js:1569
handleRequest @ xhr.js:81
executeSend @ event_listeners.js:334
SEND @ event_listeners.js:348
callListeners @ sequential_executor.js:102
emit @ sequential_executor.js:78
emit @ request.js:683
transition @ request.js:22
runTo @ state_machine.js:14
(anonymous) @ state_machine.js:26
(anonymous) @ request.js:38
(anonymous) @ request.js:685
callListeners @ sequential_executor.js:116
callNextListener @ sequential_executor.js:96
(anonymous) @ event_listeners.js:233
finish @ config.js:350
(anonymous) @ config.js:368
get @ credentials.js:127
getAsyncCredentials @ config.js:362
getCredentials @ config.js:382
SIGN @ event_listeners.js:204
callListeners @ sequential_executor.js:102
callNextListener @ sequential_executor.js:96
discoverEndpoint @ discover_endpoint.js:326
callListeners @ sequential_executor.js:102
emit @ sequential_executor.js:78
emit @ request.js:683
transition @ request.js:22
runTo @ state_machine.js:14
(anonymous) @ state_machine.js:26
(anonymous) @ request.js:38
(anonymous) @ request.js:685
callListeners @ sequential_executor.js:116
emit @ sequential_executor.js:78
emit @ request.js:683
transition @ request.js:22
runTo @ state_machine.js:14
(anonymous) @ state_machine.js:26
(anonymous) @ request.js:38
(anonymous) @ request.js:685
callListeners @ sequential_executor.js:116
emit @ sequential_executor.js:78
emit @ request.js:683
transition @ request.js:22
runTo @ state_machine.js:14
(anonymous) @ state_machine.js:26
(anonymous) @ request.js:38
(anonymous) @ request.js:685
callListeners @ sequential_executor.js:116
callNextListener @ sequential_executor.js:96
(anonymous) @ event_listeners.js:86
finish @ config.js:350
(anonymous) @ config.js:368
(anonymous) @ credentials.js:124
(anonymous) @ credentials.js:212
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:423
onInvokeTask @ core.js:14051
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:422
push../node_modules/zone.js/dist/zone.js.Zone.runTask @ zone.js:195
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask @ zone.js:498
ZoneTask.invoke @ zone.js:487
timer @ zone.js:2281
setTimeout (async)
scheduleTask @ zone.js:2302
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ zone.js:410
onScheduleTask @ zone.js:301
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ zone.js:404
push../node_modules/zone.js/dist/zone.js.Zone.scheduleTask @ zone.js:238
push../node_modules/zone.js/dist/zone.js.Zone.scheduleMacroTask @ zone.js:261
scheduleMacroTaskWithCurrentZone @ zone.js:1245
(anonymous) @ zone.js:2317
proto.(anonymous function) @ zone.js:1569
defer @ util.js:908
(anonymous) @ credentials.js:211
arrayEach @ util.js:493
onLoad @ credentials.js:206
(anonymous) @ cognito_identity_credentials.js:266
(anonymous) @ request.js:364
callListeners @ sequential_executor.js:106
emit @ sequential_executor.js:78
emit @ request.js:683
transition @ request.js:22
runTo @ state_machine.js:14
(anonymous) @ state_machine.js:26
(anonymous) @ request.js:38
(anonymous) @ request.js:685
callListeners @ sequential_executor.js:116
emit @ sequential_executor.js:78
emit @ request.js:683
transition @ request.js:22
runTo @ state_machine.js:14
(anonymous) @ state_machine.js:26
(anonymous) @ request.js:38
(anonymous) @ request.js:685
callListeners @ sequential_executor.js:116
emit @ sequential_executor.js:78
emit @ request.js:683
transition @ request.js:22
runTo @ state_machine.js:14
(anonymous) @ state_machine.js:26
(anonymous) @ request.js:38
(anonymous) @ request.js:685
callListeners @ sequential_executor.js:116
emit @ sequential_executor.js:78
emit @ request.js:683
transition @ request.js:22
runTo @ state_machine.js:14
(anonymous) @ state_machine.js:26
(anonymous) @ request.js:38
(anonymous) @ request.js:685
callListeners @ sequential_executor.js:116
callNextListener @ sequential_executor.js:96
onEnd @ event_listeners.js:299
push../node_modules/aws-sdk/node_modules/events/events.js.EventEmitter.emit @ events.js:78
finishRequest @ xhr.js:124
(anonymous) @ xhr.js:39
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:423
onInvokeTask @ core.js:14051
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:422
push../node_modules/zone.js/dist/zone.js.Zone.runTask @ zone.js:195
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask @ zone.js:498
invokeTask @ zone.js:1744
globalZoneAwareCallback @ zone.js:1770
XMLHttpRequest.send (async)
scheduleTask @ zone.js:3243
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ zone.js:410
onScheduleTask @ zone.js:301
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ zone.js:404
push../node_modules/zone.js/dist/zone.js.Zone.scheduleTask @ zone.js:238
push../node_modules/zone.js/dist/zone.js.Zone.scheduleMacroTask @ zone.js:261
scheduleMacroTaskWithCurrentZone @ zone.js:1245
(anonymous) @ zone.js:3276
proto.(anonymous function) @ zone.js:1569
handleRequest @ xhr.js:81
executeSend @ event_listeners.js:334
SEND @ event_listeners.js:348
callListeners @ sequential_executor.js:102
emit @ sequential_executor.js:78
emit @ request.js:683
transition @ request.js:22
runTo @ state_machine.js:14
(anonymous) @ state_machine.js:26
(anonymous) @ request.js:38
(anonymous) @ request.js:685
callListeners @ sequential_executor.js:116
callNextListener @ sequential_executor.js:96
discoverEndpoint @ discover_endpoint.js:328
callListeners @ sequential_executor.js:102
emit @ sequential_executor.js:78
emit @ request.js:683
transition @ request.js:22
runTo @ state_machine.js:14
(anonymous) @ state_machine.js:26
(anonymous) @ request.js:38
(anonymous) @ request.js:685
callListeners @ sequential_executor.js:116
callNextListener @ sequential_executor.js:96
(anonymous) @ event_listeners.js:149
(anonymous) @ util.js:725
hash @ util.js:457
sha256 @ util.js:408
computeSha256 @ util.js:723
COMPUTE_SHA256 @ event_listeners.js:143
callListeners @ sequential_executor.js:102
emit @ sequential_executor.js:78
emit @ request.js:683
transition @ request.js:22
runTo @ state_machine.js:14
(anonymous) @ state_machine.js:26
(anonymous) @ request.js:38
(anonymous) @ request.js:685
callListeners @ sequential_executor.js:116
emit @ sequential_executor.js:78
emit @ request.js:683
transition @ request.js:22
runTo @ state_machine.js:14
(anonymous) @ state_machine.js:26
(anonymous) @ request.js:38
(anonymous) @ request.js:685
callListeners @ sequential_executor.js:116
emit @ sequential_executor.js:78
emit @ request.js:683
transition @ request.js:22
runTo @ state_machine.js:14
runTo @ request.js:403
send @ request.js:367
makeUnauthenticatedRequest @ service.js:230
getCredentialsForIdentity @ cognitoidentity.js:13
getCredentialsForIdentity @ cognito_identity_credentials.js:258
(anonymous) @ cognito_identity_credentials.js:175
getId @ cognito_identity_credentials.js:227
load @ cognito_identity_credentials.js:172
coalesceRefresh @ credentials.js:205
refresh @ cognito_identity_credentials.js:160
get @ credentials.js:122
getAsyncCredentials @ config.js:362
getCredentials @ config.js:382
VALIDATE_CREDENTIALS @ event_listeners.js:81
callListeners @ sequential_executor.js:102
emit @ sequential_executor.js:78
emit @ request.js:683
transition @ request.js:22
runTo @ state_machine.js:14
runTo @ request.js:403
send @ request.js:367
nextChunk @ managed_upload.js:473
fillBuffer @ managed_upload.js:403
send @ managed_upload.js:199
upload @ s3.js:1080
push../src/app/aws/aws.component.ts.AwsComponent.fileEvent @ aws.component.ts:36
(anonymous) @ AwsComponent.html:3
handleEvent @ core.js:19545
callWithDebugContext @ core.js:20639
debugHandleEvent @ core.js:20342
dispatchEvent @ core.js:16994
(anonymous) @ core.js:17441
(anonymous) @ platform-browser.js:993
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:423
onInvokeTask @ core.js:14051
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask @ zone.js:422
push../node_modules/zone.js/dist/zone.js.Zone.runTask @ zone.js:195
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask @ zone.js:498
invokeTask @ zone.js:1744
globalZoneAwareCallback @ zone.js:1770
aws.component.ts:40 AccessDenied: Access Denied
    at Request.extractError (http://localhost:4200/vendor.js:80023:35)
    at Request.callListeners (http://localhost:4200/vendor.js:77941:20)
    at Request.emit (http://localhost:4200/vendor.js:77913:10)
    at Request.emit (http://localhost:4200/vendor.js:76546:14)
    at Request.transition (http://localhost:4200/vendor.js:75885:10)
    at AcceptorStateMachine.runTo (http://localhost:4200/vendor.js:81632:12)
    at http://localhost:4200/vendor.js:81644:10
    at Request.<anonymous> (http://localhost:4200/vendor.js:75901:9)
    at Request.<anonymous> (http://localhost:4200/vendor.js:76548:12)
    at Request.callListeners (http://localhost:4200/vendor.js:77951:18) "there was an error uploading your file"

import { Component, OnInit } from "@angular/core";
import * as AWS from "aws-sdk";

@Component({
  selector: "app-aws",
  templateUrl: "./aws.component.html",
  styleUrls: ["./aws.component.css"]
})
export class AwsComponent implements OnInit {
  constructor() {}

  ngOnInit() {}

  fileEvent(fileInput: any) {
    const AWSService = AWS;
    console.log(AWSService);
    const region = "***********";
    const bucketName = "***************";
    const IdentityPoolId = "**********************";
    const file = fileInput.target.files[0];
    //Configures the AWS service and initial authorization
    AWSService.config.update({
      region: region,
      credentials: new AWSService.CognitoIdentityCredentials({
        IdentityPoolId: IdentityPoolId
      })
    });
    //adds the S3 service, make sure the api version and bucket are correct
    const s3 = new AWSService.S3({
      apiVersion: "2006-03-01",
      params: { Bucket: bucketName }
    });
    //I store this in a variable for retrieval later
    const image = file.name;
    console.log(image);
    s3.upload(
      { Key: file.name, Bucket: bucketName, Body: file, ACL: "public-read" },
      function(err, data) {
        if (err) {
          console.log(err, "there was an error uploading your file");
        }
      }
    );
  }
}

1 个答案:

答案 0 :(得分：1)

该错误明确指出这是一个权限问题。检查您的策略以获取Cognito身份验证用户，并将get和put对象权限授予正确的s3存储桶。

相关问题
最新问题