# Configure sua integração com API

Um passo do Chatlayer **API** etapa está disponível nos [**Ação**](https://docs.chatlayer.ai/bot-answers/dialog-state/action-bot-dialog) blocos para permitir que você crie mensagens do bot com base em informações específicas do usuário e outros dados externos, e para redirecionar seus usuários para fluxos diferentes com base na sua própria lógica de negócio.&#x20;

Você pode usar esta solução em qualquer plataforma que suporte receber e responder a requisições HTTP.

O passo de API envia uma requisição para o seu servidor backend.

### Enviar uma requisição de API

Para configurar seu passo de API:

1. Solte um [**Ação**](https://docs.chatlayer.ai/chatlayer-documentation-pt-br/buildabot/flow-logic/dialog-state/action-bot-dialog) bloco para o seu [canvas](https://docs.chatlayer.ai/chatlayer-documentation-pt-br/navegacao/bot-builder/flows).

<figure><img src="https://181262846-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LLTwFwbOqJj4dDhg8Ju%2Fuploads%2FyKxJITNKYZAjbuH1Tcud%2FScreenshot%202024-07-31%20at%2017.17.05.png?alt=media&#x26;token=9f7ab17c-18e0-4cea-9abe-98dd59b0655a" alt="" width="375"><figcaption><p>Adicione um passo de Ação de API.</p></figcaption></figure>

2. Clique em API.
3. Configure seus parâmetros. Veja abaixo para mais detalhes.

<details>

<summary>Métodos HTTPS</summary>

O passo de API suporta 5 métodos HTTPS:

* POST
* GET
* DELETE
* PUT&#x20;
* PATCH

<img src="https://181262846-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LLTwFwbOqJj4dDhg8Ju%2Fuploads%2F2O2fnyzQieeFdq5LYRGk%2FScreenshot%202024-09-05%20at%2013.47.11.png?alt=media&#x26;token=05ee7015-add3-40d4-a03f-4b90dcf710d2" alt="" data-size="original">

</details>

{% hint style="warning" %}
Você só pode definir um corpo de requisição quando seu método de requisição for POST ou DELETE.
{% endhint %}

{% tabs %}
{% tab title="Query" %}

<figure><img src="https://181262846-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LLTwFwbOqJj4dDhg8Ju%2Fuploads%2FPOmOcnLqQULS9xHk0tsg%2FScreenshot%202024-09-05%20at%2013.53.21.png?alt=media&#x26;token=885d9f43-9f23-44d7-8e9f-61690ce1a590" alt="" width="375"><figcaption><p>A aba Query dentro do seu passo de API.</p></figcaption></figure>

Sob a **Query** aba, adicione parâmetros de query e/ou um payload de corpo definindo combinações chave-valor. Cada chave pode ter 3 tipos possíveis de valor:

* **text**: texto estático.
* **variável**: uma [sessão do usuário](https://docs.chatlayer.ai/chatlayer-documentation-pt-br/bot-answers/session) variável. O valor da variável será armazenado como valor para a chave. Notação de ponto e de array são suportadas, por exemplo: `users[0].firstname`
* **dialogstate**: selecione um estado de diálogo no menu. O ID do estado de diálogo será armazenado como valor para a chave. Este ID pode ser usado para redirecionar o usuário para um determinado estado de diálogo com base na sua lógica de negócio ao retornar a resposta da API.
  {% endtab %}

{% tab title="Autorização" %}

<figure><img src="https://181262846-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LLTwFwbOqJj4dDhg8Ju%2Fuploads%2F6oWfODBxGuf0GV5d2VAv%2FScreenshot%202024-09-05%20at%2013.54.01.png?alt=media&#x26;token=e92d0918-519b-4038-b0d4-fc4e03d2a586" alt="" width="375"><figcaption><p>A aba Autorização dentro do seu passo de API.</p></figcaption></figure>

O **Autorização** aba tem os seguintes componentes:

* **Autenticação básica**: exibirá os campos para preencher nome de usuário e senha.

<figure><img src="https://181262846-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LLTwFwbOqJj4dDhg8Ju%2Fuploads%2FR4sXoFbrZd5VFK0y8eI3%2FScreenshot%202024-07-31%20at%2017.31.44.png?alt=media&#x26;token=1cdd6ef7-023f-4385-982e-a21f9254c6dd" alt="" width="362"><figcaption><p>Autorização via autenticação básica.</p></figcaption></figure>

* **Token Bearer**: exibirá o campo Token para ser preenchido.

<figure><img src="https://181262846-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LLTwFwbOqJj4dDhg8Ju%2Fuploads%2FNhzfHPODSUdvg8htRZz9%2FScreenshot%202024-07-31%20at%2017.32.54.png?alt=media&#x26;token=047fb08a-26e8-4a31-b021-beccbc2f1c64" alt="" width="362"><figcaption><p>Autorização via token Bearer.</p></figcaption></figure>
{% endtab %}

{% tab title="Cabeçalhos" %}

<figure><img src="https://181262846-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LLTwFwbOqJj4dDhg8Ju%2Fuploads%2F8vpOZJKQsllRA44Wq8IY%2FScreenshot%202024-09-05%20at%2013.54.32.png?alt=media&#x26;token=f0a8c830-0be1-4a0a-9493-e0671236e63b" alt="" width="375"><figcaption><p>A aba Cabeçalhos dentro do seu passo de API.</p></figcaption></figure>

A aba Cabeçalhos é onde você configura seus cabeçalhos.
{% endtab %}

{% tab title="Corpo" %}

<figure><img src="https://181262846-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LLTwFwbOqJj4dDhg8Ju%2Fuploads%2FHNjGxFJUc0PBkG7W9NGm%2FScreenshot%202024-09-05%20at%2013.55.11.png?alt=media&#x26;token=c91b1a0c-962d-465d-87e4-3660b74552f5" alt="" width="375"><figcaption><p>A aba Corpo dentro do passo de API.</p></figcaption></figure>

**Corpo** é onde você pode definir um corpo de requisição em todos os métodos HTTPS.

Sob a **Corpo** aba, adicione parâmetros de query e/ou um payload de corpo definindo combinações chave-valor. Cada chave pode ter 3 tipos possíveis de valor:

* **text**: texto estático.
* **variável**: uma [sessão do usuário](https://docs.chatlayer.ai/chatlayer-documentation-pt-br/bot-answers/session) variável. O valor da variável será armazenado como valor para a chave. Notação de ponto e de array são suportadas, por exemplo: `users[0].firstname`
* **dialogstate**: selecione um estado de diálogo no menu. O ID do estado de diálogo será armazenado como valor para a chave. Este ID pode ser usado para redirecionar o usuário para um determinado estado de diálogo com base na sua lógica de negócio ao retornar a resposta da API.

Neste exemplo, representando uma transferência de dinheiro, enviamos cinco chaves no payload do corpo de uma requisição HTTPS POST para nosso endpoint de API <https://chatlayer-integration-demo.glitch.me/transaction>.

<figure><img src="https://181262846-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LLTwFwbOqJj4dDhg8Ju%2Fuploads%2FwBjBotV5oJ1vcHGe63n6%2FScreenshot%202024-09-05%20at%2013.57.02.png?alt=media&#x26;token=99d91aa7-05ad-474b-9f85-a263aa74240f" alt="" width="375"><figcaption><p>Exemplo de payload do corpo.</p></figcaption></figure>

* O **amount** a chave terá o valor da variável de sessão do usuário `transfer_amount` (ex: 500).
* O **destination** a chave terá o valor da variável de sessão do usuário `transfer_destination` (ex: Elon Musk).
* O **accountType** a chave terá o valor da variável de sessão do usuário `card_type` (ex: savings\_account).
* O **transactionSuccess** a chave terá o identificador do estado de diálogo para o estado de diálogo 'transação bem-sucedida'. Este identificador pode ser usado na resposta desta requisição de API para redirecionar o usuário para um novo estado de diálogo.
* O **transactionNoMoney** a chave terá o identificador do estado de diálogo para o estado de diálogo 'transação malsucedida'. Este identificador pode ser usado na resposta desta requisição de API para redirecionar o usuário para um novo estado de diálogo.
* O **test** a chave terá o valor '5'.

Isso resultará no seguinte payload do corpo:

```javascript
{
    "amount": 500,
    "destination": "Elon Musk",
    "accountType": "savings_account",
    "transactionSuccess": "successful transaction",
    "transactionNoMoney": "unsuccessful transaction",
    "test": 5
}
```

{% endtab %}

{% tab title="Configuração" %}

<figure><img src="https://181262846-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LLTwFwbOqJj4dDhg8Ju%2Fuploads%2FD2ClzeEhzCpgS9voSS3w%2FScreenshot%202024-09-05%20at%2013.55.47.png?alt=media&#x26;token=dbd72675-b43d-47bf-9ff0-10591c279516" alt="" width="375"><figcaption><p>A aba Configuração dentro de um passo de API.</p></figcaption></figure>

**Configuração** é onde, se você tiver uma configuração de API em [Configurações>API](https://docs.chatlayer.ai/integrations/custom-back-end-integrations/advanced-api-integrations#api-ssl-settings), você as verá aqui.
{% endtab %}
{% endtabs %}

{% hint style="info" %}
Se [seu bot é multilíngue](https://docs.chatlayer.ai/chatlayer-documentation-pt-br/nlp/languages/multilanguage-bots)[l](https://docs.chatlayer.ai/chatlayer-documentation-pt-br/nlp/languages/multilanguage-bots), se a resposta da API enviar mensagens de agente de volta ao usuário e o agente suportar múltiplos idiomas, não esqueça de enviar o idioma do usuário na requisição. O idioma do usuário está disponível no [sessão do usuário](https://docs.chatlayer.ai/chatlayer-documentation-pt-br/bot-answers/session) variável `locale`. Seu serviço backend pode usar essa configuração de idioma para enviar a resposta no `idiomaPreferido`.
{% endhint %}

### Escutar por uma resposta da API

Você não precisa configurar o plugin de API para escutar por uma resposta. Isso é feito automaticamente e o **API** passo irá escutar o que sua API retornar.&#x20;

<details>

<summary>Variáveis de retorno da API</summary>

O **API** o passo suporta 3 tipos de variáveis de retorno:

* `sessão`: Um objeto de sessão para salvar dados na sessão do usuário. A sessão tem 2 campos obrigatórios:
  * `namespace`: um namespace de chave. O objeto de dados será armazenado nesta chave de namespace na sessão do usuário. Você pode acessar este objeto no Chatlayer.ai usando interpolação: *{namespace.dataKey}.*
  * `data`: um objeto que será salvo nos dados de sessão do usuário na chave de namespace.
* `mensagens`: um array de mensagens para enviar de volta ao canal de interface do usuário. A estrutura dos diferentes tipos de mensagem (como texto, botões, respostas rápidas, carrosséis, listas, mídia, etc.) está disponível no [estrutura de mensagem de chat](https://docs.chatlayer.ai/chatlayer-documentation-pt-br/integrateandcode/chat-message-structure-for-apis).
* `action`: um objeto definindo uma ação, como redirecionar o usuário para um próximo estado de diálogo na conversa.
  * `nextDialogstate`: um identificador de estado de diálogo para redirecionar o usuário para um próximo estado de diálogo no fluxo de conversa.

As 3 opções acima são executadas na ordem mostrada acima: variáveis de sessão são definidas primeiro, então as mensagens são enviadas e então você irá pular para o próximo estado de diálogo.&#x20;

**Exemplo**

Você pode encontrar um exemplo JSON para esses 3 casos no trecho de código abaixo:

```javascript
const result = {
  session: {
    namespace: 'myNamespace',
    data: { variable: 'test123' },
  },
  messages: [{ type: 'text', config: { textMessages: [{ text: 'random message 1' }] } }],
  action: {
    nextDialogstate: 'dialogstate-123-abc',
  },
};
```

</details>

{% hint style="warning" %}
Certifique-se de incluir o tipo de conteúdo correto no cabeçalho: `content-type: application/json;`
{% endhint %}

### Exemplo

Este exemplo demonstra um endpoint de API para transferir uma quantia de dinheiro de um tipo de conta (corrente ou poupança) para alguém. Nós redirecionaremos o usuário para um determinado estado de diálogo com base no resultado da transação.

```javascript
app.post('/transaction', function (req, res) {
  let nextDialogstate; 
  const { amount, destination, accountType, transactionSuccess, transactionNoMoney = req.body; 

  // obter tipo de conta (corrente - conta poupança) 
  const account = account_synonyms[accountType];
 
  if( accounts[account].amount + accounts[accounthlimit — amount < ) {
    nextDialogstate = transactionNoMoney 
  } else { 
    // transferir valor 
    accounts[account].amount —= amount;
    nextDialogstate = transactionSuccess; 
  } 

  res.json({
    action: { 
      nextDialogstate,
    }, 
    session: {
      namespace: 'account', 
      data: {
        limit: accounts[account].limit, 
        amount: accounts[account].amount 
      }
    },
  })
});
```

Recebemos o objeto payload do corpo conforme definido no passo do Chatlayer **API** Se o usuário não tiver uma quantia suficiente de dinheiro em sua conta, definimos o próximo estado de diálogo como 'transactionNoMoney'. Caso contrário, subtraímos o valor desejado e definimos o próximo estado de diálogo como 'transactionSuccess'.

Como resposta à requisição, enviamos o próximo estado de diálogo para redirecionar o usuário para esse estado e salvamos a quantia de dinheiro e o limite da conta na sessão dele sob o namespace account. Esses dados podem ser usados nesse próximo estado de diálogo.

<figure><img src="https://181262846-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LLTwFwbOqJj4dDhg8Ju%2Fuploads%2FYwhMT2PdlU63VHQ56hGT%2FScreenshot%202024-09-05%20at%2014.25.39.png?alt=media&#x26;token=f1627cc9-c559-4bad-b620-d7c3a2b86bcc" alt="" width="375"><figcaption></figcaption></figure>

Como solução alternativa você também poderia enviar essa mensagem de chat como resposta das requisições do plugin de API usando a chave messages.
