[AWS] Heroku로 배포한 Node.js 서버에서 AWS S3 사용하기-1

 

Amazon S3 lcon

 

🙀  문제

이전에 배포했던 프로젝트에서 새로운 사진을 업로드하면 사진 파일이 깨져서 보인다는 문제를 발견하였다.

프로젝트에서 Node.js 서버를 배포할때 Heroku를 사용하였기 때문에 Heroku 문서에서 관련 내용을 찾아 보았다.

문서에 따르면 Heroku application은 dyno라고 하는 가벼운 Linux container로 동작하게 되는데, dyno는 수명이 짧은 파일 시스템을 가지고 있다고 한다.

따라서 dyno가 교체되거나 재시작되면 파일은 사라지게 된다. 😨

 

😺  해결 방법

Heroku 문서에서는 해결 방법으로 AWS S3를 사용하는 방법에 대해 나와있길래 Amazon S3에 대해 알아보고 사용하고자 한다.

 

 

이 글에서 정리하는 내용:

• Amazon S3(Amazon Simple Storage Service)란?
• S3 bucket 만들기
• Bucket 정책 설정하기
• S3 bucket CORS setting

 

 

Amazon S3(Amazon Simple Storage Service)란?

AWS 문서에 따르면 Amazon S3는 데이터를 버킷(bucket) 내의 객체로 저장하는 객체 스토리지 서비스라고 한다.

여기서 객체는 해당 파일을 설명하는 모든 메타데이터이고, 버킷은 객체에 대한 컨테이너이다.

따라서 Amazon S3에 데이터를 저장하려면 먼저 버킷을 생성해야 한다.

계정에서 생성할 수 있는 버킷의 수는 최대 100개이지만, 버킷에 저장할 수 있는 객체 수에는 제한이 없다고 한다.

 

S3 bucket 만들기

만드는 방법은 이 블로그를 참고하였다.

1. AWS 콘솔에 IAM 사용자로 로그인 하고, s3를 검색하여 다음을 클릭한다.

 

2. create bucket 버튼을 클릭한다.

 

3. bucket name과 지역 정보를 설정한다.

(Heroku 문서에 따르면 생성한 heroku application과 같은 지역으로 S3 bucket 지역을 설정해야 AWS 요금이 더 적게 나온다고 한다.)

 

4. Block all public access 체크박스는 체크를 하지 않는다.

이렇게 해야 외부에서도 내 파일을 읽을 수 있고, 새로운 파일도 업로드할 수 있다고 한다.

보안 취약성은 좀 높아지기 때문에 조심해야 한다고 하는데, 이 부분을 보완하기 위해서는 어떻게 해야하는지 조금 더 공부를 해봐야 할 것 같다.

 

5. 그 아래의 경고 체크박스에는 체크를 해준다.

 

6. 나머지 설정은 모두 기본값으로 놔두고, bucket 생성하기 버튼을 클릭한다.

 

Bucket 정책 설정하기

외부에서 bucket에 접근할 수 있게 하려면 bucket 정책 설정까지 해줘야 한다.

1. 생성한 버킷 이름을 클릭한다.

 

2. Permissions 탭을 클릭한다.

 

3. 하단으로 스크롤 하다가 bucket 정책 부분에서 수정하기 버튼을 클릭한다.

 

4. Bucket 정책을 설정하기 위해 policy generator를 클릭한다.

Policy generator를 이용하면 내가 원하는 조건을 선택하기만 하면 자동으로 JSON 형식의 bucket 정책을 만들어준다.

 

5. 다음과 같이 정책을 설정하고 Add Statement 버튼을 클릭한다.

Principal에는 버킷 정책이 적용될 대상을 전체로 설정하기 위해 *를 입력한다.

Actions에서는 GetObject와 PutObject 두가지를 선택한다.

ARN에는 arn:aws:s3:::내 버킷 이름/*의 형식으로 적어준다.

 

 

6. 그러면 다음과 같이 statement가 추가된 것을 볼 수 있고, Generate Policy 버튼을 클릭하여 정책을 생성하면 된다.

 

7. 다음과 같이 생성된 JSON 형식의 버킷 정책을 복사하고, 버킷 정책 수정하기 페이지로 돌아가서 원래 있던 내용은 지우고 복사한 내용을 붙여넣기 한다.

그리고 변경사항 저장하기 버튼을 클릭하면 된다.

 

 

이렇게 하면 bucket 생성과 설정은 끝났지만, Heroku application에서 사용하기 위해서는 Heroku 문서에 나와있는 CORS setting 과정도 완료해야 한다.

S3 bucket CORS setting

1. Permissions 탭 클릭후, 하단으로 스크롤을 하면 CORS 부분이 나오는데 여기서 Edit 버튼을 클릭한다.

 

2. 다음 내용을 입력하고 변경사항 저장하기 버튼을 클릭한다.

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

 

그러면 다음과 같이 CORS setting이 완료되었다.

 

This tells S3 to allow any domain access to the bucket and that requests can contain any headers, which is generally fine for testing. When deploying, you should change the ‘AllowedOrigin’ to only accept requests from your domain.

 

주의할 점은 이렇게 설정해두면 모든 도메인의 접근을 허용하는 것이기 때문에 테스트 할때는 괜찮지만, 배포할때는 "AllowedOrigin" 부분을 수정해야 한다!

 

 

모든 과정을 완료하고 사진 파일 업로드 후, 객체 URL로 들어가보면 에러없이 내가 올린 사진을 볼 수 있게 된다.

이제 이것을 어떻게 Node.js 서버에서 사용하는지 다음 글에서 정리해 보겠다.

https://enne.tistory.com/13

[AWS] Heroku로 배포한 Node.js 서버에서 AWS S3 사용하기-2

 

---

참고:

https://velog.io/@gbskang/Heroku%EC%97%90%EC%84%9C-AWS-S3-%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0

https://42place.innovationacademy.kr/archives/9784