Criar uma aplicação Web básica

TUTORIAL

Introdução
Criar um aplicativo Web
Criar uma função sem servidor
Criar uma tabela de dados
Clique aqui
adicionar interatividade à aplicação Web
Clique aqui
Limpar os recursos

Neste módulo, você usará o Amazon API Gateway para implantar sua função sem servidor

Visão geral

Neste módulo, usaremos o Amazon API Gateway para criar uma API RESTful que permitirá fazer chamadas à função do Lambda a partir de um cliente Web (normalmente o navegador de um usuário). O API Gateway age como intermediário entre o cliente HTML criado no módulo um e o back-end sem servidor criado no módulo dois.

O que você aprenderá

Neste módulo, você irá:

  • Usar o API Gateway para criar uma nova API
  • Definir métodos HTTP na API
  • Acionar uma função do Lambda a partir de uma API
  • Ativar o Cross-Origin Resource Sharing (CORS – Compartilhamento de recursos entre origens) em uma API para que você possa consumir recursos de uma origem diferente (domínio)
  • Testar uma API criada com o API Gateway a partir do Console de Gerenciamento da AWS

Principais conceitos

API RESTful: REST significa “Representational State Transfer” (Transferência de estado representativo) e é um padrão arquitetônico de criação de serviços Web. API significa Application Programming Interface (Interface de Programação de Aplicação). Assim, a API RESTful é uma API que implementa esse padrão arquitetônico REST.

Métodos de solicitação HTTP: os métodos HTTP são feitos para habilitar a comunicação entre clientes e servidores. Os métodos como GET ou PUT, definidos pelo protocolo HTTP, são usados para indicar qual ação deve ser realizada em um recurso.

CORS : o recurso de segurança do navegador CORS usa cabeçalhos HTTP para instruir um navegador a permitir que uma determinado aplicação Web executada em uma origem (domínio) acesse recursos selecionados de um servidor em uma origem diferente.

Otimizado para bordas: um recurso que usa a infraestrutura global da AWS para melhor atender clientes de todo o mundo.

 Tempo mínimo para conclusão

5 minutos

 Serviços usados

Amazon API Gateway

 Data da última atualização

4 de abril de 2023

Implementação

    1. Faça login no console do API Gateway.
    2. Na seção Escolher um tipo de API, encontre o cartão da API REST e escolha o botão Compilar no cartão.
    3. Em Escolher protocolo, selecione REST.
    4. Em Criar nova API, selecione API nova.
    5. No campo Nome da API, digite HelloWorldAPI.
    6. Selecione Otimizado para a borda no menu suspenso Tipo de endpoint. (Observação: os endpoints otimizados para Edge são os melhores para clientes distribuídos geograficamente. Isso significa que são uma boa opção para serviços públicos acessados na Internet. Normalmente são usados endpoints regionais para APIs acessadas principalmente na mesma região da AWS.
    7. Clique no botão azul Criar API. As configurações devem estar conforme mostrado na captura de tela a seguir:
    Crie uma página de API, mostrando as seleções e configurações da API.
    1. No painel de navegação esquerdo, selecione Recursos em API: HelloWorldAPI.
    2. Certifique-se de que o recurso “/” esteja selecionado.
    3. No menu suspenso Ações, selecione Criar método.
    4. Selecione POSTna nova lista suspensa que aparecerá e clique na marca de seleção.
    5. Selecione Função Lambda como Tipo de integração.
    6. Selecione a Região do Lambda que você usou ao criar a função (ou então você verá uma caixa de aviso dizendo “Você não tem funções Lambda em...“).
    7. Insira HelloWorldFunction no campo Função Lambda.
    8. Clique no botão azul Salvar.
    9. Uma mensagem informará que você está concedendo à API criada permissão para chamar a função do Lambda. Escolha o botão OK.
    10. Com o método POST recém-criado, selecione Ativar CORS no menu suspenso Ações.
    11. Mantenha a caixa de marcação POST marcada e clique no botão azul Ative o CORS e substitua os cabeçalhos dele existentes.
    Ative a página de configuração do CORS.

    10. Será exibida uma mensagem solicitando a confirmação das mudanças no método. Clique no botão azul Sim, substituir os valores existentes.

    Confirme a mensagem de alteração do método.
    1. Na lista suspensa Ações, selecione Implantar API.
    2. Selecione [Novo estágio] na lista suspensa Estágio de implantação.
    3. Digite dev em Nome do estágio.
    4. Escolha Implantar.
    5. Copie e salve o URL ao lado de Invocar URL. Você precisará dele no módulo 5.
    1. No painel de navegação da esquerda, selecione Recursos.
    2. Os métodos da nossa API serão listados à direita. Selecione POST.
    3. Clique no raio azul pequeno.
    4. No campo Corpo da solicitação, cole o seguinte:
    {
    "firstName":"Grace",
    "lastName":"Hopper"
}

    5. Clique no botão azul Teste.

    6. À direita, você verá uma resposta com o Código 200.

    7. Ótimo! Você acabou de criar e testar uma API que chama sua função do Lambda.

Arquitetura da aplicação

Você terminou o módulo 3. É hora de examinar nossa arquitetura:

Diagrama de arquitetura mostrando serviços hospedados na Nuvem AWS, com conexões mostradas de usuários externos a serviços interconectados da AWS.

Adicionamos o API Gateway e o conectamos a nossa função do Lambda existente. Agora, podemos acionar nossa função usando uma chamada API. Ainda não temos a capacidade de gerar essa chamada pelo nosso cliente Web. Antes disso, vamos adicionar nossa tabela de dados no módulo 4 e juntar tudo no módulo 5.

Esta página foi útil para você?

 Feedback
Iniciar o módulo 4

Criar uma tabela de dados