아마존 웹 서비스를 다루는 기술 11장 - 3.3. S3 정적 웹사이트 호스팅 사용하기

저작권 안내
  • 책 또는 웹사이트의 내용을 복제하여 다른 곳에 게시하는 것을 금지합니다.
  • 책 또는 웹사이트의 내용을 발췌, 요약하여 강의 자료, 발표 자료, 블로그 포스팅 등으로 만드는 것을 금지합니다.

AWS HTTP 프로토콜과 연동되는 스토리지 S3

이재홍 http://www.pyrasis.com 2014.03.24 ~ 2014.06.30

S3 정적 웹사이트 호스팅 사용하기

S3을 웹 서버 형태로 사용해보겠습니다. 사실 정적 웹사이트 호스팅 설정을 하지 않더라도 S3에 파일을 올리면 웹 브라우저로 파일에 접근할 수 있습니다. 하지만, 그냥 사용하는 것과 정적 웹사이트 호스팅 설정을 사용하는 것은 큰 차이점이 있습니다.

다음은 일반적인 S3의 URL 형태입니다.

  • http://s3-ap-northeast-1.amazonaws.com/examplebucket10/Jellyfish.jpg
  • s3-<리전 이름>.amazonaws.com/<버킷 이름>/<파일 이름>

다음은 정적 웹사이트 호스팅을 사용한 S3의 URL 형태입니다.

  • http://examplebucket10.s3-website-ap-northeast-1.amazonaws.com/Jellyfish.jpg
  • <버킷 이름>.s3-website-<리전 이름>.amazonaws.com/<파일 이름>
  • 이것을 S3 Website Endpoint라고 말합니다.

이처럼 URL 형태에 큰 차이점이 있습니다. 아래 URL 형태처럼 버킷 이름이 서브 도메인 형태로 들어가야 DNS 서버에서 CNAME 설정을 해 줄 수 있습니다. 즉 example.com 도메인의 CNAME을 examplebucket10.s3-website-ap-northeast-1.amazonaws.com로 설정하면 example.com으로 접속했을 때 버킷(examplebucket10)의 내용이 바로 표시됩니다.

이 CNAME 설정은 AWS의 DNS 서비스인 Route 53에서 설정 가능합니다. 또한, Route 53가 아니더라도 BIND와 같은 일반적인 DNS 서버에서도 설정이 가능합니다. Route 53에서 S3을 연결하는 방법은 '17.3 Route 53와 S3 연동하기'를 참조하기 바랍니다.

정적 웹사이트 호스팅 설정을 이용하면 인덱스 페이지와 에러 페이지의 파일명을 따로 지정해 줄 수 있고, 다양한 리다이렉션Redirection 행동을 할 수 있습니다. 즉 S3 버킷 도메인인 examplebucket10.s3-website-ap-northeast-1.amazonaws.com를 example.com과 같은 다른 도메인으로 리다이렉션 할 수도 있습니다.

정적 웹사이트 호스팅용 버킷을 새로 만든 뒤 간단한 웹사이트를 만들어보겠습니다. S3 버킷 목록에서 위쪽의 Create Bucket 버튼을 클릭합니다.

그림 11-36 S3 버킷 목록

그림 11-37처럼 S3 버킷을 생성합니다.

  • Bucket Name: 사용할 버킷 이름을 설정합니다(examplewebhosting은 이 책을 쓰는 시점에 제가 이미 사용하고 있으므로 같은 이름을 사용할 수 없습니다. 그림 11-37과는 다른 이름을 설정합니다).
  • Region: 버킷이 위치할 리전입니다. Tokyo를 선택합니다.

설정이 완료되었으면 Create 버튼을 클릭합니다.

그림 11- S3 버킷 생성

먼저 웹사이트이므로 버킷에 올라가는 모든 파일을 인터넷에 공개하도록 권한 설정을 해주어야 합니다. S3 버킷 목록에서 방금 생성한 버킷을 선택하고 위쪽의 Properties 버튼을 클릭합니다. 그리고 Permissions 탭을 클릭한 뒤 Edit bucket policy 버튼을 클릭합니다.

그림 11-38 S3 버킷 권한 설정

버킷 정책 편집기 화면이 나옵니다. 이곳에 아래 JSON 텍스트를 입력합니다. 인터넷에 버킷의 모든 파일을 공개하는 정책은 AWS Policy Generator에서 생성할 수 있습니다. AWS Policy Generator에 관련된 것은 '11.3.2 S3 버킷 권한 관리하기'를 참조하기 바랍니다.

