Configurar o OCI Object Storage e o Oracle API Gateway para Hospedagem de Sites Estáticos

Introdução

Se você tiver um aplicativo web que deseja hospedar na Oracle Cloud Infrastructure (OCI) e quiser configurar a hospedagem estática de sites, neste tutorial, passaremos pela configuração da hospedagem estática de um aplicativo web Ahead-of-Time (AOT) compilado rico em JavaScript usando o OCI Object Storage e o Oracle API Gateway. A mesma abordagem pode ser aplicada a qualquer cenário em que você queira fornecer um arquivo estático por HTTP, seja para um aplicativo mais simples ou páginas da web estáticas, e fornecer uma experiência online confiável aos seus usuários na plataforma OCI, tudo a um custo menor.

Objetivos

Entenda como aproveitar o OCI Object Storage e o Oracle API Gateway para hospedar sites estáticos para implantar e gerenciar com eficiência o conteúdo da Web na Oracle Cloud Infrastructure.

Pré-requisitos

Tarefa 1: Criar um Bucket do Oracle Object Storage

Vamos começar criando um novo bucket no OCI Object Storage. Esse bucket será usado para hospedar seu site estático.

Bucket do Serviço Object Storage

Tarefa 2: Fazer upload de seus arquivos de distribuição no bucket

Faça upload dos arquivos de distribuição do aplicativo para o bucket criado na tarefa anterior. Os arquivos de distribuição de aplicativos geralmente estão localizados na pasta /dist do diretório de aplicativos e são a saída da compilação do webpack.

Arquivos de distribuição

Dica: Se quiser usar o oci-cli para fazer upload dos seus arquivos, especifique o parâmetro --content-type auto para garantir que o Tipo de Conteúdo seja definido corretamente.

Tarefa 3: Criar Solicitação Pré-Autenticada

Para permitir que o Oracle API Gateway forneça os arquivos de distribuição pela internet, você precisa criar uma solicitação pré-autenticada PAR para seu bucket de armazenamento de objetos no qual os arquivos de distribuição são armazenados.

Usaremos isso ao configurar o Gateway de API.

Tarefa 4: Criar o Oracle API Gateway

O serviço Oracle API Gateway permite publicar APIs com pontos finais privados que podem ser acessados de dentro da sua rede e que você pode expor com endereços IP públicos se desejar que eles aceitem o tráfego da internet. Os pontos finais suportam validação da API, transformação de solicitação e resposta, CORS, autenticação e autorização e limitação de solicitação. Para obter mais detalhes, consulte Visão Geral do Oracle API Gateway.

  1. Navegue até Menu do OCI, Serviços do Desenvolvedor, API Gateway e clique em Criar.

Observação: Você precisará de uma Rede Virtual na Nuvem para implantar este Oracle API Gateway. Crie uma VCN se ainda não houver uma criada.

Oracle API Gateway

Tarefa 5: Configurar a implantação do Oracle API Gateway

Depois que o Oracle API Gateway for criado com sucesso, navegue até Implantações e crie uma nova implantação.

  1. Selecione Criar do zero e defina o prefixo do Caminho como "/". Este será o caminho base do URL.

    Implantação de Gateway

  2. Configure TLS, CORS, etc. aqui ou clique em Próximo para passar para a próxima etapa.

  3. Selecione Sem Autenticação e clique em Próximo. Não precisamos adicionar qualquer autenticação para o nosso site estático.

    Autenticação de Implantação

Tarefa 6: Adicionar Rotas

No assistente de Implantação de API, adicione rotas que estenderão o caminho base para nossas implantações.

  1. Digite /{req*} no campo de caminho.

    Caminho de implantação

  2. Selecione GET na lista drop-down Methods.

  3. Selecione Editar vários backends adicionados.

    Implantação de vários backends

  4. Selecione Caminho no campo do seletor.

    Caminho de implantação

  5. Clique em Definir Backend.

  6. Crie uma regra padrão, digite Nome como padrão, Tipo de Correspondência como Qualquer um de e marque a caixa de seleção Tornar padrão, selecione o backend como HTTP e informe o URL de armazenamento de objetos da página index.html no campo URL e clique em Criar.

    definição de backend

  7. Crie uma regra de arquivo js, digite Nome como js-rule, Tipo de Correspondência como Curinga e *.js como expressão curinga, selecione o backend como HTTP e informe o URL do bucket de armazenamento de objetos seguido pela página ${request.path[req]} no campo URL e clique em Criar. Seu URL será parecido com este

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

    definição de backend

  9. Crie regras semelhantes para arquivos css, html, txt e json, conforme necessário.

    backend define tudo

  10. Clique em Próximo e conclua a criação do Oracle API Gateway e aguarde sua atualização.

Tarefa 7: Testar

Recupere o URL de implantação e insira-o em seu navegador da Web, o que deve exibir seu aplicativo.

Observações:

  1. Se você não vir o aplicativo sendo carregado, verifique se a sua lista de segurança ou grupo de segurança de rede na sua VCN permite tráfego para o Oracle API Gateway.

  2. Não se esqueça de adicionar todos os diferentes tipos de arquivo que seu aplicativo tem na definição de backend.

  3. Somente aplicativos compilados AOT (Ahead of Time) e sites estáticos podem ser configurados usando essa técnica. Certifique-se de que seu aplicativo seja compilado em código Javascript nativo.

Confirmações

Autor - Mayank Kakani (Arquiteto de Nuvem da OCI)

Mais Recursos de Aprendizado

Explore outros laboratórios em docs.oracle.com/learn ou acesse mais conteúdo de aprendizado gratuito no canal do Oracle Learning YouTube. Além disso, acesse education.oracle.com/learning-explorer para se tornar um Oracle Learning Explorer.

Para obter a documentação do produto, visite o Oracle Help Center.