{"id":38420,"date":"2019-10-31T22:23:38","date_gmt":"2019-10-31T19:23:38","guid":{"rendered":"https:\/\/prohoster.info\/blog\/delaem-svoj-google-call-screening-na-osnove-voximplant-i-dialogflow\/"},"modified":"2019-10-31T22:23:38","modified_gmt":"2019-10-31T19:23:38","slug":"delaem-svoj-google-call-screening-na-osnove-voximplant-i-dialogflow","status":"publish","type":"post","link":"https:\/\/prohoster.info\/es\/blog\/administrirovanie\/delaem-svoj-google-call-screening-na-osnove-voximplant-i-dialogflow","title":{"rendered":"Implementamos nuestro propio Google Call Screening basado en Voximplant y Dialogflow","gt_translate_keys":[{"key":"rendered","format":"text"}]},"content":{"rendered":"

\"Implementamos<\/a><\/noindex>
\nEs posible que hayas o\u00eddo o le\u00eddo sobre la funci\u00f3n Call Screening que Google lanz\u00f3 para sus tel\u00e9fonos Pixel en EE.UU. La idea es excelente: cuando recibes una llamada, el asistente virtual comienza a hablar, mientras t\u00fa ves esa conversaci\u00f3n en forma de chat y puedes intervenir en cualquier momento. Esto es muy \u00fatil hoy en d\u00eda, cuando casi la mitad de las llamadas son spam<\/a><\/noindex>, pero no deseas perder importantes llamadas de alguien que no est\u00e1 en tu lista de contactos. El \u00fanico inconveniente es que esta funcionalidad est\u00e1 disponible solo en el tel\u00e9fono Pixel y \u00fanicamente en EE.UU. Bueno, los obst\u00e1culos existen para ser superados, \u00bfverdad? Por eso decidimos explicar c\u00f3mo crear una soluci\u00f3n similar utilizando Voximplant y Dialogflow. Sigue leyendo.
\n<\/a><\/noindex><\/p>\n

Arquitectura<\/h2>\n

\nPropongo no perder tiempo en explicar c\u00f3mo funcionan Voximplant y Dialogflow; si lo deseas, puedes encontrar informaci\u00f3n f\u00e1cilmente en internet. As\u00ed que mejor hablemos sobre el concepto de nuestro Call Screening.<\/p>\n

Supongamos que ya tienes un n\u00famero de tel\u00e9fono que usas diariamente y al que recibes llamadas importantes. En ese caso, necesitaremos un segundo n\u00famero que se indicar\u00e1 en todas partes: en el correo, en la tarjeta de presentaci\u00f3n, cuando llenas formularios en l\u00ednea, etc. Este n\u00famero estar\u00e1 conectado al sistema de procesamiento de lenguaje natural (en nuestro caso, Dialogflow) y redirigir\u00e1 las llamadas a tu n\u00famero principal, solo si as\u00ed lo deseas. En forma de esquema, esto se ver\u00eda as\u00ed (la imagen es clickeable):
\n\"Implementamos<\/a><\/noindex>
\nEntendiendo la arquitectura, podemos empezar con la implementaci\u00f3n, pero con una salvedad: no vamos a crear una aplicaci\u00f3n m\u00f3vil<\/b> para mostrar el di\u00e1logo entre Dialogflow y el llamante entrante; crearemos una simple aplicaci\u00f3n web<\/b>con renderizado del di\u00e1logo para mostrar claramente el principio de funcionamiento de Call Screening. En esta aplicaci\u00f3n habr\u00e1 un bot\u00f3n Intervene, al pulsarlo, Voximplant conectar\u00e1 al llamante entrante con el destinatario marcado, si este \u00faltimo decide hablar por s\u00ed mismo.<\/p>\n

Implementaci\u00f3n<\/h2>\n

\nInicia sesi\u00f3n en tu cuenta de Voximplant<\/a><\/noindex> y crea una nueva aplicaci\u00f3n, por ejemplo, screening:<\/p>\n

\"Implementamos
\nAbre la secci\u00f3n \u2018N\u00fameros\u2019<\/a><\/noindex> y compra un n\u00famero que funcionar\u00e1 como intermediario:<\/p>\n

\"Implementamos
\nA continuaci\u00f3n, accede a la aplicaci\u00f3n screening, en la secci\u00f3n \u00abN\u00fameros\u00bb, pesta\u00f1a \u00abDisponibles\u00bb. Aqu\u00ed ver\u00e1s el n\u00famero reci\u00e9n comprado. Con\u00e9ctalo a la aplicaci\u00f3n usando el bot\u00f3n \u00abAdjuntar\u00bb; en la ventana que aparece, deja todos los valores por defecto y haz clic en \u00abAdjuntar\u00bb.<\/p>\n

Dentro de la aplicaci\u00f3n, ve a la pesta\u00f1a \u00abEscenarios\u00bb y crea el escenario myscreening; utilizaremos el c\u00f3digo del art\u00edculo. C\u00f3mo usar el Conector de Dialogflow<\/a><\/noindex>. El c\u00f3digo se modificar\u00e1 ligeramente, ya que necesitamos \u00abver\u00bb el di\u00e1logo entre el llamante y el asistente; todo el c\u00f3digo se puede tomar aqu\u00ed<\/a><\/noindex>.<\/p>\n

ATENCI\u00d3N: necesitar\u00e1s cambiar el valor de la variable server al nombre de tu servidor ngrok (los detalles sobre ngrok se explicar\u00e1n m\u00e1s adelante). Tambi\u00e9n debes insertar tus valores en la l\u00ednea 31, donde your phone number es tu n\u00famero principal (por ejemplo, el m\u00f3vil personal), y voximplant number es el n\u00famero que compraste recientemente.<\/p>\n

outbound_call = VoxEngine.callPSTN(\u201cYOUR PHONE NUMBER\u201d, \u201cVOXIMPLANT NUMBER\u201d)<\/code><\/pre>\n
\nLa llamada callPSTN ocurrir\u00e1 en el momento en que decidas intervenir en la conversaci\u00f3n y hablar directamente con el abonado entrante.<\/p>\n
Despu\u00e9s de guardar el escenario, deber\u00e1s vincularlo al n\u00famero comprado. Para esto, a\u00fan dentro de tu aplicaci\u00f3n, ve a la pesta\u00f1a \u00abEnrutamiento\u00bb para crear una nueva regla \u2013 bot\u00f3n \u00abNueva regla\u00bb en la esquina superior derecha. Indica un nombre (por ejemplo, allcalls), deja la m\u00e1scara por defecto (.* \u2013 lo que significa que todas las llamadas entrantes ser\u00e1n tratadas con los escenarios seleccionados para esta regla) y especifica el escenario myscreening.<\/p>\n
\"Implementamos
\nGuarda la regla.<\/p>\n
Desde ahora, el n\u00famero de tel\u00e9fono est\u00e1 vinculado al escenario. Lo \u00faltimo que necesitas hacer es vincular el bot a la aplicaci\u00f3n. Para esto, accede a la pesta\u00f1a \u00abConector de Dialogflow\u00bb, haz clic en el bot\u00f3n \u00abAgregar agente de Dialogflow\u00bb en la esquina superior derecha y carga el archivo JSON de tu agente Dialogflow.<\/p>\n
\"Implementamos
\nSi necesitas un agente para ejemplo\/pruebas, puedes tomar el nuestro desde este enlace: github.com\/aylarov\/callscreening\/tree\/master\/dialogflow<\/a><\/noindex>. Pero no esperes mucho de \u00e9l, es solo un ejemplo que puedes modificar como desees y compartir con confianza los resultados \ud83d\ude42<\/p>\n
Backend simple en NodeJS<\/h2>\n
\nVamos a desplegar un backend sencillo en Node, por ejemplo, as\u00ed:
\ngithub.com\/aylarov\/callscreening\/tree\/master\/nodejs<\/a><\/noindex><\/p>\n
Es una aplicaci\u00f3n com\u00fan que requiere solo dos comandos para iniciar:<\/p>\n
npm install\nnode index.js\n<\/code><\/pre>\n
\nEl servidor se iniciar\u00e1 en el puerto 3000 de su m\u00e1quina, por lo que para conectarlo a la nube de Voximplant, utilizamos la herramienta ngrok. Cuando la instale ngrok<\/a><\/noindex>, ejec\u00fatelo con el comando:<\/p>\n
ngrok http 3000<\/code><\/pre>\n
\nVer\u00e1 el nombre de dominio que ngrok ha generado para su servidor local: c\u00f3pielo y col\u00f3quelo en la variable server.<\/p>\n
Cliente<\/h2>\n
\nLa aplicaci\u00f3n cliente parece un simple chat que puede descargar desde aqu\u00ed<\/a><\/noindex>.<\/p>\n
Simplemente copie todos los archivos en un directorio de su servidor web y funcionar\u00e1. En el archivo script.js, reemplace el valor de la variable server con el nombre de dominio de ngrok y el valor de la variable callee con el n\u00famero que compr\u00f3. Guarde el archivo y ejecute la aplicaci\u00f3n en el navegador. Si todo est\u00e1 bien, ver\u00e1 la conexi\u00f3n WebSocket en la consola de desarrollador.<\/p>\n
Demo<\/h2>\n
\nPuede ver la aplicaci\u00f3n en acci\u00f3n en este video:<\/p>\n
\r\n        \"Reproducir\r\n        
<\/div>\r\n    <\/div><\/center>
\nP. S. Si se presiona el bot\u00f3n Intervenir, la persona que llama ser\u00e1 dirigida a mi n\u00famero de tel\u00e9fono, y si se presiona Desconectar, \u00bfqu\u00e9 pasar\u00e1...? Correcto, la llamada se desconectar\u00e1.
\n
Fuente: habr.com<\/a><\/p>","protected":false,"gt_translate_keys":[{"key":"rendered","format":"html"}]},"excerpt":{"rendered":"
\u0412\u043e\u0437\u043c\u043e\u0436\u043d\u043e, \u0432\u044b \u0441\u043b\u044b\u0448\u0430\u043b\u0438 \u0438\u043b\u0438 \u0447\u0438\u0442\u0430\u043b\u0438 \u043f\u0440\u043e \u0444\u0443\u043d\u043a\u0446\u0438\u044e Call Screening, \u043a\u043e\u0442\u043e\u0440\u0443\u044e Google \u0432\u044b\u043a\u0430\u0442\u0438\u043b \u0434\u043b\u044f \u0441\u0432\u043e\u0438\u0445 \u0442\u0435\u043b\u0435\u0444\u043e\u043d\u043e\u0432 Pixel \u0432 \u0421\u0428\u0410. \u0418\u0434\u0435\u044f \u043e\u0442\u043b\u0438\u0447\u043d\u0430\u044f \u2013 \u043a\u043e\u0433\u0434\u0430 \u0432\u0430\u043c \u043f\u043e\u0441\u0442\u0443\u043f\u0430\u0435\u0442 \u0432\u0445\u043e\u0434\u044f\u0449\u0438\u0439 \u0437\u0432\u043e\u043d\u043e\u043a, \u0442\u043e \u0432\u0438\u0440\u0442\u0443\u0430\u043b\u044c\u043d\u044b\u0439 \u0430\u0441\u0441\u0438\u0441\u0442\u0435\u043d\u0442 \u043d\u0430\u0447\u0438\u043d\u0430\u0435\u0442 \u043e\u0431\u0449\u0430\u0442\u044c\u0441\u044f, \u0432 \u0442\u043e \u0432\u0440\u0435\u043c\u044f \u043a\u0430\u043a \u0432\u044b \u0432\u0438\u0434\u0438\u0442\u0435 \u044d\u0442\u043e\u0442 \u0440\u0430\u0437\u0433\u043e\u0432\u043e\u0440 \u0432 \u0432\u0438\u0434\u0435 \u0447\u0430\u0442\u0430 \u0438 \u0432 \u043b\u044e\u0431\u043e\u0439 \u043c\u043e\u043c\u0435\u043d\u0442 \u043c\u043e\u0436\u0435\u0442\u0435 \u043d\u0430\u0447\u0430\u0442\u044c \u0433\u043e\u0432\u043e\u0440\u0438\u0442\u044c \u0432\u043c\u0435\u0441\u0442\u043e \u0430\u0441\u0441\u0438\u0441\u0442\u0435\u043d\u0442\u0430. \u042d\u0442\u043e \u043e\u0447\u0435\u043d\u044c \u043f\u043e\u043b\u0435\u0437\u043d\u043e \u0432 […]<\/p>\n","protected":false,"gt_translate_keys":[{"key":"rendered","format":"html"}]},"author":1,"featured_media":28839,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[688],"tags":[],"class_list":["post-38420","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-administrirovanie"],"aioseo_notices":[],"aioseo_head":"\n\t\t\n\t\n\t\n\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\n","aioseo_head_json":{"title":"\ud83e\udd47Creamos nuestro Google Call Screening basado en Voximplant y Dialogflow | ProHoster","description":"","canonical_url":"https:\/\/prohoster.info\/es\/blog\/administrirovanie\/delaem-svoj-google-call-screening-na-osnove-voximplant-i-dialogflow","robots":"max-image-preview:large","keywords":"","webmasterTools":{"miscellaneous":""},"schema":null,"og:locale":"es_ES","og:site_name":"ProHoster | \u041a\u0443\u043f\u0438\u0442\u044c \u043d\u0430\u0434\u0435\u0436\u043d\u044b\u0439 \u0445\u043e\u0441\u0442\u0438\u043d\u0433 \u0434\u043b\u044f \u0441\u0430\u0439\u0442\u043e\u0432 \u0441 \u0437\u0430\u0449\u0438\u0442\u043e\u0439 \u043e\u0442 DDoS, VPS VDS \u0441\u0435\u0440\u0432\u0435\u0440\u044b","og:type":"article","og:title":"\ud83e\udd47\u0414\u0435\u043b\u0430\u0435\u043c \u0441\u0432\u043e\u0439 Google Call Screening \u043d\u0430 \u043e\u0441\u043d\u043e\u0432\u0435 Voximplant \u0438 Dialogflow | ProHoster","og:url":"https:\/\/prohoster.info\/es\/blog\/administrirovanie\/delaem-svoj-google-call-screening-na-osnove-voximplant-i-dialogflow","og:image":"https:\/\/prohoster.info\/wp-content\/uploads\/2021\/11\/logo-350.jpg","og:image:secure_url":"https:\/\/prohoster.info\/wp-content\/uploads\/2021\/11\/logo-350.jpg","og:image:width":350,"og:image:height":350,"article:published_time":"2019-10-31T19:23:38+00:00","article:modified_time":"2019-10-31T19:23:38+00:00","article:publisher":"https:\/\/www.facebook.com\/prohoster","article:author":"https:\/\/www.facebook.com\/prohoster"},"aioseo_meta_data":{"post_id":"38420","title":null,"description":null,"keywords":null,"keyphrases":null,"primary_term":null,"canonical_url":null,"og_title":null,"og_description":null,"og_object_type":"default","og_image_type":"default","og_image_url":null,"og_image_width":null,"og_image_height":null,"og_image_custom_url":null,"og_image_custom_fields":null,"og_video":null,"og_custom_url":null,"og_article_section":null,"og_article_tags":null,"twitter_use_og":false,"twitter_card":"default","twitter_image_type":"default","twitter_image_url":null,"twitter_image_custom_url":null,"twitter_image_custom_fields":null,"twitter_title":null,"twitter_description":null,"schema":{"blockGraphs":[],"customGraphs":[],"default":{"data":{"Article":[],"Course":[],"Dataset":[],"FAQPage":[],"Movie":[],"Person":[],"Product":[],"ProductReview":[],"Car":[],"Recipe":[],"Service":[],"SoftwareApplication":[],"WebPage":[]},"graphName":"","isEnabled":true},"graphs":[]},"schema_type":null,"schema_type_options":null,"pillar_content":false,"robots_default":true,"robots_noindex":false,"robots_noarchive":false,"robots_nosnippet":false,"robots_nofollow":false,"robots_noimageindex":false,"robots_noodp":false,"robots_notranslate":false,"robots_max_snippet":null,"robots_max_videopreview":null,"robots_max_imagepreview":"large","priority":null,"frequency":null,"local_seo":null,"seo_analyzer_scan_date":"2026-01-23 21:58:20","breadcrumb_settings":null,"limit_modified_date":false,"reviewed_by":null,"ai":null,"created":"2021-03-01 01:09:23","updated":"2026-01-23 21:58:20","focus_keyword":null,"additional_keywords":null,"truseo_locale":null},"gt_translate_keys":[{"key":"link","format":"url"}],"_links":{"self":[{"href":"https:\/\/prohoster.info\/es\/wp-json\/wp\/v2\/posts\/38420","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/prohoster.info\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/prohoster.info\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/prohoster.info\/es\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/prohoster.info\/es\/wp-json\/wp\/v2\/comments?post=38420"}],"version-history":[{"count":0,"href":"https:\/\/prohoster.info\/es\/wp-json\/wp\/v2\/posts\/38420\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/prohoster.info\/es\/wp-json\/wp\/v2\/media\/28839"}],"wp:attachment":[{"href":"https:\/\/prohoster.info\/es\/wp-json\/wp\/v2\/media?parent=38420"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/prohoster.info\/es\/wp-json\/wp\/v2\/categories?post=38420"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/prohoster.info\/es\/wp-json\/wp\/v2\/tags?post=38420"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}