{"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\/en\/blog\/administrirovanie\/delaem-svoj-google-call-screening-na-osnove-voximplant-i-dialogflow","title":{"rendered":"Creating Google Call Screening based on Voximplant and Dialogflow","gt_translate_keys":[{"key":"rendered","format":"text"}]},"content":{"rendered":"<p><noindex><a rel=\"nofollow\" href=\"https:\/\/habr.com\/ru\/company\/Voximplant\/blog\/468725\/\"><img decoding=\"async\" alt=\"Creating Google Call Screening based on Voximplant and Dialogflow\" src=\"\/wp-content\/uploads\/2019\/09\/d9843d6221d857a5ad33e2f5700cb3da.png\" style=\"display:block;margin: 0 auto;\" \/><\/a><\/noindex><br \/>\nYou may have heard or read about the Call Screening feature that Google rolled out for its Pixel phones in the U.S. The idea is excellent: when you receive an incoming call, a virtual assistant begins conversing while you see that conversation in chat form, allowing you to speak instead of the assistant at any moment. This is very useful nowadays, when almost <noindex><a rel=\"nofollow\" href=\"https:\/\/habr.com\/ru\/company\/Voximplant\/blog\/425479\/\">half of calls are spam.<\/a><\/noindex>, but you still don\u2019t want to miss important calls from anyone not in your contact list. The only catch is that this functionality is available only on Pixel phones and only in the U.S. Well, obstacles are meant to be overcome, right? So, we decided to explain how to achieve a similar solution using Voximplant and Dialogflow. Please continue reading.<br \/>\n<noindex><a rel=\"nofollow\" name=\"habracut\"><\/a><\/noindex><\/p>\n<h2>Architecture<\/h2>\n<p>\nI propose we don\u2019t waste time explaining how Voximplant and Dialogflow work; you can easily find that information online if you wish. So, let\u2019s get acquainted with the very concept of our Call Screening.<\/p>\n<p>Let\u2019s assume you already have a phone number you use daily that receives important calls. In that case, we\u2019ll need a second number that will be used everywhere \u2013 in emails, on business cards, when you fill out online forms, etc. This number will be connected to the natural language processing system (in our case, Dialogflow) and will forward calls to your main number only if you want it to. As a diagram, it looks like this (clickable image):<br \/>\n<noindex><a rel=\"nofollow\" href=\"https:\/\/habrastorage.org\/webt\/et\/kf\/qf\/etkfqfpoxq2bwlgicp2bd0kqges.png\"><img decoding=\"async\" alt=\"Creating Google Call Screening based on Voximplant and Dialogflow\" src=\"\/wp-content\/uploads\/2019\/09\/581a4242dbd083a34fd3d5ee57f71b80.png\" style=\"display:block;margin: 0 auto;\" \/><\/a><\/noindex><br \/>\nUnderstanding the architecture, we can start implementing it, but with one caveat: we will not create a <b>mobile<\/b> application to demonstrate the dialogue between Dialogflow and the incoming caller; instead, we will create a simple <b>web<\/b>-application with a dialogue render to clearly show how Call Screening works. This application will have an Intervene button, which, when pressed, will connect the incoming caller with the dialed party if they decide to speak themselves.<\/p>\n<h2>Implementation<\/h2>\n<p>\nLog into <noindex><a rel=\"nofollow\" href=\"https:\/\/manage.voximplant.com\/\">your Voximplant account<\/a><\/noindex> and create a new application, for example, screening:<\/p>\n<p><img decoding=\"async\" alt=\"Creating Google Call Screening based on Voximplant and Dialogflow\" src=\"\/wp-content\/uploads\/2019\/09\/69128608f662a89f8e3a26a280508894.png\" style=\"display:block;margin: 0 auto;\" \/><br \/>\nOpen <noindex><a rel=\"nofollow\" href=\"https:\/\/manage.voximplant.com\/numbers\/my_numbers\">the 'Numbers' section<\/a><\/noindex> and purchase a number that will serve as the intermediary:<\/p>\n<p><img decoding=\"async\" alt=\"Creating Google Call Screening based on Voximplant and Dialogflow\" src=\"\/wp-content\/uploads\/2019\/09\/64e23510216825cc3a48a1d0f4cf671a.png\" style=\"display:block;margin: 0 auto;\" \/><br \/>\nNext, go to the screening application, in the 'Numbers' section, under the 'Available' tab. Here you will see the number you just purchased. Link it to the application using the 'Attach' button \u2013 in the pop-up window, leave all values as default and click 'Attach'.<\/p>\n<p>While inside the application, go to the 'Scripts' tab and create a script called myscreening \u2013 we will use the code from the article. <noindex><a rel=\"nofollow\" href=\"https:\/\/voximplant.com\/blog\/how-to-use-dialogflow-connector\">How to use Dialogflow Connector<\/a><\/noindex>. The code will be slightly altered, as we need to 'see' the dialogue between the caller and the assistant; the entire code can be <noindex><a rel=\"nofollow\" href=\"https:\/\/github.com\/aylarov\/callscreening\/blob\/master\/voxengine\/scenario.js\">found here<\/a><\/noindex>.<\/p>\n<p>WARNING: you will need to change the value of the variable server to the name of your ngrok server (details about ngrok will be provided shortly below). Also, substitute your values on line 31, where your phone number is your main number (for example, your personal mobile), and voximplant number is the number you recently purchased.<\/p>\n<pre><code class=\"javascript\">outbound_call = VoxEngine.callPSTN(\u201cYOUR PHONE NUMBER\u201d, \u201cVOXIMPLANT NUMBER\u201d)<\/code><\/pre>\n<p>\nThe callPSTN function will occur at the moment you decide to interrupt the conversation and personally speak with the incoming caller.<\/p>\n<p>After saving the script, you need to link it to the purchased number. For this, while still inside your application, go to the 'Routing' tab to create a new rule \u2013 click the 'New Rule' button in the top right corner. Specify a name (e.g., allcalls), leave the mask as default (.* \u2013 which means that all incoming calls will be handled by the scripts selected for this rule) and specify the myscreening script.<\/p>\n<p><img decoding=\"async\" alt=\"Creating Google Call Screening based on Voximplant and Dialogflow\" src=\"\/wp-content\/uploads\/2019\/09\/1e6725fcc964e9a020ae0ca63fbd4a54.png\" style=\"display:block;margin: 0 auto;\" \/><br \/>\nSave the rule.<\/p>\n<p>From now on, the phone number is linked to the script. The last thing you need to do is to link the bot to the application. For this, go to the 'Dialogflow-connector' tab, click the 'Add Dialogflow agent' button in the top right corner, and upload your Dialogflow agent's JSON file.<\/p>\n<p><img decoding=\"async\" alt=\"Creating Google Call Screening based on Voximplant and Dialogflow\" src=\"\/wp-content\/uploads\/2019\/09\/69cf10fe79f9b5e77e1483751be1fea3.png\" style=\"display:block;margin: 0 auto;\" \/><br \/>\nIf you need an agent for example\/testing, you can take ours from this link: <noindex><a rel=\"nofollow\" href=\"https:\/\/github.com\/aylarov\/callscreening\/tree\/master\/dialogflow\">github.com\/aylarov\/callscreening\/tree\/master\/dialogflow<\/a><\/noindex>. Just don't expect much from it, it's just an example that you are free to modify as you wish and willingly share the results \ud83d\ude42<\/p>\n<h2>Simple backend on NodeJS<\/h2>\n<p>\nLet's deploy a simple backend on Node, for example, like this:<br \/>\n<noindex><a rel=\"nofollow\" href=\"https:\/\/github.com\/aylarov\/callscreening\/tree\/master\/nodejs\">github.com\/aylarov\/callscreening\/tree\/master\/nodejs<\/a><\/noindex><\/p>\n<p>This is a regular application that requires only two commands to run:<\/p>\n<pre><code class=\"bash\">npm install\nnode index.js\n<\/code><\/pre>\n<p>\nThe server will run on port 3000 of your machine, so to connect it to the Voximplant cloud, we will use the ngrok utility. Once you install <noindex><a rel=\"nofollow\" href=\"https:\/\/ngrok.com\/\">ngrok<\/a><\/noindex>, run it with the command:<\/p>\n<pre><code class=\"bash\">ngrok http 3000<\/code><\/pre>\n<p>\nYou will see a domain name that ngrok generated for your local server \u2013 copy it and substitute it in the server variable.<\/p>\n<h2>Client<\/h2>\n<p>\nThe client application looks like a simple chat that you can<noindex><a rel=\"nofollow\" href=\"https:\/\/github.com\/aylarov\/callscreening\/tree\/master\/client\"> fetch from here<\/a><\/noindex>.<\/p>\n<p>Just copy all the files to a directory on your web server and it will work. In the script.js file, replace the value of the server variable with the ngrok domain name, and the value of the callee variable with the number you purchased. Save the file and run the application in your browser. If everything is okay, you will see a WebSocket connection in the developer console.<\/p>\n<h2>Demo<\/h2>\n<p>\nYou can see the application in action in this video:<\/p>\n<p><center><div class=\"youtube-placeholder\" data-id=\"i9jz0fChNeM\" onclick=\"loadVideo(this)\">\r\n        <img decoding=\"async\" src=\"https:\/\/img.youtube.com\/vi\/i9jz0fChNeM\/hqdefault.jpg\" alt=\"Play video\" loading=\"lazy\" width=\"480\" height=\"360\" style=\"width:100%;height:auto;\">\r\n        <div class=\"play-button\"><\/div>\r\n    <\/div><\/center><br \/>\nP. S. If you press the Intervene button, the caller will be directed to my phone number, and if you press Disconnect \u2013 then... Right, the call will be disconnected.<br \/>\n<br \/>Source: <a content=\"nofollow\" rel=\"nofollow\" href=\"https:\/\/habr.com\/ru\/company\/Voximplant\/blog\/468725\/\">habr.com<\/a><\/p>","protected":false,"gt_translate_keys":[{"key":"rendered","format":"html"}]},"excerpt":{"rendered":"<p>\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 [&hellip;]<\/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<!-- All in One SEO 5.0.2 - aioseo.com -->\n\t<meta name=\"robots\" content=\"max-image-preview:large\" \/>\n\t<meta name=\"author\" content=\"Yuri Gagarin\"\/>\n\t<link rel=\"canonical\" href=\"https:\/\/prohoster.info\/en\/blog\/administrirovanie\/delaem-svoj-google-call-screening-na-osnove-voximplant-i-dialogflow\" \/>\n\t<meta name=\"generator\" content=\"All in One SEO (AIOSEO) 5.0.2\" \/>\n\t\t<meta property=\"og:locale\" content=\"en_US\" \/>\n\t\t<meta property=\"og:site_name\" content=\"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\" \/>\n\t\t<meta property=\"og:type\" content=\"article\" \/>\n\t\t<meta property=\"og:title\" content=\"\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\" \/>\n\t\t<meta property=\"og:url\" content=\"https:\/\/prohoster.info\/en\/blog\/administrirovanie\/delaem-svoj-google-call-screening-na-osnove-voximplant-i-dialogflow\" \/>\n\t\t<meta property=\"og:image\" content=\"https:\/\/prohoster.info\/wp-content\/uploads\/2021\/11\/logo-350.jpg\" \/>\n\t\t<meta property=\"og:image:secure_url\" content=\"https:\/\/prohoster.info\/wp-content\/uploads\/2021\/11\/logo-350.jpg\" \/>\n\t\t<meta property=\"og:image:width\" content=\"350\" \/>\n\t\t<meta property=\"og:image:height\" content=\"350\" \/>\n\t\t<meta property=\"article:published_time\" content=\"2019-10-31T19:23:38+00:00\" \/>\n\t\t<meta property=\"article:modified_time\" content=\"2019-10-31T19:23:38+00:00\" \/>\n\t\t<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/prohoster\" \/>\n\t\t<meta property=\"article:author\" content=\"https:\/\/www.facebook.com\/prohoster\" \/>\n\t\t<!-- All in One SEO -->\n\n","aioseo_head_json":{"title":"\ud83e\udd47Creating your Google Call Screening based on Voximplant and Dialogflow | ProHoster","description":"","canonical_url":"https:\/\/prohoster.info\/en\/blog\/administrirovanie\/delaem-svoj-google-call-screening-na-osnove-voximplant-i-dialogflow","robots":"max-image-preview:large","keywords":"","webmasterTools":{"miscellaneous":""},"schema":null,"og:locale":"en_US","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\/en\/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\/en\/wp-json\/wp\/v2\/posts\/38420","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/prohoster.info\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/prohoster.info\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/prohoster.info\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/prohoster.info\/en\/wp-json\/wp\/v2\/comments?post=38420"}],"version-history":[{"count":0,"href":"https:\/\/prohoster.info\/en\/wp-json\/wp\/v2\/posts\/38420\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/prohoster.info\/en\/wp-json\/wp\/v2\/media\/28839"}],"wp:attachment":[{"href":"https:\/\/prohoster.info\/en\/wp-json\/wp\/v2\/media?parent=38420"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/prohoster.info\/en\/wp-json\/wp\/v2\/categories?post=38420"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/prohoster.info\/en\/wp-json\/wp\/v2\/tags?post=38420"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}