Se você deseja criar sua própria interface de chat com o cliente no seu aplicativo, você pode estar criando um canal customizado para enviar e receber mensagens via webhook.

Para começar crie um canal customizado indo em Configurações > Canais > Novo canal > Customizado

Untitled

Na tela de criação de canal, coloque uma descrição para identificar o canal e coloque um endpoint para receber atualizações de webhook do Kinbox (Como quando um agente enviar uma nova mensagem)

Untitled

Após preencher clique em Criar canal e seu canal está pronto para receber e enviar mensagens.

Enviando mensagens para o Kinbox

Vamos supor que você criou um aplicativo customizado de chat e integrou com o Kinbox nos passos acima. Então um cliente enviou mensagem no seu aplicativo e você quer que essa mensagem apareça no Kinbox.

Nesse caso você precisa fazer uma chamada de API do seu sistema para o endpoint do canal que você criou no passo acima. O endereço de API está onde tem escrito: “Endpoint para o Kinbox receber mensagens”

Untitled

Você deve enviar um POST para esse endereço e passar o seguinte payload:

{
    sender: string, // identificador único do cliente (ex: número do telefone)
    content: string, // string texto da mensagem ou url caso seja mídia
    type: "text" | "image" | "video" | "audio" | "file" // tipo da mensagem
    contactInfo?: { // dados do contato que enviou a mensagem
        name?: string
        email?: string
        avatar?: string
    },    
}

// Enviar também no header o "x-api-token" com o seu token de ambiente do Kinbox

No payload acima você deve enviar no header o “x-api-token”. Para obter esse token vá em Configurações > Integrações > API

Abaixo um exemplo de como seria esse payload:

// Enviando um texto
{
    sender: "85997281712",
    content: "Oi, tudo bem?",
    type: "text",
    contactInfo: {
        name: "Fulano",
        email: "[email protected]",
        avatar: "<https://i.imgur.com/C0ReCyR.jpeg>"
    },    
}

// Enviando uma imagem
{
    sender: "85997281712",
    content: "<https://i.imgur.com/mboJHy6.jpeg>",
    type: "image",
    contactInfo: {
        name: "Fulano",
        email: "[email protected]",
        avatar: "<https://i.imgur.com/C0ReCyR.jpeg>"
    },    
}

Recebendo mensagens dos agentes