[Project] Onstagram Service #6

---

이전 글에 이어서 이번에는 Amazon S3를 연동해서 이미지 파일을 위한 서버를 추가해 보겠습니다.

회사에서 써보면서 자주 쓰다보니 마음이 가는건지 모르겠지만 S3가 참 간단하면서도 편하더라구요.

성능도 꽤 괜찮았습니다. (물론!! 자본주의... 비용을 어느 정도 지불하면 서버 성능 쭉쭉 올라갑니다ㅎㅎ)

그럼 Amazon 회원가입부터 시작합니다!!

 

Code : https://github.com/ghk0409/Ongstagram_feat.instagram

---

<Amazon S3 연동>

1. Amazon 가입하기

- Amazon을 쓰려면 가장 먼저 해당 계정이 있어야 하기 때문에 Amazon에 접속해서 [무료로 시작]을 클릭 후 나오는 화면에서 [무료로 계정 생성]을 클릭하고 계정을 생성합니다.

 + 혹시나 Amazon 계정이 이미 있다면 이 과정은 당연히 패스~

[무료로 시작] 버튼 클릭!!

[무료 계정 생성] 버튼을 누르고 계정 생성을 진행할께요~

 + 계정 생성 단계로 넘어가면 총 5단계로 표시가 될겁니다.

  1단계) 이메일, 암호, AWS 계정 이름 생성

  2단계) 연락처 정보 입력

   -> 전화번호, 주소 등을 입력하는데 국가를 대한민국으로 설정했어도 주소를 꼭 영문으로 입력해주세요!!

  3단계) 결제 정보 입력

   -> 무료 티어로 사용할거긴 하지만 카드 등록은 해줘야 합니다. 해외 사용 가능한 카드로 입력해서 진행합니다!!

  4단계) 가입 확인

   -> 전화번호를 통해서 확인 문자를 받기 위한 단계입니다.

  5단계) 가입

   -> 전달 받은 확인 문자(국제 발신!!)의 코드 4자리를 입력해주면 가입 끝~!!

 

- 위 단계를 마쳤으면 나오는 화면에서 역시 무료 티어인 [기본 지원 - 무료]를 선택해 줍니다.

무료 티어 선택 후 가입 완료!!

---

 

2. S3 버킷(Bucket) 생성

- 가입 완료를 하였으면 [콘솔에 로그인] 버튼을 클릭하고 로그인해 줍니다.

 + 로그인은 이메일 계정으로 로그인하시면 됩니다.

가운데 버튼이나 우측 상단 [콘솔에 로그인] 버튼을 눌러주시고 로그인!!

 

- 로그인 후 화면에서 [모든 서비스]를 클릭해서 AWS의 모든 서비스를 열어 스토리지 탭에서 [S3]를 찾아 눌러줍니다.

초록 박스 먼저 눌러주시고 빨간 박스 S3 클릭!!

 

- 이제 버킷을 만들어 봅니다.

 + S3는 버킷이란 단위로 서비스를 이용할 수 있어요

 + 버킷 이름은 'onstagram'으로 설정합니다ㅎㅎ

 + 반드시 꼭!!! 리전은 '아시아 태평양(서울)'로 선택해주세요!!

 + 왜냐면 속도가 빠르거든요 느리면 못 참아요~

 + 잘 알진 못하지만 가격 차이도 리전별로 있습니다. 잘못 선택하면 나중에 무료 티어가 아닌 서비스를 이용할 때 요금 폭탄 맞을지도?? 펑펑~~~

 + 근데 미국이나 유럽??쪽 리전은 요금이 더 싼거 같아보이긴 하지만 비추.

버킷 만들기 시작!!

버킷 이름과 리전을 선택해 줍니다.

아래쪽의 설정 옵션 부분에서는 퍼블릭 액세스 부분만 이렇게 바꾸고 나머지는 기본 상태로 만들어 봅니다.

---

 

3. IAM 설정

- 버킷 생성을 완료했으면 API 권한을 설정해 봅니다.

 + 버킷 생성 완료 후 화면에서 상단 [서비스] 메뉴를 클릭하고 [IAM] 항목을 찾아 클릭해 줍니다!!

[서비스] 클릭하고 스크롤을 아래로 내리시면 보안 관련 탭에 [IAM]이 보일 거에요. AWS 서비스 여러 가지로 참 많아요~

 + 보안 정책이 진짜 복잡/강력한 AWS인지라 어떤 기능이든 개별적으로 권한을 부여해서 사용할 수 있게 해줍니다.

 + S3 이용에 대한 권한을 만들어 볼 거에요.

 

- IAM 페이지에서 사용자를 추가해 보도록 합니다.

왼쪽의 [사용자] 항목을 클릭!!

사용자가 아무도 없을테니 [사용자 추가]를 클릭해 사용자를 추가해 줍니다!!

사용자 이름을 입력하고 액세스 유형은 [프로그래밍 방식 액세스] 체크!! 그리고 넘어갑니다.

 + 여기서 [프로그래밍 방식 엑세스]는 사용자(본인)가 개발자나 서버라면 체크합니다.

 + [AWS Management Console 액세스]는 사용가(본인)가 콘솔을 통한 로그인이 필요하다면 체크합니다.

다음 화면에서 [그룹 생성]을 클릭해 그룹을 만들어 봅니다. (사용자에게 권한을 부여하기 위한 그룹이에요!!)

그룹 생성 창에서 그룹 이름을 입력해 주시고 정책 필터에 's3'라고 입력해서 나오는 목록 중 'AmazonS3FullAccess'에 체크하고 생성!!

[다음: 태그]로 다음 단계로 넘어갑니다.

태그 추가는 선택 사항이라 아직 굳이 필요없어서 [다음: 검토]로 넘어갑니다.

자 이제 거의 마지막!! [사용자 만들기]를 클릭해 줍니다.

 + 이제 여기서 가장 중요한 부분을 진행할께요. 바로 '액세스 키'!!! 꼭 보관 잘 해주세요!!

꼭 액세스 키를 따로 보관해줘야 합니다!! [.csv 다운로드] 누르고 csv 파일로 보관해 줍니다.

 + 여기까지 사용자 추가가 끝났습니다. 액세스 키만 잘 보관해두시고 이제 Pycharm으로 돌아갈 시간입니다~

---

 

4. S3 연동하기

- S3를 프로젝트와 연동하기 위해 'boto3' 라이브러리를 설치해 줍니다.

 + python은 boto3를 이용해서 Amazon S3와 연동합니다.

 + boto3를 이용하면 아주 편해요~

(Terminal)
pip install boto3

 

- Django에서 다양한 저장소를 사용할 수 있도록 해주는 'django-storages' 모듈을 설치합니다.

(Terminal)
pip install django-storages

 

- 설치한 모듈들을 사용할 수 있도록' settings.py'를 수정해 봅니다.

 + 'storages'를 추가하고 AWS 관련 부분도 추가해 줍니다.

# config/settings.py

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'photo',
    'accounts',
    'disqus',
    'django.contrib.sites',
    'storages',  # 여기 storages를 한 줄 추가해줍니다.
]

 + [AWS_ACCESS_KEY_ID]와 [AWS_SECRET_ACCESS_KEY]값은 AWS에서 다운받은 csv파일에 있는 값을 넣어줍니다.

 + [AWS_STORAGE_BUCKET_NAME]은 버킷 생성 시 설정한 이름을 넣어줍니다. (...ongstagram인데 g를 빼먹고 만든...)

 + [DEFAULT_FILE_STORAGE]는 config/asset_storage라는 파일에서 'MediaStorage'라는 클래스를 통해 파일 저장소를 사용하도록 설정하는 부분입니다. (이 다음으로 asset_storage 파일을 만들면 되겠죠?)

