Conceitos básicos da AWS

Criar uma aplicação Web básica

Implantar uma aplicação Web e adicionar interatividade com uma API e um banco de dados

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

Introdução

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 1 e o back-end sem servidor criado no módulo 2.

O que você aprenderá

  • Usar o API Gateway para criar uma nova API
  • Definir métodos HTTP (Hypertext Transfer Protocol) na API
  • Acionar uma função do Lambda a partir de uma API
  • Habilitar CORS em uma API para poder consumir esse mecanismo de um site
  • 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 program interface” (interface de programa de aplicação). Assim, a API RESTful é uma API que implementa esse padrão arquitetônico.

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 mecanismo CORS (Cross Origin Resource Sharing) usa cabeçalhos HTTP para permitir que uma aplicação Web específica seja executada em uma origem (domínio) e tenha permissão de acesso a recursos selecionados de um servidor em outra origem.

Otimizado para bordas Um recurso que usa a infraestrutura global da AWS para servir melhor clientes de todo o mundo.

 Tempo para a conclusão

5 minutos

 Serviços usados

Implementação

  • Criar uma nova API REST
    1. Faça login no Console do API Gateway.
    2. Clique no botão laranja “Create API” (Criar API).
    3. Encontre a caixa REST API (API REST) e clique no botão laranja “Build” (Criar).
    4. Em “Choose the protocol” (Escolher protocolo), selecione REST.
    5. Em “Create new API” (Criar nova API), selecione New API (Nova API).
    6. No campo “API name” (Nome da API), digite HelloWorldAPI.
    7. Selecione “Edge optimized” (Otimizado para borda) no menu suspenso “Endpoint Type” (Tipo de endpoint). Observação: endpoints otimizados para borda são os melhores para clientes que estão espalhados pelo mundo. 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.
    8. Clique no botão azul “Create API” (Criar API). As configurações devem estar conforme mostrado na captura de tela a seguir:
    Full Stack tutorial API settings
  • Criar recurso e método novos
    1. No painel de navegação à esquerda, clique em “Resources” (Recursos) na API HelloWorld.
    2. Com o recurso “/” selecionado, clique em “Create Method” (Criar método) no menu suspenso Action (Ações).
    3. Selecione POST no novo menu suspenso que aparecerá e clique na marca de seleção.
    4. Selecione Lambda Function (Função do Lambda) como tipo de integração.
    5. Digite HelloWorldFunction no campo “Function” (Função).
    6. Clique no botão azul “Save” (Salvar).
    7. Uma mensagem informará que você está concedendo à API criada permissão para chamar a função do Lambda. Clique no botão “OK”.
    8. Com o método POST recém-criado, selecione “Enable CORS” (Habilitar CORS) no menu suspenso Action (Ação).
    9. Mantenha a caixa de marcação POST marcada e clique no botão azul “Enable CORS and replace existing CORS headers” (Habilitar CORS e substituir cabeçalhos CORS existentes).
    Full Stack tutorial EnableCORS

    10. Será exibida uma mensagem solicitando a confirmação das mudanças no método. Clique no botão azul “Yes, replace existing values” (Sim, substituir valores existentes).

    Full Stack tutorial ConfirmMethodChanges
  • Implantar API
    1. Na lista suspensa “Actions” (Ações), selecione “Deploy API” (Implantar API).
    2. Selecione “[New Stage]” (Novo estágio) na lista suspensa “Deployment stage” (Estágio de implantação).
    3. Digite dev em “Stage Name” (Nome do estágio).
    4. Escolha “Deploy” (Implantar).
    5. Copie e salve o URL ao lado de “Invoke URL” (Invocar URL). Você precisará dele no módulo 5.
  • Validar a API
    1. No campo de navegação à esquerda, clique em “Resources” (Recursos).
    2. Os métodos da nossa API serão listados à direita. Clique em “POST”.
    3. Clique no raio azul pequeno.
    4. No campo “Request Body” (Corpo da solicitação), cole o seguinte:
    {
        "firstName":"Grace",
        "lastName":"Hopper"
    }

    5. Clique no botão azul “Test” (Testar).

    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:

full-stack amplify console arch diagram module 3

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.

Este módulo foi útil?

Agradecemos a sua atenção
Gostaríamos de saber do que você gostou.
Desculpe por ter desapontado
Encontrou algo desatualizado, confuso ou incorreto? Envie seus comentários para nos ajudar a melhorar este tutorial.

Criar uma tabela de dados