# \[Exemplo] Enviando dados para o Airtable (POST)

Dados coletados dentro dos bots frequentemente são enviados para um banco de dados externo. Uma maneira fácil de fazer isso é integrando com [Airtable](https://airtable.com). Airtable é uma ferramenta que permite criar uma planilha com a qual você pode se comunicar via API.

{% hint style="info" %}
Por favor, note que o termo *estado do diálogo* refere-se à mesma coisa que *bloco*, no contexto de ferramentas de desenvolvimento.
{% endhint %}

Neste tutorial configuraremos uma integração com o Airtable. Por causa de todo o código parece bastante técnico, mas na verdade é bem fácil.

{% hint style="info" %}
Se você é novo no uso de variáveis no Chatlayer.ai, siga [este](https://docs.chatlayer.ai/chatlayer-documentation-pt-br/integrateandcode/code-action/broken-reference) o tutorial primeiro.
{% endhint %}

* Comece construindo um fluxo curto que você use para coletar alguns dados sobre seu usuário, por exemplo:

![](https://181262846-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LLTwFwbOqJj4dDhg8Ju%2F-M-PoreWhQS6Lfvqz45M%2F-M-QHyYIWIlIVEIjBB38%2Fimage.png?alt=media\&token=94911615-3d1e-4f5c-9936-6ee15f939c8c)

* Este fluxo adiciona as variáveis "customerType" e "firstName" à sessão do usuário.

![](https://181262846-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LLTwFwbOqJj4dDhg8Ju%2F-M-PoreWhQS6Lfvqz45M%2F-M-QIDlYQP0ZnyC02wgU%2Fimage.png?alt=media\&token=64075949-aa7f-48c1-bdec-545c3d85edb8)

* Configure um Airtable que tenha uma coluna para cada variável que você deseja salvar. Linhas serão adicionadas para cada cliente.

![](https://181262846-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LLTwFwbOqJj4dDhg8Ju%2F-M-PoreWhQS6Lfvqz45M%2F-M-QJC8zvRc8JJRy3nmG%2Fimage.png?alt=media\&token=0d46b2ea-925c-4ba2-be14-acb608f4ebe8)

{% hint style="info" %}
Neste tutorial, usaremos [este Airtable](https://airtable.com/invite/l?inviteId=invSGcyaorwSSPjLi\&inviteToken=a6d2dc90da0a95019886b059a10323d827520aa1b46dcf2c528756c3e120189c). Fique à vontade para reutilizá-lo!
{% endhint %}

* No ponto do fluxo onde você deseja enviar os dados para o Airtable, adicione uma Ação contendo um plugin de Código.

{% hint style="info" %}
Quer aprender mais sobre as possibilidades do plug-in de Código? Você pode encontrá-lo [aqui](https://docs.chatlayer.ai/chatlayer-documentation-pt-br/integrateandcode/code-action).
{% endhint %}

* No nosso exemplo, queremos enviar o tipo do cliente e o primeiro nome. Além disso, queremos pular para outro diálogo do bot assim que os dados forem enviados. Comece adicionando esses parâmetros no topo do seu editor de código.

![](https://181262846-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LLTwFwbOqJj4dDhg8Ju%2F-M-PoreWhQS6Lfvqz45M%2F-M-QKhZlCz-hZdO4c8JV%2Fimage.png?alt=media\&token=d8190c60-bf14-4073-aae0-ac80ec52227b)

* Em seguida, adicione o código abaixo ao plugin e salve seu diálogo de Ação.

```javascript
const body = {
    "records": [{
        "fields": {
            "First Name": args.firstName,
            "Customer Type": args.customerType
        }
    }]
}
const airtableResult = await fetch('https://api.airtable.com/v0/(yourAppId)/(yourTableName)', {
    method: 'POST',
    body: JSON.stringify(body),
    headers: {
        'Authorization': 'Bearer (insert token here)',
        'Content-Type': 'application/json'
    }
}).then(r => r.json())

ChatlayerResponseBuilder()
    .setNextDialogState(args.nextDialogState)
    .send()
```

{% hint style="warning" %}
Lembre-se de obter o id do app, o nome da tabela e o token bearer corretos para o seu Airtable. Você pode encontrá-los [aqui](https://airtable.com/api).
{% endhint %}

* Et voilà! Agora, toda vez que um usuário passar pelo seu fluxo, seus dados serão enviados para o Airtable e ele continuará para o diálogo de bot Success.
* Se houver quaisquer erros com sua conexão ao Airtable, você pode encontrá-los na aba de Logs de Erro no Chatlayer.ai.

![](https://181262846-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LLTwFwbOqJj4dDhg8Ju%2F-M-PoreWhQS6Lfvqz45M%2F-M-QGpdscZHQddl5ltw9%2Fimage.png?alt=media\&token=623ad622-6b08-419c-9858-8fd70bcdaa7c)