创建一个 WhatsApp 聊天机器人，而不是一个应用程序

已发表: 2022-03-11

很久以前，我为一家企业（20 万多名员工）构建了一个 Web 应用程序。 对网络应用程序的反馈促使我做一个实验。 如果我要创建一个 WhatsApp 聊天机器人来解决特定的用例，而不是一个 Web 应用程序，会发生什么？ 人们会更喜欢它吗？ 会不会更有用？

但故事远不止于此。 聊天机器人有很大的潜力！ 在这个 WhatsApp 聊天机器人教程中，我想分享我的学习历程、我发现的最佳实践以及我对应用程序与聊天机器人问题的预测。 超越：聊天机器人有朝一日会取代所有传统应用吗？

我工作的公司在特拉维夫市中心有一个可容纳约 2,000 名员工的办公室。 停车位非常有限，因此人们将车停在特意为双车位设计的空间中，一辆车挡住另一辆车。 在每个双车位，第一个司机停在里面，第二个司机停在外面。

从白板到 Web 应用程序

在有一个应用程序之前，有一个大板。 所有司机都标明了他们停车的地方，以及他们的姓名和电话号码。 在离开办公室之前，司机必须检查是否有人挡住了他们的车。 如果是这样，他们将不得不打电话给其他司机，并希望他们没有在开会，这样他们就可以去把车移开。

为了使这个过程更好，我创建了一个网络应用程序。

最初的网络应用程序概念，显示内部和外部的双停车位行，带有数字，有时还带有名称。有名字的是蓝色，没有名字的是绿色。

这很简单。 没有后端。 没有服务器托管。 没有数据库维护。 甚至没有任何 UI 框架。 根本没有 webpack 和 JS 包！ 只是普通的 JavaScript。

它是使用 GitHub 的免费静态页面托管来托管的。 数据库是 FireBase，所以我们有实时支持和 JSON 支持，不需要后端。

用户界面很简单。 用户会看到所有停车位，然后点击一个空的停车位来填写他们的详细信息。 如果它们已经停放，它将从浏览器的本地存储中获取数据。 如果他们点击一个注册的位置，他们会看到相关的联系方式，并可以选择给司机打电话。

它工作了将近一年。 不到一天的开发帮助并为许多人节省了时间——这是一项很好的投资。

从 Web 应用程序到聊天机器人

有一天，Facebook 宣布他们将发布适用于 WhatsApp 的 API。 第二天，我哥哥买了一个亚马逊 Echo，里面有 Alexa。 大约在那个时候，我也开始到处看到 Google Assistant。

我开始想，也许世界正朝着聊天机器人的方向发展，所以我应该尝试一下。 用户会更喜欢使用聊天机器人吗？ 我需要给予更少的支持吗？ 它会仅仅通过利用不同的基础设施来引入任何新的元功能吗？

我收到了一些关于常规网络应用程序的反馈，我相信如果我要创建一个 WhatsApp 聊天机器人，它可能会解决这个问题：

  • 该应用程序在一些旧手机上运行不佳。
  • 它不能在地下工作（停车场所在的地方——那里没有良好的移动信号）。
  • 司机希望向拦截器发送消息，而不是打开电话拨号器。
  • 如果有人阻止他们，司机希望收到推送通知，而不是每次离开前都打开网络应用程序。

重要的是要记住，Telegram 或 WhatsApp 等聊天平台的开发人员多年来日夜工作以确保其应用程序的稳定性。 通过使用他们的资源并仅开发一个用于回答问题的小型引擎，这将把可维护性的艰苦工作留给聊天平台开发人员。 我所要做的就是深入研究如何制作一个 WhatsApp 聊天机器人。

在我开始开发新的停车助手聊天机器人后，我立即意识到这个想法是多么美妙。 添加新功能非常简单快捷，我什至不需要进行端到端测试。

没信号？ 没问题。

鸣叫

不仅如此，我不再需要复杂的 CI/CD 流程。 如果它在聊天模拟器中工作，它会在任何地方工作。 没有.apk ，没有 Xcode，没有 App Store，也没有 Google Play。 聊天机器人能够向用户发送消息，而无需我注册设备、使用 PubSub 或类似服务进行推送通知或保存用户令牌。 不需要身份验证系统——我使用用户的电话号码作为身份证明。

没信号？ 没问题。 我不需要使用清单文件添加离线支持：WhatsApp 开箱即用地给了我。 消息很快就会消失，当用户会去上层，那里有更好的 wifi。

然后我意识到，每次聊天平台引入新功能时，我的应用程序都会立即从中受益。 哇——现在这是一项非常好的投资。 （公平地说，新功能也存在限制功能或产生需要更多开发工作的重大更改的风险，因此在实施关键业务任务之前请仔细考虑）。

编写停车助手，原型 WhatsApp 聊天机器人

