요즘은 흔히 파일서버로 AWS S3를 이용합니다. 그래서 파일 업로드 기능을 만들때 S3에 어떻게 파일을 업로드 할지 고민하게 되는데요. Front-end 입장에서는 S3에 파일을 업로드 하는 방법으로 크게 2가지를 생각할 수 있습니다. - Front-end에서 AWS SDK를 이용해서 직접 업로드 - API 서버에 파일을 전달하고 API 서버에서 S3에 업로드 첫번째 방법은 AWS SDK를 써서 S3이용이 가능해야하기 때문에 Front-end 코드에서 AWS Access Key와 Secret Key를 알고 있어야합니다. 코드에 하드코딩 하지 않더라도 브라우저에서 AWS SDK를 이용하는 시점에는 결국 자바스크립트에서 Key 정보를 가지고 있어야합니다. 즉, Front-end에서 AWS SDK를 이용하는..

TECH 2021. 9. 8. 21:18

AWS S3와 CloudFront를 이용해서 정적 웹사이트를 호스팅하는 구성은 이제 무척 보편화 되었다고 생각합니다. 저도 Vue.js나 React.js 기반의 CSR(Client-side Rendering) 프로젝트를 배포하는 경우에 S3, CloudFront 조합을 많이 사용합니다. (최근에는 Amplify Console을 더 사용하고 있긴 합니다 ㅎㅎㅎ) 처음에는 S3의 웹호스팅 기능을 활성화하고 CloudFront 배포를 생성할 때 Origin에 S3의 웹사이트 엔드포인트를 직접 입력하였습니다. 그런데, 나중에는 CloudFront의 Origin에 S3의 Rest API 엔드포인트를 넣고 OAI(Origin Access Identity)를 이용해서 S3에 CloudFront만 접근가능하도록 제한할..

TECH 2021. 6. 23. 23:08

AWS S3를 Origin으로 사용하는 CloudFront 배포를 만드는 경우가 있습니다. 예를 들면, S3에 저장된 파일들을 CDN으로 배포하려는 경우와 S3에서 정적 웹호스팅 기능을 사용하면서 SSL을 적용하기 위해서 CloudFront를 이용하는 경우가 있습니다. 위의 두 경우 모두 S3 Bucket에 저장한 파일을 Public Internet에 제공하기 위한 것이기 때문에, S3 Bucket의 정책을 퍼블릭하게 설정하게 됩니다. 하지만 CloudFront를 이용해서 S3 Bucket의 파일들을 Public Internet에 공개한다면 Bucket의 정책을 퍼블릭하게 설정하지 않고, CloudFront 배포에서만 접근하도록 설정하면 됩니다. 방법은 아주 간단합니다. S3 Bucket 정책의 Pric..

TECH 2020. 4. 17. 00:27