# Tutorial: Crie uma aplicação de bate-papo de WebSocket com uma API de WebSocket, o Lambda e o DynamoDB
<a name="websocket-api-chat-app"></a>

Neste tutorial, você criará uma aplicação de bate-papo sem servidor com uma API WebSocket. Com uma API WebSocket, você pode oferecer suporte à comunicação bidirecional entre clientes. Os clientes podem receber mensagens sem precisar pesquisar atualizações.

Este tutorial leva aproximadamente 30 minutos para ser concluído. Primeiro, você usará um modelo de CloudFormation para criar funções do Lambda que lidarão com solicitações de API, bem como uma tabela do DynamoDB que armazena suas IDs de cliente. Depois, você usará o console do API Gateway para criar uma API WebSocket que se integrará às suas funções do Lambda. Por fim, você testará sua API para verificar se as mensagens foram enviadas e recebidas.

![\[Visão geral da arquitetura da API que você cria neste tutorial.\]](http://docs.aws.amazon.com/pt_br/apigateway/latest/developerguide/images/ws-chat-app.png)


Para concluir esse tutorial, você precisa de uma conta da AWS e de um usuário do AWS Identity and Access Management com acesso ao console. Para obter mais informações, consulte [Configurar para usar o API Gateway](setting-up.md).

Você também precisa que o `wscat` se conecte à sua API. Para obter mais informações, consulte [Use `wscat` para se conectar a uma API do WebSocket e enviar mensagens a ela](apigateway-how-to-call-websocket-api-wscat.md).

**Topics**
+ [Etapa 1: Criar funções do Lambda e uma tabela do DynamoDB](#websocket-api-chat-app-create-dependencies)
+ [Etapa 2: Criar uma API WebSocket](#websocket-api-chat-app-create-api)
+ [Etapa 3: testar sua API](#websocket-api-chat-app-invoke-api)
+ [Etapa 4: limpar](#websocket-api-chat-app-cleanup)
+ [Próximas etapas: Automatize com CloudFormation](#websocket-api-chat-app-next-steps)

## Etapa 1: Criar funções do Lambda e uma tabela do DynamoDB
<a name="websocket-api-chat-app-create-dependencies"></a>

Baixe e descompacte [o modelo de criação de aplicativos para CloudFormation](samples/ws-chat-app-starter.zip). Você usará esse modelo para criar uma tabela do Amazon DynamoDB para armazenar as IDs de cliente do aplicativo. Cada cliente conectado tem uma ID exclusiva que usaremos como chave de partição da tabela. Este modelo também cria funções do Lambda que atualizam suas conexões de cliente no DynamoDB e lidam com o envio de mensagens para clientes conectados.

**Como criar uma pilha do CloudFormation**

1. Abra o console do CloudFormation em [https://console.aws.amazon.com/cloudformation](https://console.aws.amazon.com/cloudformation/).

1. Selecione **Create stack (Criar pilha)** e **With new resources (standard) (Com novos recursos (padrão))**.

1. Em **Specify template (Especificar modelo)**, escolha **Upload a template file (Fazer upload de um arquivo de modelo)**.

1. Selecione o modelo que você baixou.

1. Escolha **Next (Próximo)**. 

1. Em **Nome da pilha**, insira **websocket-api-chat-app-tutorial** e escolha **Avançar**.

1. Para **Configurar opções de pilha**, escolha **Avançar**.

1. Para **Capabilities** (Recursos), reconheça que CloudFormation pode criar recursos do IAM em sua conta.

1. Escolha **Próximo** e, depois, **Enviar**.

CloudFormationO fornece os recursos especificados no modelo. Pode demorar alguns minutos para concluir o provisionamento de seus recursos. Quando o status da sua pilha do CloudFormation for **CREATE\$1COMPLETE**, você estará pronto para passar para a próxima etapa.

## Etapa 2: Criar uma API WebSocket
<a name="websocket-api-chat-app-create-api"></a>

Você criará uma API WebSocket para lidar com conexões de clientes e rotear solicitações para as funções do Lambda que criou na Etapa 1.



**Como criar uma API WebSocket**

1. Inicie uma sessão no console do API Gateway em [https://console.aws.amazon.com/apigateway](https://console.aws.amazon.com/apigateway).

1. Selecione **Criar API**. Depois, em **WebSocket API** (API WebSocket), escolha **Build** (Criar).

1. Em **API name (Nome da API)**, insira **websocket-chat-app-tutorial**.

1. Em **Tipo de endereço IP**, selecione **IPv4**.

1. Em **Route selection expression** (Expressão de seleção de rota), insira **request.body.action**. A expressão de seleção de rota determina qual rota o API Gateway invoca quando um cliente envia uma mensagem.

1. Escolha **Next (Próximo)**.

1. Em **Predefined routes** (Rotas predefinidas), escolha **Add \$1connect** (Adicionar \$1connect), **Add \$1disconnect** (Adicionar \$1disconnect) e **Add \$1default** (Adicionar \$1default). As rotas **\$1connect** e **\$1disconnect** são rotas especiais que o API Gateway invoca automaticamente quando um cliente se conecta ou se desconecta de uma API. O API Gateway invoca a rota `$default` quando nenhuma outra rota corresponde a uma solicitação.

1. Em **Custom routes** (Rotas personalizadas), escolha **Add custom route** (Adicionar rota personalizada). Em **Route key** (Chave de rota), insira **sendmessage**. Essa rota personalizada lida com mensagens enviadas para clientes conectados.

1. Escolha **Next (Próximo)**.

1. Em **Attach integrations** (Anexar integrações), para cada rota e **Integration type** (Tipo de integração), escolha Lambda.

   Em **Lambda**, escolha a função do Lambda correspondente que você criou com o CloudFormation na Etapa 1. O nome de cada função corresponde a uma rota. Por exemplo, para a rota **\$1connect**, escolha a função chamada **websocket-chat-app-tutorial-ConnectHandler**.

1. Revise o estágio criado pelo API Gateway para você. Por padrão, o API Gateway cria um nome de estágio `production` e implanta automaticamente sua API nesse estágio. Escolha **Next (Próximo)**.

1. Selecione **Create and deploy** (Criar e implantar).

## Etapa 3: testar sua API
<a name="websocket-api-chat-app-invoke-api"></a>

Depois, você testará sua API para verificar se ela está funcionando corretamente. Use o comando `wscat` para se conectar à API.

**Como obter a URL para invocar a sua API**

1. Inicie uma sessão no console do API Gateway em [https://console.aws.amazon.com/apigateway](https://console.aws.amazon.com/apigateway).

1. Selecione a API.

1. Escolha **Stages** (Estágios) e, depois, **production** (produção).

1. Observe o **URL WebSocket** da API. O URL deve ser semelhante a `wss://abcdef123.execute-api.us-east-2.amazonaws.com/production`.

**Como se conectar à sua API**

1. Use o comando a seguir para se conectar à sua API. Quando você se conecta à API, o API Gateway invoca a rota `$connect`. Quando essa rota é invocada, ela chama uma função do Lambda que armazena seu ID de conexão no DynamoDB.

   ```
   wscat -c wss://abcdef123.execute-api.us-west-2.amazonaws.com/production
   ```

   ```
   Connected (press CTRL+C to quit)
   ```

1. Abra um novo terminal e execute o comando **wscat** novamente com os parâmetros a seguir.

   ```
   wscat -c wss://abcdef123.execute-api.us-west-2.amazonaws.com/production
   ```

   ```
   Connected (press CTRL+C to quit)
   ```

   Isso fornece dois clientes conectados que podem trocar mensagens.

**Para enviar uma mensagem**
+  O API Gateway determina qual rota invocar com base na expressão de seleção de rotas da API. A expressão de seleção de rotas da sua API é `$request.body.action`. Como resultado, o API Gateway invoca a rota `sendmessage` quando você envia a seguinte mensagem:

  ```
  {"action": "sendmessage", "message": "hello, everyone!"}
  ```

  A função do Lambda associada à rota invocada coleta os IDs do cliente do DynamoDB. Depois, a função chama a API de gerenciamento do API Gateway e envia a mensagem para esses clientes. Todos os clientes conectados recebem a seguinte mensagem:

  ```
  < hello, everyone!
  ```

**Como invocar a rota \$1default da API**
+ O API Gateway invocará a rota padrão da API quando um cliente envia uma mensagem que não corresponde às rotas definidas. A função do Lambda associada à rota `$default` usa a API de gerenciamento do API Gateway para enviar informações do cliente sobre sua conexão.

  ```
  test
  ```

  ```
  Use the sendmessage route to send a message. Your info: {"ConnectedAt":"2022-01-25T18:50:04.673Z","Identity":{"SourceIp":"192.0.2.1","UserAgent":null},"LastActiveAt":"2022-01-25T18:50:07.642Z","connectionID":"Mg_ugfpqPHcCIVA="}
  ```

**Para se desconectar de sua API**
+ Pressione **CTRL\$1C** para se desconectar de sua API. Quando um cliente se desconecta da sua API, o API Gateway invoca a rota `$disconnect` de sua API. A integração do Lambda para a rota `$disconnect` de sua API remove o ID da conexão do DynamoDB.

## Etapa 4: limpar
<a name="websocket-api-chat-app-cleanup"></a>

Para evitar custos desnecessários, exclua os recursos que você criou como parte desse tutorial. As etapas a seguir excluem a API WebSocket e sua pilha do CloudFormation.

**Como excluir uma API WebSocket**

1. Inicie uma sessão no console do API Gateway em [https://console.aws.amazon.com/apigateway](https://console.aws.amazon.com/apigateway).

1. Na página **APIs**, selecione sua API do `websocket-chat-app-tutorial`. Escolha **Ações**, escolha **Excluir** e, em seguida, confirme sua escolha.

**Para excluir uma pilha do CloudFormation**

1. Abra o console do CloudFormation em [https://console.aws.amazon.com/cloudformation](https://console.aws.amazon.com/cloudformation/).

1. Selecione sua pilha do CloudFormation.

1. Escolha **Excluir** e, em seguida, confirme sua escolha.

## Próximas etapas: Automatize com CloudFormation
<a name="websocket-api-chat-app-next-steps"></a>

Você pode automatizar a criação e a limpeza de todos os recursos da AWS envolvidos neste tutorial. Para ver um modelo do CloudFormation que crie essa API e todos os recursos relacionados, consulte [ws-chat-app.yaml](samples/ws-chat-app.zip).