要创建 WhatsApp 聊天机器人，第一个挑战是从 WhatsApp 获取消息到您的程序。 我找到的最简单的解决方案是使用共享的 Twilio 电话号码。 它仅用于开发——当转向生产时，开发人员将希望使用专用电话号码。

Twilio 的免费号码在许多 Twilio 用户之间共享。 为了将应用程序的最终用户与其他 Twilio 用户的应用程序区分开来，最终用户必须向聊天机器人发送预定义的消息。

用户向共享号码发送特殊消息后，来自其号码的所有消息都将定向到您的 Twilio 帐户和 webhook。 这就是为什么在生产中需要一个专用号码的原因——不能保证给定的用户只想在给定的共享号码上使用一个应用程序。

发送 WhatsApp 消息

在 Twilio 的“可编程 SMS 仪表板”上，左侧导航栏中有一个“WhatsApp Beta”链接：

Twilio 的“可编程 SMS 仪表板”的屏幕截图，显示了最近消息的图表，以及最近错误和警告的另一个图表。导航栏中的第四个选项是“WhatsApp Beta”。

单击它，开发人员将看到一个带有“沙盒”选项的页面。

Twilio 的 WhatsApp 沙盒设置步骤的屏幕截图，等待将特殊的 WhatsApp 消息发送到特定号码。

要关联用户，他们需要向 Twilio 提供的号码发送一条特殊消息。 一旦用户这样做，我们就可以开始通过 Twilio 向他们发送消息并处理来自他们的消息。

以下是使用 cURL 发送消息的示例：

 curl 'https://api.twilio.com/2010-04-01/Accounts/{user_account}/Messages.json' -X POST \ --data-urlencode 'To=whatsapp:+{to_phone_number}' \ --data-urlencode 'From=whatsapp:+{from_phone_number}' \ --data-urlencode 'Body={escaped_message_body}' \ -u {user_account}:user_token

这是一条简单的短信。 但是您也可以将媒体（图像等）附加到您的消息中。 这是一个 Node.js 示例：

 function sendWhatsApp(to, body, media) { const auth = "twilio_clientid:twilio_api" const sendURL = "https://api.twilio.com/2010-04-01/Accounts/{account_id}/Messages.json" const res = await fetch(sendURL, { headers: { Authorization: "Basic " + Buffer.from(auth).toString("base64"), }, method: "POST", body: objToFORM( JSONRemoveUndefined({ To: "whatsapp:+972" + to.replace(/-/g, "").replace(/^0/, ""), From: "whatsapp:+18454069614", Body: body, MediaUrl: media, }), ), }) } function objToFORM(obj) { const params = new URLSearchParams() for (var a in obj) { params.append(a, obj[a]) } return params } function JSONRemoveUndefined(obj) { return JSON.parse(JSON.stringify(obj)) }

就是这样：现在我们可以开始向客户端发送消息了！ 但重要的是要记住 WhatsApp 消息的两个最关键的技术限制：

  1. 当机器人收到消息时，您可以免费发送一条短信回复。 不止这些，还要花钱。
  2. 机器人只能在收到用户消息后的 24 小时窗口内向用户发送消息。 在这个窗口之外，机器人只能使用批准的模板发送消息，我们稍后会看到。

接收 WhatsApp 消息

发送消息相当容易，但接收和处理消息更加容易。

“Twilio Sandbox for WhatsApp”页面的屏幕截图。沙盒配置部分有两个端点 URL 字段，用于“消息进入时”和“状态回调 URL”。 Sandbox Participants 部分列出了用户 ID（格式为“whatsapp:”，后跟电话号码），并且与之前一样，通过发送特殊消息邀请朋友加入沙箱的说明。

在 Twilio 的“沙盒”页面上，开发人员可以定义 Twilio 应该将它在共享 WhatsApp 号码上接收到的消息发送到哪里。 在开发过程中，像 Ngrok 或 Serveo 这样的服务可以提供路由到本地开发者机器的公共 URL。

Twilio WhatsApp 消息如下所示：

 { "NumMedia": "0", "SmsSid": "{sms_id}", "SmsStatus": "received", "Body": "Example Message from user", "To": "whatsapp:+{phone_number}", "NumSegments": "1", "MessageSid": "{message_sid}", "AccountSid": "{account_sid}", "From": "whatsapp:+{phone_number}", "ApiVersion": "2010-04-01" }

这就是我们所需要的。 我们可以使用任何编程语言来获取此消息，对其进行解析，并尝试了解用户的要求。 这可能会导致对数据库进行一些 CRUD 操作，之后机器人可以在其回复中将适当的信息（或成功/失败消息）传递给用户。 这些是如何创建 WhatsApp 聊天机器人的基础知识。

消息模板

如前所述，聊天机器人只能向“当前”与其交互的用户发送自由式消息，即在 24 小时窗口期间。 但是，如果您希望向新用户或窗口外发送消息，则必须使用预先批准的消息模板。 这是为了防止垃圾邮件。

