Question

将视频文件上传到s3存储桶时引发错误。我在尝试将视频从本地系统上传到S3存储桶时引发错误。谁能帮助我，进一步进行下去

代码：

uploadVideosToAws(file, type) {
    this.inprogress = true;

    const s3 = new AWS.S3({
      accessKeyId: config.AWS.ACCESS_KEY,
      secretAccessKey: config.AWS.SECRET_ACCESS_KEY
    });

    const date = new Date().getTime();
    s3.upload({
      Bucket: config.AWS.BUCKET,
      ACL: "public-read",
      Key: `videos/${date}_${file.name}`,
      Body: file,
      ContentType: file.type
    }).on('httpUploadProgress', evt => { 
      this.percentDone = Math.round(evt.loaded * 100 / evt.total);
      this.cd.detectChanges();
    }).send((s3Err, data) => {
      if (s3Err) {
        console.log('s3Err', s3Err);
        this.isUploadingFinished = false;
        const OBJ = {
          'isCancel': false,
          'isUploadingFinished': this.isUploadingFinished,
        }
        this.cancel.next(OBJ);
        this.inprogress = false;
        this.cd.detectChanges();
        throw s3Err;

      } else {
        console.log('AWSData', data);

        let videoInfo = {
          // type: 'VIDEO',
          video_title: this.VideoTitle,
          video_description: this.VideoDesc,
          video_url: data.Key,
          lecture_id: this.lecture_id
        }

        if (this.status === 'ADD-VIDEO') {
          this.authService.addVideoContent(videoInfo).subscribe((response: any) => {
            console.log(this.status, { videoInfo });
            this.isUploadingFinished = false;
            const OBJ = {
              'isCancel': false,
              'isUploadingFinished': this.isUploadingFinished,
            }
            this.cancel.next(OBJ);
            this.lectureContentComponent.getLectureContent();
            this.inprogress = false;
            this.cd.detectChanges();
          });

        } else if (this.status === 'EDIT-VIDEO') {
          console.log(this.status, { videoInfo });
          this.authService.editVideoContent(this.selectedVideoForEdit.id, videoInfo).subscribe((response: any) => {
            this.removeVideoFromAws();
            this.isUploadingFinished = false;
            const OBJ = {
              'isCancel': false,
              'isUploadingFinished': this.isUploadingFinished,
            }
            this.cancel.next(OBJ);
            this.lectureContentComponent.getLectureContent();
            this.inprogress = false;
            this.cd.detectChanges();
          });
        }
      }
    });


  }


  /* this function is use to delete a uploaded video from AWS */
  removeVideoFromAws() {
    const s3 = new AWS.S3({
      accessKeyId: config.AWS.ACCESS_KEY,
      secretAccessKey: config.AWS.SECRET_ACCESS_KEY
    });
    const params = {
      Bucket: config.AWS.BUCKET,
      Key: `${this.selectedVideoForEdit.video_url}`,
    };

    s3.deleteObject(params, (err, data) => {
      if (err)
        console.log(err, err.stack);
      else {
        console.log("VIDEO DELETED FROM AWS...");
      }
    });
  }





  /* this function is use to cancle uploading */
  cancelUploading(is_upload_cancel) {
    if (is_upload_cancel) {
      this.isUploading = !this.isUploading;
      const OBJ = {
        'isCancel': false,
        'isUploading': this.isUploading
      }
      this.cancel.next(OBJ);
      this.destroy$.next(true);
      this.initUploadData();
    }
  }


  onCancelUploading(event) {
    this.isUploadingFinished = event.isUploadingFinished;
    const OBJ = {
      'isCancel': false,
      'isUploading': this.isUploading,
      'isUploadingFinished': this.isUploadingFinished
    }
    this.cancel.next(OBJ);
    this.cd.detectChanges();
    this.onCancel();
  }

  onCancel() {
    this.isUploading = !this.isUploading;
    this.isUploadingFinished = !this.isUploadingFinished;
    const OBJ = {
      'isCancel': true,
      'isUploading': this.isUploading,
      'isUploadingFinished': this.isUploadingFinished
    }
    this.cancel.next(OBJ);
  }


  /* this function is use to reset */
  initUploadData() {
    this.percentDone = 0;
  }

  ngOnChanges() {

    if (this.status === 'ADD-VIDEO') {
      this.VideoTitle = 'Enter Title';
      this.VideoDesc = 'Enter Descriptions';
    }
    if (this.status === 'EDIT-VIDEO') {
      this.VideoTitle = this.selectedVideoForEdit.video_title;
      this.VideoDesc = this.selectedVideoForEdit.video_description;
    }

    console.log('ngOnChanges totalContent == > ', this.totalContent);
    console.log('ngOnChanges called in Add-Video-Component');
  }

  ngOnInit() {
    this.cd.detectChanges();
  }

}

上面的是代码，使用该代码我们将视频上传到s3存储桶

时段政策：

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Sid": "AddPerm",
            "Effect": "Allow",
            "Principal": "*",
            "Action": [
                "s3:PutObject",
                "s3:PutObjectAcl"
            ],
            "Resource": "arn:aws:s3:::bucketname/*"
        }
    ]
}

CORS配置：

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

错误：

polyfills.0df9233bd70f054e90d1.js:1 PUT https://bucketname.s3.amazonaws.com/videos/1566813222199_SampleVideo_1280x720_1mb.mp4 400 (Bad Request)

Answer 1

尝试将您的IAM角色更改为：

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Sid": "AddPerm",
            "Effect": "Allow",
            "Principal": "*",
            "Action": [
                "s3:PutObject",
                "s3:PutObjectAcl"
            ],
            "Resource": [
                "arn:aws:s3:::bucketname",
                "arn:aws:s3:::bucketname/*"
            ]
        }
    ]
}

将视频从本地上传到AWS S3时出错

1 个答案: