Github and aws s3 - 2

이제 파일을 관리하기 위해 aws를 사용해본다.

 

먼저 aws란 무엇인가

아마존 닷컴에서 개발한 클라우드 컴퓨팅 플랫폼이다.

Amazon Web Services  는 아마존에서 제공하는 클라우드 서비스로 네트워킹을 기반으로 가상 컴퓨터와 스토리지, 네트워크 인프라등 다양한 서비스를 제공한다.

비즈니스와 개발자가 웹서비스를 사용하여 확장 가능하고 정교한 애플리케이션을 구축하도록 지원한다.

클라우드 컴퓨팅의 장점을 이용하기 위해 많은 기업들이 활용하고 있다.

 

클라우드 컴퓨팅이란 인터넷을 통해 it리소스와 앱을 온디맨드로 제공하는 서비스이고 과금제이다.

 

기존의 물리적인 형태의 실물 컴퓨팅 리소스를 네트워크 기반 서비스 형태로 제공하는것.

사용자로 하여금 네트워크 상에서 클라우드 서비스의 자원을 사용하는 것을 의미

laaS  PaaS  Saas 세가지로 분류하기도 한다. 뭐 이런건 차차 알아보자

 

먼저 aws.amazon.com에서 aws계정을 만들자

https://aws.amazon.com/ko/

클라우드 서비스 | 클라우드 컴퓨팅 솔루션| Amazon Web Services

계정을 만들고서 접속후 자습서에 눈이 갔지만 일단 배포를 먼저 주력하기 위해

서비스로 이동해 S3로 이동한다.

s3로 들어오면 버킷 만들기가 보인다~ 버킷을 만들어주자

 

버킷의 이름은 유일해야한다. 공백 또는 대문자도 안된다. 나머지 옵션은 그대로 두고 만들기~

 

두번째로 API key를 만들어야 한다.  그래야 node.js와 aws가 연동이 가능하다.

aws 검색창에 IAM을 검색하고 IAM으로 이동한다 IAM에서 API key를 만들 수 있다.

 

들어가서 사용자 페이지로 이동후 사용자 추가 후 유저네임을 적어주고

AWS 액세스 유형은 프로그래밍 방식 엑세스 키 사용으로 선택

다음으로 이동하면

권한 설정이 있는데 여기서는 AmazonS3FullAccess로 선택한다. S3에서 할 수 있는 파일에 대한 모든 권한을 준다.

그리고 다음~ 태그 설정은 pass하고 다음~ 하면 이렇게 세부정보가 나온다.

아래에 사용자 만들기 버튼을 클릭하면~

이렇게 액세스 키ID와 secret key가 주어지는데 secret access key는 단 한번만 보여준다.

env에 적어놓자~ 만약 키를 잊어버렸다면 새로 access key를 만들어야 한다.

 

이제 Heroku로 가서 ID와 secret Key를 환경변수에 넣어주자

이제 헤로쿠에서 AWS 아이디와 시크릿키를 사용 가능해졌다.

 

이제 파일 업로드 미들웨어였던 multer를 사용하는데 multer S3를 사용하자

설치해준다. multer s3를 통해 웹사이트에 업로드 하는 대신 AWS에 업로드 한다.

 

npm install --save multer-s3를 통해 multer s3를 설치해주고~

multer를 사용했던 미들웨어로 가서 코드 수정을 해준다.

 

multer s3를 import 해주고~ 기존 avatar와 video 미들웨어 코드를 수정해주는데 file system을 사용하는 게 아니라 aws를 사용할 것이다.

storage 변경을 해주자.

공식 문서에 나온 내용인데~ 이렇게 해주면된다. 

s3:s3부분이 있는데 위를 보면 new aws.s3() 이렇게 적혀있다 s3는 aws-sdk패키지에 있다 . 패키지 설치를 해주자~

https://www.npmjs.com/package/aws-sdk

aws-sdk

 

이제 s3오브젝트를 만들고 이 오브젝트에 AWS_ID 와 AWS_SECRET_KEY를 전달해야 한다.

credential을 적어주는데 credentials는 음.. 자격? 신임장 정도의 뜻이다. 그안에  accessKeyId와  secretAccessKey를 전달하자.

heroku에 넣은 변수와 같은 변수를 써야한다 ~

 

이제 multer S3를 만들면 된다.

bucket은 꼭 aws에서 만든 username을 써주자.

and~~~ 미들웨어에 s3 storage를 지정해주면 테스트할 준비가 완료 된것이다.

heroku에서 업로드 하는것은 시간이 걸리니

일단 localhost에서 작업 테스트 해본다.

 

(근데... 개발모드에서는 aws를 안쓰고 그냥 local folder에 저장하며 테스트 해야하는데... 이건 니코가 나중에 알려준다고한다.)

 

이제 테스트삼아~! 로컬에서 한번 프로필 이미지를 변경해보자~ 파일 선택해서 업로드하면!~!

에러가 나온다. null이란다.. mongo db로 이동해서 콘솔에서 확인해보면

아바타 url이 null로 바뀌어 버렸다..... 어떤 이유에서인지... 왜.. null로 바뀌어 버린것일까..

 

그런데! aws management console에서 버킷에 보면~

업로드 된 파일이 보인다. 음 좋은 소식이다. 서버상에서 뭔가 문제가 있긴 하지만 aws에는 정상적으로 업로드 되어있다.

 

이제 문제를 수정하는데  다시 aws 매니지먼트 콘솔에서 권한탭으로 이동하면

처음에 모든 퍼블릭 엑세스를 차단으로 뒀었는데 이 부분을 바꿔준다.

이렇게 마지막 두개만 선택하는데 읽어보면~ access control list라는 것을 제공할때 공개 권한을 주는 두가지를 허용해준다.

 

그리고 돌아와 public되지 않은 두파일은 삭제를 해준다.

그리고 access control list를 전달해준다. ACL이라고 부르고 기본적으로 multer-s3 오브젝트의 권한이다

누구나 읽을 수 있도록 public-read로 전달한다.

그리고 한가지 더 문제가 있다. 기존 컨트롤러에서 업로드된 사진을 db에 파일url  path지정에 관한 것이다.

테스트시에는 local에서 multer를 통해 fileurl을 만들엇고 이것으로 db의 프로필 이미지를 업데이트 했다.. 그런데

지금은 aws를 사용하니 aws에서 가져오도록 해줘야한다.

 

자 다시 업로드하고 기존 req.file을 콘솔창에 찍어보자~

없다 file.path가 ... 대신 location이 생겼다.. 바꼈다 바꾸자 ㅋㅋ file.path부분으로 된것들은 대부분 확인후 바꾸어주면 된다.

 

변경해줬으니 다시 시도해보자~

매우 잘 된다~~ 굳 video도 마찬가지로~ 잘된다. 근데~ local에서 쓰던 root설정을 바꿔주긴 해야한다.

 

음 또 걱정이네. local test할때 또 바꿔줘야 한다는 귀찮음이...

 

이제 heroku에서 잘 작동되는지 확인해보자.

변경사항 저장후 git commit해주고 push까지 해준다음 app에서 업데이트를 하면~!

이렇게 짠~~

자알 업로드 되었다~!

옥케이~!~!