TheKoguryo's 기술 블로그

 Version 2024.03.13

7.5 Public Bucket을 통한 정적 웹사이트 호스팅

Public Bucket을 생성하면 URL 경로로 접근할 수 있다는 것을 이용하며 점을 이용하여 간단한 정적 웹사이트 호스팅을 해보도록 하겠습니다. Object Storage는 기본적으로 계층구조가 없는 일자 구조입니다. 폴더구조의 가진 웹페이지는 어떻게 처리할 수 있는지에 대해서 테스트 해 봅니다

현재 버전 기준 Public Bucket은 파일 링크 공유 등으로 사용할 순 있지만, 정적 웹사이트 호스팅을 위해 사용하기에는 제약사항이 있습니다. URL을 Index Document로 보내주는 기능이 현재는 지원하지 않습니다. 예를 들어, http://www.example.com 주소로 웹브라우저로 접속하면, 자동으로 http://www.example.com/index.html로 보내주는 기능이 현재는 없습니다. 루트 페이지뿐만 아니라, 서브 폴더에 대해서 해당 기능이 일반적으로 필요한데, 현재는 명시적으로 html 주소 전체를 브라우저에서 입력 또는 링크를 타고 갈 때 입력해야 합니다.

Public Bucket 생성

Bucket을 생성하고 Visibility를 Public으로 변경하여 Public Bucket을 하나 생성합니다.

  1. Bucket 을 생성합니다.

    • Name: 예) ExampleBucketForWeb
  2. Edit Visibility를 클릭하여 Visibility를 Public으로 변경합니다.

    image-20230508141749473

간단한 웹페이지 테스트

  1. 간단한 웹페이지를 생성하고 index.html 파일명으로 저장합니다.

    <html>
      <header><title>Hello !!!</title></header>
      <body>
        <h1>Hello OCI Object Storage</h1>
      </body>
    </html>
    
  2. index.html 파일을 Bucket에 올립니다.

  3. 업로드한 index.html의 상세페이지에서 URL 경로를 확인합니다.

    image-20230508142028206

  4. 확인된 URL 경로를 웹브라우저로 접속하면, 잘 동작합니다.

    image-20230508142138476

간단한 폴더구조의 웹페이지 테스트

Object Storage는 기본적으로 계층구조가 없는 일자 구조입니다. 그래서 Object 업로드 화면을 보면 폴더에 대한 항목이 없습니다. 하지만, 일반적으로 웹페이지는 폴더구조를 가지게 됩니다. 폴더 구조는 Object의 Name에 경로를 추가하는 방식으로 지원이 됩니다.

  1. 앞서 생성한 index.html 파일을 수정합니다.

    <html>
      <header><title>Hello !!!</title></header>
      <body>
        <h1>Hello OCI Object Storage</h1>
        <img src="images/icons8-anonymous-mask-100.png"/>
      </body>
    </html>
    
  2. 수정한 index.html 파일을 Bucket에 올립니다. Object Name이 같으면 기존 파일을 덮어쓰게 됩니다.

  3. 이미지 파일을 올립니다. 올릴 때 Object Name을 html 상에 있는 이미지 경로를 포함한 이름으로 변경합니다.

    image-20230508153904249

  4. 앞서 확인된 index.html의 URL 경로를 웹브라우저로 접속하면, 잘 동작합니다.

    image-20230508154353816

많은 파일을 업로드할 때 일일이 Name을 경로를 포함한 이름으로 변경하는 것은 당연히 힘듭니다. CLI를 사용하거나, CloudBerry 같은 도구를 사용하면, 로컬 폴더를 그대로 올리면서 Object의 이름이 경로 형태로 자동으로 변경되니, 걱정할 필요는 없습니다.



이 글은 개인으로서, 개인의 시간을 할애하여 작성된 글입니다. 글의 내용에 오류가 있을 수 있으며, 글 속의 의견은 개인적인 의견입니다.

Last updated on 12 Jan 2022