Como o SDK embarca a telefonia da Callix dentro de uma aplicação de terceiros: arquitetura dos pacotes, fluxo de autenticação, modelo de estados do operador, escopo de cobertura e pré-requisitos de integração.
Definição
O SDK da Callix coloca o telefone dentro da aplicação do cliente. O agente atende, disca, coloca em espera e qualifica a chamada sem sair da tela onde já trabalha — e o áudio trafega pelo próprio browser, sem instalação de softphone, plugin ou VPN na máquina dele.
Tecnicamente, é um softphone WebRTC distribuído como biblioteca, com uma máquina de estados de operador em volta. A aplicação parceira constrói a interface que quiser; a Callix entrega a telefonia, o estado do agente e o contexto da chamada.
A divisão de responsabilidades
A aplicação parceira assume a construção da interface de atendimento e, com isso, ganha o controle total dela — o que aparece na tela durante a chamada, onde o telefone fica, o que é gravado no banco próprio quando a ligação termina. A Callix assume a telefonia, a máquina de estados e o contexto operacional.
O que a integração passa a ter
Chamada de entrada e de saída por WebRTC, sem instalar nada na estação do agente.
Disponível, em pausa, offline, tocando, em chamada, pós-atendimento — empurrado em tempo real.
Iniciar, atender, rejeitar, desligar, colocar e tirar de espera, mudo de entrada e de saída, volume.
Campanha, lista e contato da chamada ativa, estruturados, prontos para casar com o cadastro próprio.
As pausas configuradas na plataforma chegam prontas, com id e nome, para montar o seletor.
Listas de qualificação de sucesso e de descarte, e o encerramento do pós-atendimento.
Contexto operacional
Sem SDK, o agente opera em duas telas: o sistema onde estão o cliente e o histórico, e a tela de operação da Callix, onde está o telefone. Ele copia número de um lado para o outro, alterna janelas durante a ligação e registra o desfecho duas vezes — uma na qualificação da Callix, outra no sistema próprio. Erro de digitação e registro esquecido nascem nessa fronteira.
Três bibliotecas publicadas no npm sob @callixbrasil
Um pacote é uma biblioteca que o desenvolvedor instala com um comando e passa a usar no próprio código. São três, e a divisão não é arbitrária: cada um roda num lugar diferente, e é isso que mantém a chave de API fora do browser.
Roda no servidor do parceiro
Faz uma coisa só: troca a chave de API por um token de sessão de um usuário. É o único pedaço que conhece o segredo. Superfície mínima — uma classe, um método.
Roda no browser do agente
O núcleo. Registra o softphone (SIP/WebRTC), mantém a máquina de estados do operador, expõe a chamada atual, as pausas e as qualificações. Não depende de framework.
Camada opcional, para quem usa React
Empacota o núcleo em 17 hooks e um provider. É conveniência: quem não usa React fala direto com o núcleo, que expõe o mesmo estado por assinatura.
Sobre a exigência de framework
React não é obrigatório. O pacote client-sdk exporta a classe
CallixClientSdk e os signals de estado (.get() e
.subscribe()), o que permite consumo a partir de Angular, Vue, Svelte ou JavaScript puro.
A ressalva: documentação e exemplos oficiais cobrem React, então esse é o caminho mais curto — quem já
usa React reduz bastante o esforço de integração.
A fronteira de confiança e o caminho do áudio
Quatro atores e uma linha que a chave de API nunca cruza. O áudio não passa pelo servidor do parceiro — vai direto do browser do agente para a plataforma.
server-sdk: o browser recebe um token de sessão descartável,
nunca a chave de API. Quem obtiver o token consegue operar como aquele agente; quem obtivesse a chave de
API operaria como qualquer um.
localhost é a exceção, para desenvolvimento).O conceito central da integração
Aqui está a inversão em relação a uma API REST convencional. A aplicação não pergunta se a chamada foi atendida. Ela declara: quando o estado for X, mostre isto. O SDK empurra o estado; a tela é uma consequência.
Os comandos — ficar disponível, entrar em pausa, discar, desligar — são intenções sem retorno. Não devolvem sucesso nem erro. Quem confirma é a próxima transição de estado. Um comando inválido no estado atual é descartado silenciosamente.
callRinging volta para idle se a chamada cair antes de ser atendida,
goOffline() vale a partir de quase todo estado, e error é alcançável de qualquer
ponto.
| Estado | Significa | O que a interface faz / pode fazer |
|---|---|---|
| starting | subindo o softphone | tela de carregamento |
| idle | disponível, aguardando | libera o discador |
| onBreak | em pausa | mostra qual pausa e o tempo |
| offline | fora de operação | botão de ficar disponível |
| callRinging | chamada de campanha chegando; o SDK busca o contexto e atende sozinho | abre a ficha do cliente quando useCallOperatorCurrentCallInfo() chega |
| manualCallSetup | montando a chamada manual | cancelar |
| manualCallRinging | chamando o destino | cancelar |
| callInProgress | conversa estabelecida | espera, mudo, desligar, cronômetro |
| afterCall | pós-atendimento | formulário de desfecho + qualificação |
| error | falha do operador | mensagem e caminho de recuperação |
Onde a máquina de estados executa
A máquina roda no browser — o SDK embarca o xstate como dependência. Em
execução medida, a transição entre o comando e a mudança de estado leva cerca de
5 ms, rápido demais para uma ida e volta de rede. O estado local é otimista
e a sincronização com o backend acontece por fora. Na prática isso favorece a responsividade da
interface, mas significa que estado na tela não é prova de estado no servidor: para auditoria de
disponibilidade de agente, a fonte de verdade é o relatório da plataforma.
O restante é interface, construída pelo parceiro
A superfície de contato com o SDK é pequena. Estes três blocos cobrem autenticação, inicialização e consumo de estado; tudo além disso é a interface que a aplicação parceira já sabe construir.
// roda no backend do parceiro — a chave nunca sai daqui const callix = new CallixServerSdk(dominio, process.env.CALLIX_API_KEY); const sessao = await callix.createUserSessionForClientSdk(loginDoAgente); // devolve para a tela apenas isto: return { userSessionToken: sessao.userSessionToken };
A autenticação do usuário da aplicação acontece antes desta linha, e é ela que determina qual login Callix pode ser operado.
<CallixClientProvider domain={dominio} userSessionToken={token}>
<TelaDeAtendimento />
</CallixClientProvider>
A partir daqui, qualquer componente dentro dessa árvore enxerga o operador.
const estado = useCallOperatorState(); // { state: 'callInProgress', call } const { makeManualCall } = useCallOperatorControls(); const info = useCallOperatorCurrentCallInfo(); // campanha, lista, contato // telefone e rótulo do contato vêm daqui, não de call.data — chega logo após callRinging if (info?.type === 'campaign') return <FichaDoCliente contato={info.info.campaignContact} />;
São 17 hooks no total, cobrindo estado, controles da chamada, áudio, pausas e qualificações. Nenhum deles exige conhecimento de WebRTC.
Termos que aparecem neste documento
| Termo | Definição | Relevância para a integração |
|---|---|---|
npm |
repositório de bibliotecas do ecossistema JavaScript | é de onde os três pacotes são instalados; estão públicos |
| pacote | biblioteca versionada, instalada por um comando | atualizar o SDK é trocar um número no arquivo de dependências |
| React | biblioteca de construção de interfaces web | há um pacote dedicado a ela; sem React a integração é possível, com mais trabalho |
| hook | função que entrega um pedaço de estado vivo ao componente | é a forma de ler o estado do operador (useCallOperatorState) |
| provider | componente que embrulha a tela e distribui algo a tudo que está dentro | CallixClientProvider é onde o SDK é inicializado |
| Next.js | framework que reúne backend e frontend no mesmo projeto | não é requisito — é o que o exemplo oficial usa, por conveniência |
| WebRTC | padrão que permite ao browser transportar voz | dispensa a instalação de softphone e exige HTTPS |
| SIP | protocolo de sinalização de chamada (tocar, atender, desligar) | o SDK registra o agente como um ramal; a aplicação parceira não lida com isso |
| token de sessão | credencial temporária de um usuário específico | é o que trafega para o browser no lugar da chave de API |
| signal | valor que notifica os inscritos quando muda | é como o núcleo expõe estado fora do React |
O que está e o que não está coberto
O SDK cobre voz. Os três pacotes não expõem chat, WhatsApp, e-mail ou qualquer canal além de telefonia — toda a superfície pública é telefônica. Integrações de outros canais seguem por caminhos distintos da plataforma.
Dentro de voz, a operação do agente tem duas origens de chamada: a campanha entrega a
chamada ao agente, e o agente disca manualmente. É o que CallInfo reflete — os dois únicos
formatos de contexto que o SDK entrega são campaign e manual.
| Origem da chamada | Suportada | Contexto de negócio entregue |
|---|---|---|
| Campanha — o discador entrega a chamada ao agente | sim | campanha, lista e contato, estruturados |
| Manual — o agente disca para um número | sim | qualificações disponíveis para o pós-atendimento |
Atendimento receptivo de fila não é atendido pelo SDK. Uma operação que precise receber chamadas de fila continua na tela de operação da Callix para essa parte — o SDK não substitui esse fluxo. Vale confirmar a origem das chamadas antes de dimensionar a integração: se a operação for majoritariamente receptiva, o SDK cobre menos do que parece à primeira vista.
userSessionDropped). O monitoramento da operação continua pela API e pelos relatórios da plataforma.Faltou alguma capacidade?
Se o caso de uso do seu projeto não é coberto pelo que está descrito aqui — receptivo de fila, outro canal, uma capacidade que fez falta — escreva para produtos@callix.com.br com o assunto Caso de uso - SDK.
Pontos a definir no desenho da integração
O operador entra em operação automaticamente
Ao inicializar o SDK, o operador vai de starting direto para idle, sem comando
explícito. Na prática, abrir a tela coloca o agente online e elegível a receber discagem de campanha. Se
a aba ficar aberta em segundo plano, o agente pode receber chamada sem atender, o que gera abandono e
afeta o resultado da campanha como um todo.
Não há parâmetro de inicialização para alterar esse comportamento. A abordagem é chamar
goOffline() ou enterOnBreak() assim que o estado deixa starting,
conforme a política de operação desejada.
Uma sessão por usuário
Criar uma sessão invalida as anteriores do mesmo login Callix. Duas abas da aplicação
competem entre si, e o uso simultâneo da tela nativa da Callix derruba a sessão do SDK. A integração
precisa garantir uma sessão ativa por agente e tratar o evento userSessionDropped,
comunicando a situação na interface em vez de degradar silenciosamente.
Escala do controle de volume
A referência do controle de volume indica a faixa 0–100, enquanto o exemplo oficial e o
comportamento esperado do elemento de áudio operam em 0–1. Recomenda-se adotar
0–1 e confirmar o comportamento em teste antes de expor o controle ao agente.
O que precisa estar definido antes de estimar
| Questão | O que a resposta determina |
|---|---|
| A tela de atendimento é construída em React? | Sim → uso do pacote de hooks, caminho documentado. Não → integração pelo núcleo, sem exemplo de referência. |
| Existe backend próprio, capaz de guardar um segredo? | Pré-requisito. Sem servidor não há forma segura de emitir o token de sessão. |
| A aplicação é servida por HTTPS? | Pré-requisito. Sem contexto seguro o browser não concede acesso ao microfone. |
| Como o usuário da aplicação se relaciona com o usuário da Callix? | O token é emitido por login Callix; esse mapeamento é o ponto de partida da integração. |
| As chamadas nascem de campanha, de discagem manual, ou de fila receptiva? | Campanha e manual são cobertas pelo SDK. Fila receptiva não é — essa parte da operação permanece na tela da Callix. |
| O agente mantém a tela aberta durante todo o turno? | Define o tratamento do estado inicial automático e da sessão única. |
| Qual time assume a implementação? | Determina a profundidade técnica das próximas conversas e o formato do acompanhamento. |
Base do documento
O conteúdo deste documento é baseado nos pacotes publicados e na aplicação de demonstração construída sobre o SDK 1.0.1, executada contra um tenant de homologação. A aplicação apresenta o softphone e, ao lado, um registro de cada transição de estado e cada comando com marcação de milissegundos.