Twilio提供了各种各样的渠道,你可以用来与你的客户联系,例如,通过短信或电话呼叫。你可以使用这些渠道的方法之一是收集客户的数据。根据数据的类型,这可能是一项复杂的工作。收集个别字词或数字通常是很直接的。然而,当要求客户分享具体的时间和日期时,这可能要复杂得多。一个典型的用例可能是预约的安排。当允许客户以自由的形式进行交流时(例如,"我想在下周二下午3点进行一次预约"),这一点尤其正确。
在这篇博客中,我将向你展示如何使用JavaScript和无服务器的Twilio函数在电话中提取时间和日期,而不需要任何第三方的集成。
Twilio账户设置
如果你还没有Twilio账户,在这里获得一个免费账户。
然后,去从Twilio购买一个新的电话号码。如果你是试用账户,电话号码的费用将被应用于你的免费推广信用。
虽然你可以将这种方法应用于不同的渠道,如短信,但我们将在本博客中使用语音作为选定的渠道,所以请确保购买具有语音功能的号码。在搜索号码时,请确保启用Voice Capabilities。

创建Twilio功能来处理来电
首先,我们将创建一个Twilio函数,这是Twilio的无服务器解决方案。我们将在函数中运行代码,将用户关于所需时间和日期的自由输入转换为我们的后台系统可以处理的信息,例如,将这些信息存储在数据库中。
要创建一个Twilio功能,请到Twilio控制台中的Twilio功能产品。
我们要创建一个新的服务,所以继续点击 "创建服务 "按钮。

让我们继续,并为我们的服务命名time-and-date-collector

在这一点上,你会看到Twilio功能服务的概述页面。
首先,我们添加一个名为 chrono-node的JavaScript包,以处理自由格式的时间和日期输入转换为我们的后端系统可以处理的格式。我们还将安装第二个包,名为 date-fns的包,可以将这些格式转换为人类可读的格式。
要做到这一点,在你的用户界面上点击Dependencies 。

接下来,让我们添加chrono-node 模块。通过添加chrono-node 与版本2.3.8 (撰写本文时的最新版本)来完成。然后,点击Add 按钮。
我们将对date-fns 模块进行同样的操作,添加版本为2.28.0 的date-fns 。
结果应该如下。

让我们继续写一些代码吧!我们要添加一个Twilio功能,我们可以通过点击屏幕左上角的Add + 按钮来完成。

首先,让我们创建一个简单的函数,向用户请求输入时间和日期。为此,我们将使用 TwiML。继续并调用这个函数collect-input 。这将创建一个带有一些默认代码的新函数。我们将继续用下面的代码来交换它。
exports.handler = function(context, event, callback) {
let twiml = new Twilio.twiml.VoiceResponse();
// collect user input through <Gather> TwiML
const gather = twiml.gather({
input: "speech"
});
gather.say('Hello, please tell us your selected time and date.');
return callback(null, twiml);
};
这个函数将使用 TwiML来问候客户并要求他们输入时间和日期。此外,我们已经定义了预期的输入是口语,而不是通过拨号盘输入(被称为使用DTMF音调)。最终的结果应该如下。

接下来,让我们定义一个函数来处理用户的输入,并将其转换为我们可以在后端系统中使用的格式。
让我们创建另一个名为handle-input 的函数。在这里,我们将使用先前安装的chrono-node 包来处理输入。根据用户的输入,我们将告诉他们我们无法提取时间和日期,或者通过使用date-fns 将日期转换为人类可理解的格式,将时间和日期读给他们听。
就像刚才一样,让我们用下面的代码来代替。
const chrono = require('chrono-node');
var format = require('date-fns/format');
exports.handler = function(context, event, callback) {
let twiml = new Twilio.twiml.VoiceResponse();
const userTimeDateInput = chrono.parseDate(event.SpeechResult);
// we were not able to detect a time and data and will let the user know about the invalid input.
if(!userTimeDateInput){
twiml.say('Unfortunately we were not able to extract a time and date from your input. ');
}
// we were able to detect a time and date and will read it out to the user.
else{
twiml.say(`
Your chosen time was ${format(userTimeDateInput, 'h:mm aaa')}.
Your selected Date was ${format(userTimeDateInput, 'MMMM do')}.
Goodbye!
`);
}
return callback(null, twiml);
};
现在,我们还需要做最后一件事,那就是告诉Twilio将我们的collect-input 函数的输入发送到handle-input 函数。回到collect-input 函数,将action 和method 参数添加到gather 函数中,所以结果看起来像这样。
exports.handler = function(context, event, callback) {
let twiml = new Twilio.twiml.VoiceResponse();
// collect user input through <Gather> TwiML
const gather = twiml.gather({
input: "speech",
action: '/handle-input',
method: 'POST'
});
gather.say('Hello, please tell us your selected time and date.');
return callback(null, twiml);
};
最后,我们需要保存两个函数并部署它们。点击函数列表中的每个函数名称,点击 "保存 "按钮来保存一个函数。一旦你保存了两个函数,点击底部的 "全部部署 "按钮。

如果一切部署正确,你应该看到两个绿色复选标记,每个函数旁边都有一个。
将此连接到我们的号码
最后,我们需要定义Twilio应该如何处理来电,把它连接到我们的handle-input 函数。 要做到这一点,请到你账户中的一个活跃号码的配置页面去。
这里我们将向下滚动到 **VOICE AND FAX**页面的部分。在A CALL COMES IN 的输入下,点击下拉选择Function ,然后选择我们的time-and-date-collector 服务,ui 环境,最后选择/collect-input 功能。
完成后,按屏幕底部的 "保存 "按钮,就可以了。

试试吧
现在,继续拨打该号码。你应该能够说出一个自由形式的时间和日期,如果它是一个公认的输入,你会被读回你的输入。
例如,试着说。
"我选择的时间和日期是下周二下午三点"。
这--取决于你什么时候问--会返回类似的信息。
"你选择的时间是下午3点。你选择的日期是5月17日。再见!"
回顾(以及扩展该用例的方法)
在这篇博文中,我展示了如何让你的客户在常规对话中轻松输入日期和时间,只需使用几个简单的JavaScript包,所有这些都不需要集成到第三方供应商。所有这些都是使用无服务器的Twilio函数快速完成的。
这个项目可以作为一个原始的例子,并可以进行扩展以更好地适应你的使用情况。例如,我们可以将函数连接到你的后端,甚至在你的后端定义一个端点来处理传入的呼叫。在这里,你可以连接到一个数据库,看看用户是否已经输入了时间和日期(例如,预约)或检查是否有空闲。