Site da NuvidioAntiga documentação
Referência de API

Integração via Iframe (frontend)

Este documento oferece algumas orientações sobre como eventos podem ser recebidos no frontend, utilizando a renderização por Iframe.

Renderização do Iframe

Na integração, é necessário configurar o Iframe adequadamente para garantir o bom funcionamento do serviço. As configurações necessárias estão presentes no código abaixo:

<iframe 
	allow="camera; microphone; geolocation; display-capture"
	sandbox="allow-scripts allow-same-origin allow-forms allow-popups"
	src="https://nuvidio.ai/:companySlug/invite/:inviteId" // ou o short link gerado na criação do invite
	allowfullscreen
/>

Recebendo eventos

A aplicação envia eventos baseados nas ações do cliente dentro do Iframe. A comunicação é estabelecida viawindow.postMessage, permitindo a transmissão de dados para a página host.

Exemplo de código

Abaixo temos um exemplo de como a aplicação host pode escutar por esse eventos vindo do Iframe

window.addEventListener("message", ({ data }) => {
    if (!data) return;
    const dataParsed = typeof data === "string" ? JSON.parse(data) : data;

    if (dataParsed.type === "video_autonomous_escaped_journey") { 
        // Cliente saiu da jornada
    }


});

Payload do evento

Os eventos são enviados do Iframe para a aplicação principal seguindo um formato padronizado. Abaixo, encontra-se um exemplo de como o payload de um evento é estruturado:

{
  "event": "video_autonomous_escaped_journey",
  "content": {
    "type": "customer_with_incorrect_data",
    "invite": {
      "id": "2998600f-4e79-4c31-af93-a38f6c06de87",
      "step": "data_validation"
    }
  }
}

Propriedades dos eventos

event

Essa propriedade refere-se ao nome do evento recebido:

eventDescrição
video_autonomous_step_advanceÉ disparado quando o usuário avança uma etapa dentro da jornada. A etapa na qual o usuário se encontra será detalhada no parâmetro step do payload do evento.
video_autonomous_journey_completedÉ disparado quando o usuário completa a jornada.
video_autonomous_abandon_agreementÉ disparado quando o usuário abandona a jornada.
video_autonomous_escaped_journeyÉ disparado quando o usuário acessa alguma das urls de escape configuradas na criação do script

type

É um parâmetro opicional que indica qual o tipo do evento enviado conforme a tabela abaixo:

content.typeDescrição
customer_accessed_expired_inviteEnviado quando o cliente tenta acessar um link de convite que já expirou.
customer_with_incorrect_dataEnviado quando o cliente clica em Meus dados estão incorretos durante a etapa de validação de dados no início da jornada.
customer_asked_for_helpEnviado quando o cliente clica em Preciso de Ajuda em em qualquer etapa da jornada. A etapa específica em que o pedido de ajuda ocorreu será detalhada no parâmetro step do payload do evento.

💡

Observação:

Essa propriedade está presente somente no evento video_autonomous_escaped_journey.

invite

É um objeto que contém os dados do invite utilizado no momento em que o evento foi disparado:

content.inviteDescriçãoValor
idRefere-se ao id do invite utilizado.string
stepRefere-se à etapa do invite na qual o evento foi disparado.InviteStatus

A tabela a seguir detalha os valores que o parâmetro step pode ter, juntamente com suas descrições:

InviteStatusDescrição
'document_validation'Refere-se a etapa de validação do CPF do cliente
'data_validation'Refere-se a etapa de verificação dos dados do cliente
'tips'Refere-se a etapa de instruções de uso da câmera e microfone
'facial_validation'Refere-se a etapa de validação facial (biometria)
'agreement'Refere-se a etapa da jornada dos scripts (leitura e resposta do usuário)
'rating'Refere-se a etapa de avaliação do processo pelo cliente
'journey_completed'Refere-se a etapa de conclusão do processo
'handover'Refere-se ao transbordo do cliente para a video chamada tradicional

💡

Observação

As etapas document_validation, facial_validation, rating e handover nem sempre estão presentes no fluxo seguido pelo cliente e varia conforme a configuração do script criado. Para mais informações veja a documentação de criação de scripts.

A etapa agreement engloba todas as mensagens presentes nos scripts cadastrados no invite utilizado, portanto, o evento video_autonomous_step_advance não é emitido ao trocar as mensagens do script, somente quando o cliente avança para a próxima etapa.

⚠️

Atenção: Considerações sobre Segurança para URLs Externas

Ao utilizar URLs externas para redirecionamentos dentro da jornada (como em links de ajuda ou suporte), é fundamental verificar se o site de destino permite ser carregado em um Iframe. Isso geralmente é controlado por cabeçalhos de segurança HTTP comoX-Frame-Optionsou pela diretiva frame-ancestors na Content Security Policy (CSP).

Caso o site externo não esteja configurado para permitir isso, o conteúdo pode ser bloqueado pelo navegador, impedindo a visualização ou o redirecionamento.