주:

정적 웹 사이트 호스팅을 위해 OCI Object Storage 및 Oracle API Gateway 설정

소개

OCI(Oracle Cloud Infrastructure)에서 호스트하려는 웹 애플리케이션이 있고 정적 웹 사이트 호스팅을 설정하려는 경우 이 자습서에서는 OCI Object Storage 및 Oracle API Gateway를 사용하여 JavaScript 컴파일된 풍부한 AOT(Ahead-of-Time) 웹 애플리케이션의 정적 호스팅을 구성하는 과정을 안내합니다. 더 간단한 앱 또는 정적 웹 페이지에 관계없이 HTTP를 통해 정적 파일을 제공하려는 모든 시나리오에 동일한 접근 방식을 적용할 수 있으며 OCI 플랫폼의 사용자에게 안정적인 온라인 경험을 모두 저렴한 비용으로 제공할 수 있습니다.

목표

Oracle Cloud Infrastructure에서 웹 콘텐츠를 효율적으로 배포 및 관리하기 위해 OCI Object Storage 및 Oracle API Gateway를 활용하여 정적 웹 사이트를 호스팅하는 방법을 알아봅니다.

필요 조건

작업 1: Oracle Object Storage 버킷 생성

먼저 OCI Object Storage에 새 버킷을 생성합니다. 이 버킷은 정적 웹 사이트를 호스트하는 데 사용됩니다.

오브젝트 스토리지 버킷

작업 2: 버킷에 배포 파일 업로드

애플리케이션 배포 파일을 이전 태스크에서 생성된 버킷으로 업로드합니다. 응용 프로그램 배포 파일은 일반적으로 응용 프로그램 디렉토리의 /dist 폴더에 있으며 webpack 빌드의 출력입니다.

파일 분배

작업 3: 사전 인증된 요청 생성

Oracle API Gateway가 인터넷을 통해 배포 파일을 제공할 수 있도록 하려면 배포 파일이 저장된 오브젝트 스토리지 버킷에 대해 사전 인증된 요청 PAR을 생성해야 합니다.

API 게이트웨이를 구성할 때 사용됩니다.

작업 4: Oracle API Gateway 생성

Oracle API Gateway 서비스를 사용하면 네트워크 내에서 액세스할 수 있는 전용 끝점이 있는 API를 게시할 수 있으며, 인터넷 트래픽을 허용하려는 경우 공용 IP 주소로 노출할 수 있습니다. 끝점은 API 검증, 요청 및 응답 변환, CORS, 인증 및 권한 부여, 요청 제한 등을 지원합니다. 자세한 내용은 Oracle API Gateway 개요를 참조하십시오.

  1. OCI 메뉴, 개발자 서비스, API 게이트웨이로 이동하고 생성을 누릅니다.

참고: 이 Oracle API Gateway를 배치하려면 가상 클라우드 네트워크가 필요하며 아직 생성되지 않은 경우 VCN을 생성합니다.

Oracle API Gateway

작업 5: Oracle API Gateway 배치 설정

Oracle API Gateway가 성공적으로 생성되면 배치로 이동하여 새 배치를 생성합니다.

  1. Create from scratch를 선택하고 Path prefix를 "/"로 설정합니다. URL의 기본 경로가 됩니다.

    게이트웨이 배치

  2. 여기서 TLS, CORS 등을 설정하거나 다음을 눌러 다음 단계로 이동하십시오.

  3. 인증 없음을 선택하고 다음을 누릅니다. 정적 웹 사이트에 대한 인증은 추가할 필요가 없습니다.

    배포 승인

태스크 6: 경로 추가

API 배치 마법사에서 배치의 기본 경로를 확장할 경로를 추가합니다.

  1. 경로 필드에 /{req*}을(를) 입력하십시오.

    배치 경로

  2. 메소드 드롭다운 목록에서 GET을 선택합니다.

  3. Edit added multiple backends를 선택합니다.

    다중 백엔드 배치

  4. 선택기 필드에서 경로를 선택합니다.

    배치 경로

  5. 백엔드 정의를 누릅니다.

  6. 기본 규칙을 생성하고, 이름을 기본값으로 입력하고, 일치 유형을 임의으로 입력하고, 기본값으로 설정 체크박스를 선택하고, 백엔드를 HTTP로 선택하고, Url 필드에 index.html 페이지에 대한 객체 스토리지 URL을 입력하고, 생성을 누릅니다.

    백엔드 정의

  7. js 파일 규칙을 생성하고 Name을 js-rule로, Match Type을 Wildcard로, *.js를 와일드카드 표현식으로 입력하고 백엔드를 HTTP로 선택한 다음 오브젝트 스토리지 버킷 URL을 입력하고 Url 필드에 {request.path[request]} 페이지를 누른 다음 Create를 누릅니다. URL은 다음과 유사합니다.

    https://{namespace}.objectstorage.{region}.oci.customer-oci.com/n/{namespace}/b/{bucket-name}/o/${request.path[req]}

  8. Create를 누릅니다.

    백엔드 정의

  9. 필요에 따라 css, html, txt, json 파일에 대해 유사한 규칙을 생성합니다.

    backend 모두 정의

  10. 다음을 누르고 Oracle API Gateway 생성을 완료하고 업데이트될 때까지 기다립니다.

작업 7: 테스트

배치 URL을 검색하고 웹 브라우저에 입력하면 응용 프로그램이 표시됩니다.

주:

  1. 애플리케이션이 로드되지 않는 경우 Oracle API Gateway가 오브젝트 스토리지 버킷에 액세스할 수 있는 올바른 정책을 추가했는지 확인합니다.

  2. 애플리케이션이 백엔드 정의에 포함하는 다른 모든 파일 유형을 추가해야 합니다.

  3. 이 기법을 사용하여 AOT(Ahead of Time) 컴파일된 응용 프로그램과 정적 웹 사이트만 설정할 수 있습니다. 응용 프로그램이 원시 Javascript 코드로 컴파일되었는지 확인합니다.

확인

작성자 - Mayank Kakani(OCI Cloud Architect)

추가 학습 자원

docs.oracle.com/learn에서 다른 실습을 살펴보거나 Oracle Learning YouTube 채널에서 더 많은 무료 학습 콘텐츠에 액세스하십시오. 또한 Oracle Learning Explorer가 되려면 education.oracle.com/learning-explorer를 방문하십시오.

제품 설명서는 Oracle Help Center를 참조하십시오.