如何使用Angular 12读取保存在s3存储桶中的图像？

npm install aws-sdk

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

@Component({
  selector: 'app-image',
  templateUrl: './image.component.html',
  styleUrls: ['./image.component.css']
})
export class ImageComponent implements OnInit {
  s3: any;

  constructor() { }

  ngOnInit() {
    AWS.config.update({
      accessKeyId: 'YOUR_ACCESS_KEY_ID',
      secretAccessKey: 'YOUR_SECRET_ACCESS_KEY',
      region: 'YOUR_S3_REGION'
    });

    this.s3 = new AWS.S3();
  }

  loadImage() {
    const params = {
      Bucket: 'YOUR_S3_BUCKET_NAME',
      Key: 'YOUR_IMAGE_KEY'
    };

    this.s3.getObject(params, (err, data) => {
      if (err) {
        console.log(err);
      } else {
        const url = URL.createObjectURL(new Blob([data.Body], { type: data.ContentType }));
        // 使用获取到的图像URL进行后续操作，比如显示在HTML中
      }
    });
  }
}