Создайте чат-бота WhatsApp, а не приложение

Давным-давно я создал веб-приложение для предприятия (более 200 тысяч сотрудников). Отзывы о веб-приложении побудили меня провести эксперимент. Что произойдет, если я создам чат-бота WhatsApp для решения конкретного варианта использования вместо веб-приложения? Понравится ли это людям больше? Было бы полезнее?

Но история намного больше, чем это. У чат-ботов такой большой потенциал! В этом руководстве по чат-боту WhatsApp я хотел поделиться своим опытом обучения, лучшими практиками, которые я обнаружил, и своими прогнозами по вопросу о приложении и чат-боте. И не только: заменят ли когда-нибудь чат-боты все традиционные приложения?

Компания, в которой я работал, имела офис примерно на 2000 сотрудников в центре Тель-Авива. Парковочных мест очень мало, поэтому люди паркуются на местах, специально предназначенных для двойной парковки, где одна машина блокирует другую. На каждом двойном парковочном месте первый водитель паркуется внутри, а второй паркуется снаружи.

От доски к веб-приложению

До того, как появилось приложение, была большая доска. Все водители отмечали, где они парковались, а также свои имена и номера телефонов. Перед выходом из офиса водитель должен был проверить, не блокирует ли кто-нибудь их автомобиль. Если это так, им придется позвонить другому водителю и надеяться, что они не находятся в середине встречи, чтобы они могли пойти и убрать свою машину с дороги.

Чтобы упростить процесс, я создал веб-приложение.

Это было просто. Нет задней части. Без хостинга серверов. Нет обслуживания базы данных. Нет даже UI-фреймворка. Никакого веб-пакета и никаких JS-пакетов! Просто ванильный JavaScript.

Он был размещен с использованием бесплатного хостинга статических страниц GitHub. База данных была FireBase, поэтому у нас была поддержка в реальном времени и поддержка JSON, и не было необходимости в серверной части.

Пользовательский интерфейс был простым. Пользователи увидят все парковочные места и нажмут на пустое, чтобы заполнить свои данные. Если бы они уже были припаркованы, данные брались бы из локального хранилища браузера. Если они нажмут на зарегистрированный слот, они увидят соответствующие контактные данные и смогут позвонить водителю.

Почти год работал отлично. Менее одного дня разработки помогли и сэкономили время многим людям — хорошее вложение.

От веб-приложения к чат-боту

Однажды Facebook объявил, что собирается выпустить API для WhatsApp. На следующий день мой брат купил Amazon Echo с Alexa. Примерно в то же время я начал повсюду видеть Google Assistant.

Я начал думать, что, возможно, мир движется к чат-ботам, поэтому мне следует поэкспериментировать. Предпочли бы пользователи использовать чат-ботов? Должен ли я оказывать меньше поддержки? Будет ли он вводить какие-либо новые мета-функции просто за счет использования другой инфраструктуры?

Я получил несколько отзывов об обычном веб-приложении, и я полагал, что оно поможет решить эту проблему, если я создам чат-бота для WhatsApp:

• Приложение плохо работало на некоторых старых мобильных телефонах.
• Под землей не работала (там, где парковка — там нет хорошей мобильной связи).
• Водители хотели отправлять сообщения блокировщикам вместо того, чтобы открывать номеронабиратель телефона.
• Водители хотели получать push-уведомления, если кто-то их блокирует, вместо того, чтобы открывать веб-приложение каждый раз перед отъездом.

Важно помнить, что разработчики чат-платформ, таких как Telegram или WhatsApp, годами работали днями и ночами, чтобы обеспечить стабильность своих приложений. Используя их ресурсы и разработав только небольшой движок для ответов на вопросы, это оставило бы тяжелую работу по ремонтопригодности разработчикам платформы чата. Все, что мне нужно было сделать, это разобраться, как сделать чат-бота для WhatsApp.

Сразу после того, как я начал разрабатывать нового чат-бота для парковки, я понял, насколько фантастической была идея. Было очень легко и быстро добавлять новые функции, и мне даже не нужно было проводить сквозное тестирование.

Нет сигнала? Без проблем.

Твитнуть

Мало того, мне больше не нужен был сложный процесс CI/CD. Если он работает в эмуляторе чата, он будет работать везде. Ни .apk , ни Xcode, ни App Store, ни Google Play. Чат-бот мог отправлять сообщения пользователям без необходимости регистрировать устройства, использовать PubSub или аналогичные службы для push-уведомлений или сохранять токены пользователей. Нет необходимости в системе аутентификации — я использовал номер телефона пользователя в качестве идентификации.

Нет сигнала? Без проблем. Мне не нужно было добавлять автономную поддержку с помощью файлов манифеста: WhatsApp дал мне это из коробки. Сообщение исчезнет достаточно скоро, когда пользователь перейдет на более высокий уровень, где Wi-Fi лучше.