在我的用例中，我想在有人阻止驱动程序时更新驱动程序，即使他们不是聊天机器人的用户。 在 Twilio 中，单击“发件人”和“配置”。

Twilio 的“支持 WhatsApp 的发件人”页面的屏幕截图、列表编号、他们的业务显示名称和状态（列出的一个标记为已批准，另一个标记为“等待 WhatsApp 批准。”）

这是我选择的模板：

 {{1}} is blocking your exit from the parking lot. I will notify you when they leave.

几天后，Facebook 批准了我的模板，我可以开始将这些消息发送给所有拥有 WhatsApp 的人，而不仅仅是向聊天机器人发送消息的司机。

从模板发送消息与发送常规消息完全一样，使用相同的 API。 WhatsApp 会自动看到它与模板匹配并批准该消息。

不仅适用于停车助理

当我想象一个在线商店时，这个策略让我兴奋不已：也许有一天人们可以使用聊天机器人购买任何东西。 这就像发送 WhatsApp 消息和附加图像一样简单。 试想一下，如果用户能够为每条 WhatsApp 消息附加真钱。 买东西会很简单。 用户可以通过与供应商的聊天机器人交谈来轻松购买任何东西。

想象一下取代 Waze 或 Google Maps 的聊天机器人。 您向其发送目的地的短信。 聊天机器人平台正在跟踪您的位置，聊天机器人会向您发送一条录制的消息，该消息会根据导航的实时语音方向自动播放。

这不是幻想。 WhatsApp 目前支持实时位置共享——他们所需要的只是自动播放收到的消息的选项，瞧。

想想 Waze 聊天机器人或出租车聊天机器人，而不是 Gett 或 Uber 应用程序。 您发送一条消息说您在哪里，然后出租车到达，然后您使用 WhatsApp 付款。 很简单。

一些读者可能会想，“难道用户不喜欢图形界面，而不仅仅是打字吗？” 我相信聊天机器人平台会给聊天机器人所有者在转换过程中发送按钮、图像和纯 HTML 框的选项。 Facebook 已经支持 Messenger 的 Webview。 用户无需安装任何东西，只需使用他们喜欢的即时消息应用程序即可。

这些优势是开发人员希望创建 WhatsApp 聊天机器人来处理重要任务的原因，例如提供有关冠状病毒大流行的即时权威答案，以帮助遏制错误信息的传播。

TL;DR：关于将 Web 应用程序迁移到聊天机器人的 7 个结论

总之：

  • 很多时候，开发聊天机器人可以显着缩短开发时间，因为无需设计和规划图形用户界面。 （也就是说，值得在开始之前查看聊天机器人 UX 设计的细节，从其他人的错误中学习。）
  • 向聊天机器人添加新功能要容易得多。 开发人员不需要重新设计或更改任何当前元素。 聊天机器人只需要开始理解新类型的消息。
  • 默认情况下，有特殊需求的人更容易使用聊天机器人。
  • 无需定制跨平台解决方案。 聊天机器人平台已经这样做了。
  • 用户更信任聊天机器人来共享信息。 您无需请求许可或显示警告 - 例如，用户可以简单地从他们的图库中选择一张图片并将其发送到您的聊天机器人 - 访问图片库的权限已经授予聊天平台。
  • 聊天平台可以轻松处理推送通知。 推送通知是用户忘记的应用程序和用户经常使用的应用程序之间的区别。
  • 聊天平台为您处理离线和在线条件之间的移动。

如何构建 WhatsApp 聊天机器人：分手建议和最佳实践

编写聊天机器人的优点非常明显。 建议准备构建一个的开发人员从小处着手，使用能够理解一条消息的聊天机器人。 并且处理得很好。

聊天机器人应该坚持短消息。 人们不阅读长消息。 当您有重要的事情要发送而无法简洁地表达时，最好将消息拆分为几个小消息。

有个性的聊天机器人更受欢迎。 与“系统消息形式”方法相比，即使是一些最低限度的“人工说话”也有很长的路要走：“我会为你更新停车地图”，而不是“数据库已更新”。 聊天机器人应该让用户感觉到它是一台为用户服务的机器，而不是一个执行他们可能无法理解的技术操作的黑匣子。

这个 WhatsApp 聊天机器人教程没有详细说明解析用户将发送给聊天机器人的自然语言消息。 但是欢迎有抱负的聊天机器人开发服务提供商仔细阅读 WhatsApp 停车助手机器人的源代码（特别是hackparkDialogFlow.ts ，它接受用户的请求作为操作），以了解这方面的工作原理。

有关如何检测不同类型的用户消息的更深入的文章（同时还遵循依赖注入方法进行编程），请参阅 Toptal 的 TypeScript 聊天机器人教程。

祝您开发自己的 WhatsApp 聊天机器人好运！