twilio contact center
1.0.0
A essência de um contact center moderno é atender clientes em vários canais (voz, bate -papo na web, vídeo, email, mídia social etc.), permitir que eles se movam perfeitamente entre canais e, principalmente, mantenham o contexto das conversas.
A demonstração do Twilio Contact Center é a arquitetura de referência para a construção de um contact center moderno. O foco da demonstração é mostrar como criar um contact center baseado em plataforma do Twilio e os vários componentes de back -end e front -end necessários.
NOTA: Restamos o trabalho básico de uma perspectiva de UX e muitas oportunidades permanecem para melhorar. Ele foi projetado para fins de demonstração e não foi verificado separadamente.
Este aplicativo é fornecido como está. Twilio não o apoia oficialmente.
O cliente preenche a solicitação de chamada on -line -> Formulário enviado ao servidor -> Tarefa no TaskRouter Criado -> Encontre o agente disponível e correspondente -> Agente aceita reserva e disca o cliente para fora (PSTN) -> Conecte o cliente ao agente (WebRTC)
CLIETE CLAILES TWILIO Número de telefone -> Twilio Solicitações webhook -> O servidor gera TWIML para IVR -> Chamador seleciona a opção IVR -> Tarefa no TaskRouter criada -> Encontre o Agente Disponível e Combinante -> Agente Aceita Reserva -> Conecte o Cliente ao Agente (WebRTC)
O cliente preenche o formulário de solicitação de bate -papo na web on -line -> Formulário enviado ao servidor -> Tarefa no TaskRouter criado -> Encontre o agente disponível e correspondente -> Agente aceita reserva -> Iniciar o bate -papo entre o cliente e o agente
O cliente preenche o formulário de solicitação de chamada de vídeo -> Formulário enviado ao servidor -> Tarefa no TaskRouter e Video Room criado -> Encontre o agente disponível e combinando -> Agente aceita reserva -> Agente se junta à sala de vídeo
Exibição em tempo real das métricas operacionais de contact center (por exemplo: tempo médio de manuseio de chamada, produtividade do agente, métricas de chamada, estatísticas do TaskRouter e muito mais etc.). Confira o seguinte repositório: https://github.com/ameerbadri/twilio-taskrouter-realtime-dashboard
Se você nunca usou o Twilio antes, seja bem -vindo! Você precisará se inscrever em uma conta do Twilio.
Recomendamos que você crie um projeto separado no Twilio e instale este aplicativo usando esse projeto.
NOTA: Recomenda -se que você tenha uma conta Twilio atualizada para experimentar completamente essa demonstração.
Antes de iniciar a instalação, você precisará coletar as seguintes variáveis no portal da conta Twilio.
TWILIO_ACCOUNT_SIDTWILIO_AUTH_TOKENTWILIO_WORKSPACE_SIDPara conta Sid e Auth Token, clique aqui: https://www.twilio.com/console
Compre um número de telefone ou use um existente (o aplicativo configurará o número para você mais tarde)
Crie um novo espaço de trabalho do Twilio TaskRouter e selecione o modelo personalizado.
Para o Twilio API Key Sid e Twilio API Key Secret, clique aqui: https://www.twilio.com/console/dev-tools/api-keys
TWILIO_API_KEY_SIDTWILIO_API_KEY_SECRETPara bate -papo na web, você precisa definir variáveis de ambiente de bate -papo programável Twilio:
TWILIO_CHAT_SERVICE_SIDA interface do usuário do agente não suporta o manuseio de várias tarefas simultaneamente, portanto, todas as tarefas são roteadas no mesmo canal de tarefas com capacidade de uma tarefa simultânea. Para mais detalhes, verifique a TaskRouter multitarefa
Você pode implantar este projeto com todos os dependentes no Heroku com a Terraform, uma infraestrutura de código aberto como ferramenta de software de código.
Crie a chave da API para Heroku, verifique o Guia da API da Plataforma Heroku para obter ajuda.
Adicione a chave da API Heroku e seu endereço de e -mail ao terraform.tfvars .
Inicialize os arquivos de configuração do Terraform e execute
terraform init
Se você não instalou o Terraform, siga o Terraform.
Adicione as variáveis do Twilio listadas nas variáveis de configuração da seção ao arquivo terraform.tfvars Variables.
Defina o nome do aplicativo Heroku na infraestrutura Descrição Arquivo terraform_heroku.tf
Crie um plano de execução
terraform plan
Instale o projeto no Heroku executando
terraform apply
Após a conclusão da instalação, abra https://<your-application-name>.herokuapp.com/setup e configurar o aplicativo. A visão geral da demonstração estará acessível em https://<your-application-name>.herokuapp.com .
Isso instalará o aplicativo e todas as dependências do Heroku (login necessário) para você. Como parte da instalação, o aplicativo Heroku o levará a configuração de variáveis de ambiente. Clique no botão a seguir para implantar o aplicativo.
Após a conclusão da instalação, abra https://<your-application-name>.herokuapp.com/setup e configurar o aplicativo. A visão geral da demonstração estará acessível em https://<your-application-name>.herokuapp.com .
Faça o download e instale o Google Cloud SDK.
Crie um novo projeto
gcloud projects create <your-project-id> --set-as-default
Inicialize seu aplicativo de mecanismo de aplicativos com seu projeto e escolha sua região:
gcloud app create --project=<your-project-id>
Adicione as variáveis do Twilio listadas nas variáveis de configuração da seção ao arquivo app.yaml Variáveis.
Implante o aplicativo no App Engine executando o seguinte comando.
gcloud app deploy
Para visualizar seu aplicativo Run
gcloud app browse
Após a conclusão da instalação, abra https://<your-project-id>.appspot.com/setup e configure o aplicativo. A visão geral da demonstração estará acessível em https://<your-project-id>.appspot.com .
Garfo e clonar o repositório. Em seguida, instale dependências com
npm install
Se você deseja carregar variáveis de ambiente de um arquivo, instale o pacote DOTENV para lidar com variáveis de ambiente local.
npm install dotenv
No diretório raiz, crie um arquivo chamado '.env' e adicione o seguinte ao topo do app.js
require('dotenv').config()
Para executar a demonstração, você precisará definir as variáveis de ambiente listar em variáveis de configuração] (#Configuration-variáveis)
Inicie o aplicativo
npm start
Antes de poder usar a demonstração, abra http://<your-application-name>/setup e configure o aplicativo. A visão geral da demonstração estará acessível em http://<your-application-name> . Observe que se process.env.port não estiver definido, os aplicativos são executados na porta 5000.
Se você estiver executando a demonstração localmente, lembre-se de que o Twilio precisa de um endereço publicamente acessível para webhooks, e o processo de configuração os registra no Twilio. Como tal, você precisará executar algo como NGrok em vez de apenas acertar http: // localhost: 5000/. À medida que você obtém novos endereços do NGrok, você também precisará executar o processo de configuração para registrar o endereço atualizado no Twilio.
Configuração do NGrok
Instalação ampla do sistema
Baixe e instale de Ngrok
Instale com o NPM npm install ngrok -g
Run NGrok (se a porta for definida na sua atualização .env de acordo)
./ngrok http 5000
Projeto Somente instalação
Instale o pacote ngrok
npm install ngrok --dev
Adicione o seguinte ao topo do app.js
const ngrok = require('ngrok')
const ngrokUrl = async function () {
const url = await ngrok.connect((process.env.PORT || 5000))
console.log('ngrok url ->', url)
}
No App.js, ligue para NGrokurl em App.Listen para registrar o URL NGROK no servidor Spin Up
ngrokUrl()
Nota: No Google Chrome, é necessária uma conexão HTTPS segura para fazer chamadas telefônicas via WebRTC. Use um túnel que suporta HTTPS como o NGROK, que pode encaminhar o tráfego para o seu servidor da web.
As contribuições são bem -vindas e geralmente aceitas. Para não emendas triviais, é uma boa idéia enviar uma questão explicando as alterações propostas antes de um PR. Isso permite que os mantenedores dêem orientação e evitem o trabalho duplicado.
Suas alterações devem aderir a um estilo de código de projeto comum.
# please run this before "git commit"
npm run lint
# try automatic fix
./node_modules/.bin/eslint controllers --fix
./node_modules/.bin/eslint public --fix
Para facilitar a vida para outros colaboradores e revisores, rebate seu compromisso no mesmo PR
git rebase -i HEAD^^^^^^
# then squash or fixup your shards
# and force push into your fork
git push origin [YOUR BRANCH] -f
Você pode me seguir no Twitter - @mdamm_de
Mit
