Utwórz chatbota WhatsApp, a nie aplikację
Opublikowany: 2022-03-11Dawno temu zbudowałem aplikację internetową dla przedsiębiorstwa (ponad 200 000 pracowników). Informacje zwrotne na temat aplikacji internetowej skłoniły mnie do przeprowadzenia eksperymentu. Co by się stało, gdybym zamiast aplikacji internetowej stworzył chatbota WhatsApp, aby rozwiązać konkretny przypadek użycia? Czy ludziom podobałoby się to lepiej? Czy byłoby to bardziej przydatne?
Ale historia jest znacznie większa. Chatboty mają ogromny potencjał! W tym samouczku dotyczącym chatbota WhatsApp chciałem podzielić się moją podróżą edukacyjną, najlepszymi praktykami, które odkryłem, oraz moimi przewidywaniami na temat pytania dotyczącego aplikacji i chatbota. I nie tylko: czy chatboty pewnego dnia zastąpią wszystkie tradycyjne aplikacje?
Firma, w której pracowałem, miała biuro dla około 2000 pracowników w centrum Tel Awiwu. Ilość miejsc parkingowych jest bardzo ograniczona, więc ludzie parkują w miejscach celowo przeznaczonych do parkowania podwójnego, gdzie jeden samochód blokuje drugi. Na każdym podwójnym miejscu parkingowym pierwszy kierowca parkuje wewnątrz, a drugi na zewnątrz.
Z tablicy do aplikacji internetowej
Zanim pojawiła się aplikacja, była duża tablica. Wszyscy kierowcy zaznaczali, gdzie parkują, swoje nazwiska i numery telefonów. Kierowca przed opuszczeniem biura musiał sprawdzić, czy ktoś nie blokuje jego samochodu. Jeśli tak, musieliby zadzwonić do drugiego kierowcy i mieć nadzieję, że nie byli w trakcie spotkania, aby mogli zjechać i usunąć swój samochód z drogi.
Aby usprawnić proces, stworzyłem aplikację internetową.
To było proste. Brak zaplecza. Brak hostingu serwerów. Brak konserwacji bazy danych. Nawet żaden framework UI. Żadnych webpacków i żadnych pakietów JS! Tylko waniliowy JavaScript.
Był hostowany przy użyciu darmowego hostingu stron statycznych na GitHub. Bazą danych była FireBase, więc mieliśmy wsparcie w czasie rzeczywistym i obsługę JSON, bez potrzeby korzystania z zaplecza.
Interfejs użytkownika był prosty. Użytkownicy zobaczyliby wszystkie miejsca parkingowe i kliknęli na puste, aby uzupełnić swoje dane. Gdyby były już zaparkowane, dane zostałyby pobrane z lokalnej pamięci przeglądarki. Jeśli klikną zarejestrowany slot, zobaczą odpowiednie dane kontaktowe i będą mogli zadzwonić do kierowcy.
Działało świetnie przez prawie rok. Mniej niż jeden dzień rozwoju pomógł i zaoszczędził czas wielu osobom — to dobra inwestycja.
Od aplikacji internetowej do chatbota
Pewnego dnia Facebook ogłosił, że zamierza wydać API dla WhatsApp. Następnego dnia mój brat kupił Amazon Echo z Alexą. Mniej więcej w tym czasie zacząłem wszędzie widzieć Asystenta Google.
Zacząłem myśleć, że może świat zmierza w kierunku chatbotów, więc powinienem poeksperymentować. Czy użytkownicy woleliby korzystać z chatbotów? Czy potrzebowałbym mniej wsparcia? Czy wprowadzi jakieś nowe metafunkcje po prostu poprzez wykorzystanie innej infrastruktury?
Otrzymałem kilka opinii na temat zwykłej aplikacji internetowej i sądziłem, że może to rozwiązać, jeśli stworzę chatbota WhatsApp:
- Aplikacja nie działała dobrze na niektórych starych telefonach komórkowych.
- Nie działał pod ziemią (tam, gdzie jest parking – nie ma tam dobrego sygnału mobilnego).
- Kierowcy chcieli wysyłać wiadomości do blokerów zamiast otwierać telefon.
- Kierowcy chcieli otrzymywać powiadomienia push, jeśli ktoś ich blokował, zamiast otwierać aplikację internetową za każdym razem przed wyjazdem.
Należy pamiętać, że twórcy platform czatowych, takich jak Telegram czy WhatsApp, przez lata pracowali całymi dniami i nocami, aby zapewnić stabilność swoich aplikacji. Korzystając z ich zasobów i rozwijając tylko mały silnik do odpowiadania na pytania, pozostawiłoby to ciężką pracę nad utrzymaniem programistom platformy czatowej. Wszystko, co musiałem zrobić, to dowiedzieć się, jak stworzyć chatbota WhatsApp.
Zaraz po tym, jak zacząłem tworzyć nowego chatbota asystenta parkowania, zdałem sobie sprawę, jak fantastyczny był to pomysł. Dodawanie nowych funkcji było tak łatwe i szybkie, że nie musiałem nawet przeprowadzać kompleksowych testów.
Brak sygnału? Nie ma problemu.
Ćwierkać
Mało tego, nie potrzebowałem już skomplikowanego procesu CI/CD. Jeśli działa w emulatorze czatu, działałby wszędzie. Bez .apk
, bez Xcode, bez App Store ani Google Play. Chatbot był w stanie wysyłać wiadomości do użytkowników bez konieczności rejestrowania urządzeń, korzystania z PubSub lub podobnych usług do powiadomień push lub zapisywania tokenów użytkownika. Nie ma potrzeby stosowania systemu uwierzytelniania — używałem numeru telefonu użytkownika do identyfikacji.
Brak sygnału? Nie ma problemu. Nie musiałem dodawać obsługi offline za pomocą plików manifestu: WhatsApp dał mi go po wyjęciu z pudełka. Wiadomość wyjdzie wystarczająco szybko, gdy użytkownik przejdzie na wyższy poziom, gdzie Wi-Fi jest lepsze.
Wtedy zdałem sobie sprawę, że za każdym razem, gdy platforma czatu wprowadzi nową funkcję, moja aplikacja od razu na tym skorzysta. Wow — to naprawdę dobra inwestycja. (Szczerze mówiąc, istnieje również ryzyko, że nowe funkcje mogą ograniczyć funkcjonalność lub spowodować przełomowe zmiany, które wymagają większego wysiłku programistycznego, więc zastanów się dobrze przed wdrożeniem zadań o znaczeniu krytycznym dla firmy).
Pisanie asystenta parkowania , prototypowego chatbota WhatsApp
Aby stworzyć chatbota WhatsApp, pierwszym wyzwaniem jest przesyłanie wiadomości z WhatsApp do Twojego programu. Najprostszym rozwiązaniem, jakie znalazłem, jest użycie wspólnego numeru telefonu Twilio. To tylko do rozwoju — przenosząc się na produkcję, programiści będą chcieli korzystać z dedykowanego numeru telefonu.
Każdy z bezpłatnych numerów Twilio jest współużytkowany przez wielu użytkowników Twilio. Aby odróżnić użytkowników końcowych aplikacji od użytkowników aplikacji innych użytkowników Twilio, użytkownicy końcowi muszą wysłać wstępnie zdefiniowaną wiadomość do chatbota.
Gdy użytkownik wyśle specjalną wiadomość na wspólny numer, wszystkie wiadomości z jego numeru zostaną przekierowane na Twoje konto Twilio i elementy webhook. Dlatego w produkcji potrzebny jest dedykowany numer — nie ma gwarancji, że dany użytkownik będzie chciał korzystać tylko z jednej aplikacji na danym wspólnym numerze.
Wysyłanie wiadomości WhatsApp
W „Programmable SMS Dashboard” Twilio znajduje się link „WhatsApp Beta” na lewym pasku nawigacyjnym:
Klikając to, programiści zobaczą stronę z opcją „Sandbox”.
Aby powiązać użytkowników, będą musieli wysłać jedną specjalną wiadomość na numer podany przez Twilio. Gdy użytkownicy to zrobią, możemy zacząć wysyłać do nich wiadomości i przetwarzać od nich wiadomości za pośrednictwem Twilio.
Oto przykład wysyłania wiadomości za pomocą 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
To jest prosta wiadomość tekstowa. Ale możesz także dołączyć multimedia (obrazy itp.) do swoich wiadomości. Oto przykład 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)) }
To wszystko: teraz możemy zacząć wysyłać wiadomości do klientów! Należy jednak pamiętać o dwóch najważniejszych ograniczeniach technicznych wiadomości WhatsApp:

- Gdy bot otrzyma wiadomość, możesz wysłać jedną odpowiedź SMS za darmo. Więcej niż to kosztuje.
- Bot może wysyłać wiadomości do użytkowników tylko w ciągu 24-godzinnego okna, zaczynając od otrzymania wiadomości od użytkownika. Poza tym oknem bot może wysyłać tylko wiadomości przy użyciu zatwierdzonych szablonów, jak zobaczymy później.
Odbieranie wiadomości WhatsApp
Wysyłanie wiadomości było dość łatwe, ale odbieranie i przetwarzanie wiadomości jest jeszcze łatwiejsze.
Na stronie „piaskownicy” Twilio programiści mogą określić, gdzie Twilio ma wysyłać wiadomości, które otrzymuje na wspólny numer WhatsApp. Podczas opracowywania usługi takie jak Ngrok lub Serveo mogą udostępniać publiczne adresy URL, które są kierowane do lokalnych maszyn deweloperskich.
Wiadomości Twilio WhatsApp wyglądają tak:
{ "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" }
To wszystko, czego potrzebujemy. Możemy użyć dowolnego języka programowania, aby uzyskać tę wiadomość, przeanalizować ją i spróbować zrozumieć, o co pytają użytkownicy. Spowoduje to prawdopodobnie pewne operacje CRUD na bazie danych, po których bot może dostarczyć użytkownikowi odpowiednią informację (lub komunikat o powodzeniu/porażce) w swojej odpowiedzi. To są podstawy tworzenia chatbota WhatsApp.
Szablony wiadomości
Jak wspomniano, chatboty mogą wysyłać wiadomości w stylu freestyle tylko do użytkowników, którzy „obecnie” wchodzą z nimi w interakcję, tj. w ciągu 24 godzin. Ale jeśli chcesz wysyłać wiadomości do nowych użytkowników lub poza okno, musisz użyć wstępnie zatwierdzonych szablonów wiadomości. Ma to na celu zapobieganie spamowi.
W moim przypadku użycia chciałem zaktualizować sterowniki, gdy ktoś je blokował, nawet jeśli nie są użytkownikami chatbota. W Twilio kliknij „nadawca” i „konfiguruj”.
Oto szablon, który wybrałem:
{{1}} is blocking your exit from the parking lot. I will notify you when they leave.
Kilka dni później Facebook zatwierdził mój szablon i mogłem zacząć wysyłać te wiadomości do wszystkich, którzy mieli WhatsApp, a nie tylko do kierowców, którzy wysłali wiadomość do chatbota.
Wysyłanie wiadomości z szablonu jest dokładnie takie, jak wysyłanie zwykłej wiadomości przy użyciu tego samego interfejsu API. WhatsApp automatycznie widzi, że pasuje do szablonu i zatwierdza wiadomość.
Nie tylko dla asystenta parkowania
Ta strategia jest dla mnie ekscytująca, gdy wyobrażam sobie sklep internetowy: być może pewnego dnia ludzie będą mogli kupić wszystko za pomocą chatbotów. Byłoby to tak proste, jak wysyłanie wiadomości WhatsApp i dołączanie obrazów. Wyobraź sobie, że użytkownicy byliby w stanie dołączyć prawdziwe pieniądze do każdej wiadomości WhatsApp. Kupowanie rzeczy byłoby bardzo proste. Użytkownicy z łatwością mogliby kupić wszystko, rozmawiając z chatbotem dostawcy.
Wyobraź sobie chatbota, który zastępuje Waze lub Mapy Google. Wysyłasz mu wiadomość tekstową o miejscu docelowym. Platforma chatbota śledzi Twoją lokalizację, a chatbot wysyła nagraną wiadomość, która jest automatycznie odtwarzana z wypowiadanym w czasie rzeczywistym kierunkiem nawigacji.
To nie jest fantazja. WhatsApp obsługuje obecnie udostępnianie lokalizacji w czasie rzeczywistym — wszystko, czego potrzebują, to opcja automatycznego odtwarzania otrzymanych wiadomości i voila.
Pomyśl o chatbocie Waze lub chatbocie taksówki zamiast aplikacji Gett lub Uber. Wysyłasz wiadomość z informacją, gdzie jesteś, potem przyjeżdża taksówka i płacisz za pomocą WhatsApp. Tak prosty.
Niektórzy czytelnicy mogą pomyśleć: „Czy użytkownicy nie preferują interfejsów graficznych, a nie tylko pisania?” Wierzę, że platformy chatbotowe dadzą właścicielowi chatbota opcję wysyłania przycisków, obrazów i czystych pól HTML podczas konwersji. Facebook już obsługuje Webview dla Messengera. Użytkownicy nie muszą niczego instalować, wystarczy skorzystać z preferowanej aplikacji do obsługi wiadomości błyskawicznych.
Te zalety sprawiają, że programiści chcą tworzyć chatboty WhatsApp do obsługi ważnych zadań, takich jak udzielanie natychmiastowych, wiarygodnych odpowiedzi na temat pandemii koronawirusa, aby pomóc ograniczyć rozprzestrzenianie się dezinformacji.
TL; DR: 7 wniosków dotyczących migracji aplikacji internetowych do chatbotów
W podsumowaniu:
- Wielokrotnie tworzenie chatbota może znacznie skrócić czas programowania, ponieważ nie ma potrzeby projektowania i planowania graficznego interfejsu użytkownika. (To powiedziawszy, przed rozpoczęciem warto przyjrzeć się niuansom projektowania UX chatbota, aby uczyć się na błędach innych.)
- O wiele łatwiej jest dodawać nowe funkcje do chatbotów. Deweloperzy nie muszą przeprojektowywać ani zmieniać żadnych obecnych elementów. Chatbot musi tylko zacząć rozumieć nowy typ wiadomości.
- Chatboty są domyślnie znacznie bardziej dostępne dla osób o specjalnych potrzebach.
- Nie ma potrzeby dostosowywania rozwiązania wieloplatformowego. Platforma chatbot już to robi.
- Użytkownicy znacznie bardziej ufają chatbotom w zakresie udostępniania informacji. Nie musisz prosić o pozwolenie ani wyświetlać ostrzeżeń - np. użytkownik może po prostu wybrać obraz ze swojej galerii i wysłać go do chatbota — pozwolenie na dostęp do galerii obrazów jest już przyznane platformie czatu.
- Platformy czatowe ułatwiają obsługę powiadomień push. Powiadomienia push to różnica między aplikacjami, o których użytkownicy zapominają, a aplikacjami, z którymi użytkownicy będą regularnie korzystać.
- Platformy czatowe obsługują dla Ciebie przechodzenie między warunkami offline i online.
Jak zbudować chatbota WhatsApp: porady i najlepsze praktyki
Zalety napisania chatbota są dość jasne. Deweloperom, którzy są gotowi, aby go zbudować, radzimy zacząć od małego, z chatbotem, który rozumie jedną wiadomość. I dobrze sobie z tym radzi.
Chatboty powinny trzymać się krótkich wiadomości. Ludzie nie czytają długich wiadomości. Jeśli masz do wysłania coś ważnego, czego nie można wyrazić zwięźle, lepiej podzielić wiadomości na kilka małych.
Chatboty z osobowością są lepiej odbierane. Nawet minimalna „ludzka mowa” ma wiele zalet w porównaniu z podejściem „formalności wiadomości systemowych”: „Zaktualizuję dla ciebie mapę parkingową”, zamiast „Baza danych została zaktualizowana”. Chatbot powinien dać użytkownikowi poczucie, że jest maszyną, która ma mu służyć, a nie czarną skrzynką wykonującą operacje techniczne, których mogą nie być w stanie zrozumieć.
Ten samouczek dotyczący chatbota WhatsApp nie zawiera szczegółów dotyczących analizowania wiadomości w języku naturalnym, które użytkownicy będą wysyłać do chatbotów. Jednak aspirujący dostawcy usług rozwoju chatbota mogą zapoznać się z kodem źródłowym bota asystenta parkowania WhatsApp (w szczególności hackparkDialogFlow.ts
, który akceptuje żądania użytkownika jako działania), aby dowiedzieć się, jak działa ten aspekt.
Aby uzyskać bardziej szczegółowy artykuł na temat wykrywania różnych typów komunikatów użytkownika — przy jednoczesnym przestrzeganiu podejścia do programowania wstrzykiwania zależności — zobacz samouczek chatbota TypeScript firmy Toptal.
Powodzenia z rozwojem własnego chatbota WhatsApp!