Bubble.io와 Amazon S3 통합: 단계별 가이드 2024

단계 1: Amazon S3 설정

Bubble.io를 Amazon S3와 통합하기 시작하기 전에 AWS(S3) 계정이 있는지 확인하십시오. 회원가입하고 S3 서비스로 이동하십시오.

• 버킷 생성 버튼을 클릭합니다.
• 버킷에 유일한 이름을 제공하고 지역을 선택합니다.
• 버킷 속성 설정에서는 Cross-origin resource sharing (CORS) 를 활성화해야 합니다.
• CORS 상자에 다음 설정을 입력하십시오:

  [
    {
        "AllowedHeaders": [
            "*"
        ],
        "AllowedMethods": [
            "PUT",
            "POST",
            "DELETE",
            "GET"
        ],
        "AllowedOrigins": [
            "*"
        ],
        "ExposeHeaders": []
    }
  ]
  

• 저장을 클릭합니다.
• 권한 탭으로 이동하고 버킷 정책 섹션에서 이 정책을 붙여 넣습니다:

  {
    "Version": "2012-10-17",
    "Statement": [
        {
            "Sid": "PublicReadGetObject",
            "Effect": "Allow",
            "Principal": "*",
            "Action": [
                "s3:PutObject",
                "s3:PutObjectAcl",
                "s3:GetObject",
                "s3:DeleteObject",
                "s3:ListBucket"
            ],
            "Resource": [
                "arn:aws:s3:::[bucket-name]/*",
                "arn:aws:s3:::[bucket-name]"
            ]
         }
     ]
  }
  

• [bucket-name] 을 버킷 이름으로 교체합니다. 저장을 클릭합니다.

단계 2: IAM 사용자 생성

• IAM 대시보드로 이동합니다.
• 사용자 를 클릭한 다음 사용자 추가 를 클릭합니다.
• 사용자에게 이름을 지정하고 프로그래밍 방식 액세스 를 선택합니다.
• 권한 설정 화면에서는 기존 정책 직접 연결 을 선택합니다.
• AmazonS3FullAccess 를 검색하고 선택합니다. 다음을 클릭합니다.
• 설정을 검토한 후 사용자 생성 을 클릭합니다.
• 성공 화면이 표시됩니다. 액세스 키 ID와 비밀 액세스 키를 기록합니다. 이것들이 Bubble.io에서 필요합니다.

단계 3: Bubble.io와 통합

• Bubble.io 대시보드에 로그인합니다.
• 애플리케이션을 선택하고 플러그인탭으로 이동하고 플러그인 추가를 클릭합니다.
• Amazon S3 Uploader를 검색하고 설치합니다.
• 설치 완료 후 애플리케이션으로 돌아가 플러그인 탭으로 이동합니다. S3 Uploader가 나열되어 있습니다.
• AWS에서 얻은 액세스 키 ID, 비밀 액세스 키, 그리고 버킷 이름을 입력합니다.
• 설정을 저장합니다. 이제 통합이 완료되었습니다.

단계 4: 파일 업로더 사용

통합이 성공적인지 테스트하기 위해 Bubble에서 파일 업로더 요소를 사용합니다.

• 디자인 탭에서 페이지에 파일 업로더 요소를 드래그합니다.
• 해당 요소를 클릭하고, 인스펙터에서 S3 업로더를 유형 선택으로 볼 수 있습니다.
• 선택하고 애플리케이션을 미리 봅니다. 이제 파일을 S3 버킷에 업로드하는 것을 테스트할 수 있습니다.

이제 Amazon S3가 Bubble.io 애플리케이션과 성공적으로 통합되어, S3 버킷에 직접 파일을 업로드하고 저장할 수 있어야 합니다.