Затем я понял, что каждый раз, когда чат-платформа представляет новую функцию, мое приложение сразу же выигрывает от нее. Вау, вот это действительно хорошая инвестиция. (Честно говоря, существует также риск того, что новые функции могут ограничить функциональность или создать критические изменения, которые потребуют дополнительных усилий при разработке, поэтому тщательно подумайте, прежде чем внедрять критически важные для бизнеса задачи).

Написание помощника по парковке , прототипа чат-бота WhatsApp

Чтобы создать чат-бота WhatsApp, первая задача — передать сообщения из WhatsApp в вашу программу. Самое простое решение, которое я нашел, — использовать общий номер телефона Twilio. Это только для разработки — при переходе к производству разработчики захотят использовать выделенный номер телефона.

Каждый бесплатный номер Twilio используется многими пользователями Twilio. Чтобы отличить конечных пользователей приложения от пользователей приложений других пользователей Twilio, конечные пользователи должны отправить предварительно заданное сообщение чат-боту.

После того, как пользователь отправит специальное сообщение на общий номер, все сообщения с этого номера будут перенаправлены на вашу учетную запись Twilio и веб-перехватчики. Вот почему в рабочей среде необходим выделенный номер — нет никакой гарантии, что конкретный пользователь захочет использовать только одно приложение на данном общем номере.

Отправка сообщений WhatsApp

На «Программируемой SMS-панели» Twilio в левой панели навигации есть ссылка «WhatsApp Beta»:

Нажав на нее, разработчики увидят страницу с опцией «Песочница».

Чтобы связать пользователей, им нужно будет отправить одно специальное сообщение на номер, который предоставляет 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 разработчики могут указать, куда 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 нажмите «отправитель» и «настроить».

Это шаблон, который я выбрал:

 {{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 уже поддерживает Webview для Messenger. Пользователям не нужно ничего устанавливать, просто используйте предпочитаемое приложение для обмена мгновенными сообщениями.

Именно из-за этих преимуществ разработчики стремятся создавать чат-ботов WhatsApp для решения важных задач, таких как предоставление мгновенных авторитетных ответов о пандемии коронавируса, чтобы помочь обуздать распространение дезинформации.

TL;DR: 7 выводов о переносе веб-приложений на чат-боты

В итоге:

• Во многих случаях разработка чат-бота может значительно сократить время разработки, потому что нет необходимости проектировать и планировать графический интерфейс пользователя. (Тем не менее, перед началом стоит изучить тонкости дизайна UX чат-бота, чтобы учиться на чужих ошибках.)
• Гораздо проще добавлять новые функции в чат-ботов. Разработчикам не нужно переделывать или изменять какие-либо текущие элементы. Чат-боту просто нужно начать понимать новый тип сообщения.
• Чат-боты по умолчанию гораздо более доступны для людей с особыми потребностями.
• Нет необходимости настраивать кроссплатформенное решение. Платформа чат-ботов уже делает это.
• Пользователи гораздо больше доверяют чат-ботам для обмена информацией. Вам не нужно запрашивать разрешение или показывать предупреждения — например, пользователь может просто выбрать изображение из своей галереи и отправить его вашему чат-боту — разрешение на доступ к галерее изображений уже предоставлено платформе чата.
• Чат-платформы упрощают обработку push-уведомлений. Push-уведомления — это то, что делает разницу между приложениями, о которых пользователи забывают, и приложениями, с которыми пользователи будут регулярно взаимодействовать.
• Чат-платформы управляют переходом между оффлайн и онлайн условиями за вас.

Как создать чат-бота в WhatsApp: советы и лучшие практики

Преимущества написания чат-бота довольно очевидны. Разработчикам, которые готовы его создать, рекомендуется начать с малого, с чат-бота, который понимает одно сообщение. И справляется с этим хорошо.

Чат-боты должны придерживаться коротких сообщений. Люди не читают длинные сообщения. Когда вам нужно отправить что-то важное, что нельзя выразить кратко, лучше разделить сообщения на несколько небольших.

Чат-боты с индивидуальностью воспринимаются лучше. Даже минимальная «человеческая речь» имеет большое значение по сравнению с подходом «формального системного сообщения»: «Я обновлю карту парковки для вас» вместо «База данных обновлена». Чат-бот должен оставлять у пользователя ощущение, что это машина, предназначенная для обслуживания пользователя, а не черный ящик, выполняющий технические операции, которые он, возможно, не в состоянии понять.

В этом учебном пособии по чат-боту WhatsApp не рассматриваются особенности разбора сообщений на естественном языке, которые пользователи отправляют чат-ботам. Но начинающие поставщики услуг по разработке чат-ботов могут ознакомиться с исходным кодом бота WhatsApp Parking Assistant (в частности, hackparkDialogFlow.ts , который принимает запросы от пользователя как действия), чтобы понять, как работает этот аспект.

Более подробную статью о том, как обнаруживать различные типы пользовательских сообщений, а также следовать подходу внедрения зависимостей к программированию, см. в учебнике по чат-боту Toptal по TypeScript.

Желаем удачи в разработке собственного чат-бота для WhatsApp!