【AWS】 S3 버킷에 HTML 파일을 업로드하여 브라우저에서 표시
목표
이 기사의 목표는 S3 버킷에 HTML 파일을 업로드하여 브라우저에서 볼 수 있다는 것입니다.
그림으로 나타내면 다음과 같이 됩니다.
【참고】
· 정적 웹 사이트 호스팅을 위해 S3 버킷을 설정하는 방법
· Amazon S3로 정적 웹 사이트 호스팅
절차
1. 버킷 만들기
이미지의 빨간색 테두리를 수정하거나 클릭하면됩니다.
기본 모두 기본 설정으로 작성하고 나중에 설정을 편집합니다.
※ 이번에는 버킷 이름을 "test-bucket-suguru"로 설정했습니다. 적절하게 변경하십시오.
버킷 생성은 이상입니다.
2. 버킷 설정
다음 세 가지 설정을 수행합니다.
다음 세 가지 설정을 수행합니다.
2-1. 공용 액세스 설정
사용 권한에서 설정합니다.
공용 액세스 설정은 이상입니다.
2-2. 패킷 정책 설정
사용 권한에서 설정합니다.
설정 내용은 공식 를 참고해 주십시오.
공식을 보면 다음과 같이 설정한다는 것이었습니다.
{
"Version": "2012-10-17",
"Statement": [
{
"Sid": "PublicReadGetObject",
"Effect": "Allow",
"Principal": "*",
"Action": [
"s3:GetObject"
],
"Resource": [
"arn:aws:s3:::<バケット名>/*"
]
}
]
}
패킷 정책 설정은 이상입니다.
2-3. 정적 웹 호스팅 활성화
속성에서 설정합니다.
기본 페이지를 index.html, 오류 페이지를 error.html로 설정했습니다.
이러한 파일을 다음과 같이 업로드합니다.
정적 웹 호스팅 활성화는 이상입니다.
3. 콘텐츠 업로드
기본 페이지를 index.html로 설정하고 오류 페이지를 error.html로 설정했으므로 파일을 업로드합니다.
3-1. 파일 준비
업로드할 파일을 준비합니다.
이번은 검증이므로 내용은 뭐든지 좋습니다.
HTML에서 이미지 파일이 참조되는 것을 확인하고 싶었으므로 index.html은 image01.png라는 이미지 파일을 참조하도록했습니다.
index.html<p>index desu</p>
<img src="image01.png">
error.html<p>error desu</p>
・image01.png ↓
3-2. 업로드
준비한 다음 세 파일을 업로드합니다.
<p>index desu</p>
<img src="image01.png">
<p>error desu</p>
콘텐츠 업로드는 이상입니다.
4. 브라우저에서 액세스
4-1. 엔드포인트 확인
빨간색 테두리가 끝점 URL입니다.
4-2. 브라우저에서 액세스
확인한 엔드포인트의 URL을 복사하여 브라우저에서 액세스합니다.
기본값을 index.html로 설정했으므로 액세스하면 index.html이 표시됩니다.
기본 페이지의 URL 끝에 /error.html
를 붙여 액세스하면 오류 페이지가 표시됩니다.
5. 버킷 삭제
마지막으로 버킷의 내용물을 비우고 버킷 자체를 제거합니다.
지금의 상태라면 액세스가 대량에 와 버리면 무료 프레임을 돌파해 버릴 가능성이 있습니다.
요약
목표였던 S3 버킷에 HTML 파일을 업로드하여 브라우저에서 볼 수 있습니다.
Reference
이 문제에 관하여(【AWS】 S3 버킷에 HTML 파일을 업로드하여 브라우저에서 표시), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://qiita.com/sugurutakahashi12345/items/820bea40f910c106738b
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
마지막으로 버킷의 내용물을 비우고 버킷 자체를 제거합니다.
지금의 상태라면 액세스가 대량에 와 버리면 무료 프레임을 돌파해 버릴 가능성이 있습니다.
요약
목표였던 S3 버킷에 HTML 파일을 업로드하여 브라우저에서 볼 수 있습니다.
Reference
이 문제에 관하여(【AWS】 S3 버킷에 HTML 파일을 업로드하여 브라우저에서 표시), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://qiita.com/sugurutakahashi12345/items/820bea40f910c106738b
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
Reference
이 문제에 관하여(【AWS】 S3 버킷에 HTML 파일을 업로드하여 브라우저에서 표시), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/sugurutakahashi12345/items/820bea40f910c106738b텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)