{
	"Version": "2008-10-17",
	"Id": "Policy1397993518062",
	"Statement": [
		{
			"Sid": "Stmt1397993241249",
			"Effect": "Allow",
			"Principal": {
				"AWS": "*"
			},
			"Action": "s3:GetObject",
			"Resource": "arn:aws:s3:::examplewebhosting/*"
		}
	]
}

버킷 정책의 내용 중에서 Resources의 arn:aws:s3:::examplewebhosting/*에서 examplewebhosting 부분은 여러분들이 생성한 버킷 이름으로 바꿔주어야 합니다. 책에 있는 그대로 입력하면 안됩니다.

버킷 정책 JSON 텍스트 입력이 끝났으면 Save 버튼을 클릭합니다.

그림 11-39 버킷 정책 편집기

같은 버킷(그림 11-40에서는 examplewebhosting)의 Properties에서 Static Website Hosting 탭을 클릭합니다.

  • Do not enable website hosting: 정적 웹사이트 호스팅 기능을 사용하지 않습니다.
  • Enable website hosting: 정적 웹사이트 호스팅 기능을 사용합니다.
  • Redirect all request to another host name: 모든 요청을 다른 도메인으로 리다이렉션 합니다.

Enable website hosting을 선택합니다.

  • Index Document: 인덱스 페이지의 파일명 입니다. index.html을 설정합니다.
  • Error Document: 에러 페이지의 파일명을 설정합니다. 에러 페이지를 따로 보여주고 싶을 때 설정하면 됩니다.
  • Edit Redirection Rules: 세세한 리다이렉션 규칙을 설정합니다. docs/hello.html로 접근했다면 documents/hello.html을 보여주는 식으로 규칙 설정이 가능합니다. 자세한 내용은 링크를 참조하기 바랍니다.
    https://docs.aws.amazon.com/AmazonS3/latest/dev/HowDoIWebsiteConfiguration.html

설정이 완료되었으면 Save 버튼을 클릭합니다.

그림 11-40 S3 버킷 정적 웹사이트 호스팅 설정

이제 간단한 웹 페이지를 작성하여 올릴 차례입니다. 메모장이나 기타 텍스트 편집기를 열고 아래와 같이 작성한 뒤 index.html로 저장합니다.

index.html
<html>
<head>
    <title>S3 Example Website Hosting</title>
</head>
<body>
    <p>Hello S3</p>
</body>
</html>

index.html을 정적 웹사이트 호스팅을 설정한 버킷(examplewebhosting)에 올립니다. 파일을 올리는 방법은 '11.2 S3 버킷에 파일 올리기/받기'를 참조하기 바랍니다. index.html 파일이 버킷에 올라가 있습니다.

그림 11-41 정적 웹사이트 호스팅 설정을 한 S3 버킷의 파일 목록

그림 위쪽의 정적 웹사이트 호스팅을 설정한 버킷 이름(그림 11-42에서는 examplewebhosting)을 클릭한 뒤 Properties 버튼을 클릭합니다. 그리고 Static Website Hosting 탭을 클릭합니다. 이제 S3 웹사이트 엔드포인트의 링크를 볼 수 있습니다. 이 링크를 클릭합니다(링크에서 examplewebhosting 부분은 여러분들이 설정한 버킷 이름이 되어야 합니다). http://examplewebhosting.s3-website-ap-northeast-1.amazonaws.com/

그림 11-42 S3 웹사이트 엔드포인트 확인

웹 브라우저의 새 창에서 방금 만들어서 올린 index.html 파일의 내용이 표시됩니다.

그림 11-43 웹 브라우저에서 S3 웹사이트 엔드포인트에 접속

S3 정적 웹사이트 호스팅 활용
요즘 많이 쓰는 jQuery, jQuery UI, Bootstrap 등의 JavaScript 라이브러리 파일은 EC2에서 웹 서버를 구축하여 서비스하는 것보다, S3 정적 웹사이트 호스팅을 활용하여 서비스하는 것이 훨씬 유리합니다. 또한, 이미지 파일이나, CSS 파일 등도 S3 정적 웹사이트 호스팅을 활용하는 것이 효과적입니다.


저작권 안내

이 웹사이트에 게시된 모든 글의 무단 복제 및 도용을 금지합니다.
  • 블로그, 게시판 등에 퍼가는 것을 금지합니다.
  • 비공개 포스트에 퍼가는 것을 금지합니다.
  • 글 내용, 그림을 발췌 및 요약하는 것을 금지합니다.
  • 링크 및 SNS 공유는 허용합니다.