# config/settings.py

# AWS 관련 설정 추가
AWS_ACCESS_KEY_ID = 'user key'
AWS_SECRET_ACCESS_KEY = 'user secretkey'
AWS_REGION = 'ap-northeast-2'
AWS_STORAGE_BUCKET_NAME = 'onstagram'
AWS_S3_CUSTOM_DOMAIN = '%s.s3.%s.amazonaws.com' % (AWS_STORAGE_BUCKET_NAME, AWS_REGION)
AWS_S3_OBJECT_PARAMETERS = {
    'CacheControl' : 'max-age=86400',
}

DEFAULT_FILE_STORAGE = 'config.asset_storage.MediaStorage'

 

- 위에서 언급한 'asset_storage.py' 파일을 만들어 줍니다.

 + config 폴더에 asset_storage 파일을 생성 후 아래 코드를 입력해 줍니다.

# config/asset_storage.py

from storages.backends.s3boto3 import S3Boto3Storage

class MediaStorage(S3Boto3Storage):
    location = 'media'
    file_overwrite = False

 

- boto3를 이용해 AWS S3를 이용할 수 있게 했으니 불필요한 설정을 제거해 줍니다.

 + 저는 히스토리를 남기기 위해 주석처리를 했지만 제거해주면 더 깔끔할 겁니다.

 + 위에서 이제 boto3를 이용해서 S3로 사진 파일을 저장하도록 만들었기 때문에 로컬에 불필요하게 저장하지 않아도 되기 때문에 해당 부분을 제거합니다!!

# config/urls.py
# AWS S3 연동으로 불필요한 설정 주석 처리
# from django.conf.urls.static import static
# from django.conf import settings

# urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

 

- 수정된 부분을 실제로 테스트해 봅니다.

사진을 업로드하면 일단 잘 나옵니다!

s3에도 파일이 잘 업로드된 것을 확인할 수 있어요!!

 + 아마 기존에 업로드했던 사진들은 처음에 깨져서 나올겁니다. S3에 해당 파일들이 없기 때문이에요!!

 + 혹시 사진이 계속 깨져서 나오신다면 S3 퍼블릭 설정이 안되어 있어서 그럴거에요. 원래는 당연히 퍼블릭 설정하지 않고 권한을 부여해서 서버로 이미지 왔다갔다 시키는게 맞는데 여기까진 복잡하니까 일단은 해당 버킷의 퍼블릭 설정을 다 풀어주면 됩니다. (퍼블릭 상태로 만들어준다는 거에요!)

** 퍼블릭 상태로 만들기

버킷을 이렇게 액세스-퍼블릭 상태로 만들어 줍니다.

해당 버킷의 권한 탭으로 들어와서 퍼블릭 액세스 차단 설정을 모두 비활성화 해주세요.

그리고 아래 버킷 정책을 위처럼 편집해주면 퍼블릭으로 진행할 수 있습니다.

 + 버킷 정책 편집 시에는 직접 json 형태로 입력하기 보다는 [정책 편집기]를 이용하면 됩니다. (편집 눌러서 들어가면 있습니다!!)

이렇게 설정한 후, ARN에는 버킷 ARN 입력 후 뒤에 '/*'만 추가해 주세요. (해당 버킷 내의 모든 파일 퍼블릭 가능하게 하기 위함!!

---

여기까지 Ongstagram을 완성해봤습니다.

이제 남은건 퍼블리싱인데요~ 퍼블리싱, 배포를 하는 부분은 추후에 다른 페이지에서 해보겠습니다. (헤로쿠를 이용해서 배포해보려고 합니다.)

여기에 디자인적인 측면을 덧붙이면 아마 어디 내놔도 나름 써먹을 수 있지 않을까?? 싶네요ㅎㅎ

그럼 다음 프로젝트를 기약하면서 이만 아디오스~