AWS-SDK를 사용하여 S3에 이미지를 저장할때 이 경로를 DB... - 인프런

강의 따라 진행하며 프론트엔드에서 Image Upload 버튼을 눌러서 이미지를 선택하였을때

AWS S3에 저장되는 것까지는 확인이 되었습니다.

다만 DB에서는 기존 이미지 경로 그대로여서 업데이트한 이미지가 적용되지 않고 있는데, 여기서는 어떻게 진행하면 좋을까요?

S3 사용 전에는 cats.repository에서 save 메소드 사용하여 새로 갱신된 이미지 파일 경로를 저장하는 과정이 있었듯이

async findByIdAndUpdateImg(id: string, fileName: string) {
    const cat = await this.catModel.findById(id);
    cat.imgUrl = fileName;
    const newCat = await cat.save(); // DB에 내용 저장
    console.log(newCat);
    return newCat.readOnlyData;
  }

aws.service의 S3 저장하는 구간 중간에 db에 저장하는 과정을 추가해주면 될 것 같은데..

언어 실력이 부족하여 어떻게 시도를 해야할지 감이 잡히질 않습니다.

async uploadFileToS3(
    folder: string,
    file: Express.Multer.File,
  ): Promise<{
    key: string;
    s3Object: PromiseResult<AWS.S3.PutObjectAclOutput, AWS.AWSError>;
    contentType: string; 
  }> {
    try {
      const key = `${folder}/${Date.now()}_${path.basename(
        file.originalname,
      )}`.replace(/ /g, '');

      const s3Object = await this.awsS3
        .putObject({
          Bucket: this.S3_BUCKET_NAME,
          Key: key,
          Body: file.buffer,
          ACL: 'public-read',
          ContentType: file.mimetype,
        })
        .promise();
      return { key, s3Object, contentType: file.mimetype };
    } catch (error) {
      throw new BadRequestException(`File upload failed : ${error}`);
    }
  }

조언 부탁드립니다..

안녕하세요 jeongho218님, 인프런 AI 인턴이에요.

AWS S3에 이미지를 저장한 후, 해당 이미지 경로를 DB에 저장하고 싶으시다는 거군요. 그렇다면 aws.service의 uploadFileToS3 메소드에서 DB에 저장하는 과정을 추가해주셔야 합니다.

아래는 예시로 제시해 드린 코드입니다.

async uploadFileToS3(
  folder: string,
  file: Express.Multer.File,
): Promise<{
  key: string;
  s3Object: PromiseResult<AWS.S3.PutObjectAclOutput, AWS.AWSError>;
  contentType: string;
}> {
  try {
    const key = `${folder}/${Date.now()}_${path.basename(
      file.originalname,
    )}`.replace(/ /g, '');

    const s3Object = await this.awsS3
      .putObject({
        Bucket: this.S3_BUCKET_NAME,
        Key: key,
        Body: file.buffer,
        ACL: 'public-read',
        ContentType: file.mimetype,
      })
      .promise();

    // 이미지 경로를 DB에 저장하는 부분 추가
    const imageUrl = `https://${this.S3_BUCKET_NAME}.s3.amazonaws.com/${key}`;
    await this.db.saveImageUrlToDB(imageUrl);

    return { key, s3Object, contentType: file.mimetype };
  } catch (error) {
    throw new BadRequestException(`File upload failed : ${error}`);
  }
}

위의 예시 코드에서 db.saveImageUrlToDB(imageUrl)는 이미지의 경로를 DB에 저장하는 메소드 호출을 가정하고 작성하였습니다. 해당 메소드를 사용할 수 있는 DB 로직이 있어야 하며, 적절하게 수정하여 사용하시면 됩니다.

추가로 필요한 DB 메소드가 없는 경우, 해당 로직을 구현하셔야 할 것입니다. 이 경우에는 해당 프레임워크 또는 라이브러리의 문서로 참고하여 DB에 데이터를 저장하는 방법을 찾아보시면 됩니다.

이렇게 이미지가 S3에 저장된 후 DB에 이미지 경로를 저장하면, 업데이트된 이미지가 적용될 것입니다. 참고로, 사진 업로드 시 이미지를 실시간으로 업데이트하고 싶다면 프론트엔드에서 해당 이미지 경로를 업데이트해야 합니다.

이 조언이 도움이 되셨길 바랍니다. 추가 질문이 있다면 언제든지 물어보세요!

인프런 커뮤니티 질문&답변

AWS-SDK를 사용하여 S3에 이미지를 저장할때 이 경로를 DB에 저장하려면 어떻게 해야하나요?