앱이 아닌 WhatsApp 챗봇 만들기

오래 전에 저는 기업용 웹 앱을 구축했습니다(직원 20만 명 이상). 웹 앱에 대한 피드백으로 인해 실험을 하게 되었습니다. 웹 앱 대신 특정 사용 사례를 해결하기 위해 WhatsApp 챗봇을 만들면 어떻게 될까요? 사람들이 더 좋아할까요? 더 유용하지 않을까요?

그러나 이야기는 그보다 훨씬 더 큽니다. 챗봇의 잠재력은 무궁무진합니다! 이 WhatsApp 챗봇 튜토리얼에서는 내 학습 여정, 내가 발견한 모범 사례, 앱 대 챗봇 질문에 대한 내 예측을 공유하고 싶었습니다. 그리고 그 이상: 언젠가는 챗봇이 모든 기존 앱을 대체하게 될까요?

내가 일했던 회사는 텔아비브 시내 한가운데에 약 2,000명의 직원을 위한 사무실이 있었습니다. 주차 공간이 매우 협소하여 사람들은 의도적으로 이중 주차를 위해 설계된 공간에 주차합니다. 모든 이중 주차 공간에서 첫 번째 운전자는 내부에 주차하고 두 번째 운전자는 외부에 주차합니다.

화이트보드에서 웹 앱으로

앱이 있기 전에 큰 보드가 있었습니다. 모든 운전자는 주차 위치와 이름 및 전화번호를 표시했습니다. 운전사는 사무실을 떠나기 전에 차를 막고 있는 사람이 있는지 확인해야 했습니다. 만약 그렇다면, 그들은 다른 운전자에게 전화를 걸어 그들이 회의 중이 아니기를 바라고 차를 방해하지 않고 치워야 할 것입니다.

프로세스를 개선하기 위해 웹 앱을 만들었습니다.

간단했다. 백엔드가 없습니다. 서버 호스팅이 없습니다. 데이터베이스 유지 관리가 없습니다. 어떤 UI 프레임워크도 아닙니다. 웹팩과 JS 번들이 전혀 없습니다! 그냥 바닐라 JavaScript.

GitHub의 무료 정적 페이지 호스팅을 사용하여 호스팅되었습니다. 데이터베이스는 FireBase였기 때문에 실시간 지원과 JSON 지원이 있었고 백엔드가 필요하지 않았습니다.

사용자 인터페이스는 간단했습니다. 사용자는 모든 주차 공간을 보고 빈 공간을 클릭하여 세부 정보를 입력합니다. 이미 주차된 경우 브라우저의 로컬 저장소에서 데이터를 가져옵니다. 등록된 슬롯을 클릭하면 관련 연락처가 표시되고 기사에게 전화를 걸 수 있습니다.

거의 1년 동안 잘 작동했습니다. 하루도 안 되는 개발 기간이 많은 사람들에게 도움이 되었고 시간을 절약해 주었습니다. 좋은 투자였습니다.

웹 앱에서 챗봇으로

어느 날 Facebook은 WhatsApp용 API를 출시할 것이라고 발표했습니다. 다음 날 형은 Alexa가 포함된 Amazon Echo를 구입했습니다. 그 즈음에는 구글 어시스턴트도 곳곳에서 보이기 시작했다.

세상이 챗봇으로 옮겨가고 있는 건 아닐까 하는 생각이 들기 시작했으니 실험을 해봐야겠네요. 사용자는 챗봇을 선호합니까? 지원을 덜 해야 합니까? 단순히 다른 인프라를 활용하여 새로운 메타 기능을 도입할 수 있습니까?

일반 웹 앱에 대한 몇 가지 피드백을 받았고 WhatsApp 챗봇을 만들면 이를 해결할 수 있다고 믿었습니다.

• 일부 구형 휴대폰에서는 앱이 제대로 작동하지 않았습니다.
• 그것은 지하에서 작동하지 않았습니다(주차장이 있는 곳 - 거기에는 좋은 모바일 신호가 없습니다).
• 운전자는 전화 걸기를 여는 대신 차단자에게 메시지를 보내기를 원했습니다.
• 운전자는 떠나기 전에 매번 웹 앱을 여는 대신 누군가 차단하면 푸시 알림을 받기를 원했습니다.

Telegram 또는 WhatsApp과 같은 채팅 플랫폼 개발자는 앱의 안정성을 보장하기 위해 수년 동안 밤낮으로 일했다는 것을 기억하는 것이 중요합니다. 리소스를 사용하고 질문에 답하기 위한 작은 엔진만 개발하면 채팅 플랫폼 개발자에게 유지 관리의 힘든 작업을 맡길 수 있습니다. WhatsApp 챗봇을 만드는 방법을 파헤치기만 하면 됩니다.

새로운 주차 보조 챗봇을 개발하기 시작한 직후 아이디어가 얼마나 환상적인지 깨달았습니다. 새 기능을 추가하는 것이 너무 쉽고 빠르며 종단 간 테스트를 수행할 필요조차 없었습니다.

신호 없음? 문제 없어요.

트위터

뿐만 아니라 복잡한 CI/CD 프로세스가 더 이상 필요하지 않았습니다. 채팅 에뮬레이터에서 작동하는 경우 모든 곳에서 작동합니다. .apk , Xcode, App Store 또는 Google Play가 없습니다. 챗봇은 내가 기기를 등록하거나 푸시 알림을 위해 PubSub 또는 유사한 서비스를 사용하거나 사용자 토큰을 저장할 필요 없이 사용자에게 메시지를 보낼 수 있었습니다. 인증 시스템이 필요하지 않습니다. 사용자의 전화번호를 신분증으로 사용했습니다.

신호 없음? 문제 없어요. 매니페스트 파일을 사용하여 오프라인 지원을 추가할 필요가 없었습니다. WhatsApp에서 즉시 제공했습니다. 사용자가 Wi-Fi가 더 나은 상위 레벨로 이동할 때 메시지가 곧 나갑니다.

그런 다음 채팅 플랫폼이 새로운 기능을 도입할 때마다 내 앱이 즉시 혜택을 받을 것이라는 것을 깨달았습니다. 와우-이제 정말 좋은 투자입니다. (공정하게 말해서, 새로운 기능이 기능을 제한하거나 더 많은 개발 노력이 필요한 주요 변경 사항을 생성할 수 있는 위험도 있으므로 비즈니스 크리티컬 작업을 구현하기 전에 신중하게 생각하십시오).

WhatsApp 챗봇의 프로토타입인 주차 도우미 작성

WhatsApp 챗봇을 만들기 위한 첫 번째 과제는 WhatsApp에서 프로그램으로 메시지를 받는 것입니다. 내가 찾은 가장 간단한 솔루션은 공유 Twilio 전화 번호를 사용하는 것입니다. 개발용일 뿐입니다. 프로덕션으로 이동할 때 개발자는 전용 전화번호를 사용하기를 원할 것입니다.

Twilio의 무료 번호는 각각 많은 Twilio 사용자가 공유합니다. 앱의 최종 사용자를 다른 Twilio 사용자의 앱과 구별하려면 최종 사용자가 챗봇에 미리 정의된 메시지를 보내야 합니다.

사용자가 공유 번호로 특별한 메시지를 보낸 후 해당 번호의 모든 메시지는 Twilio 계정 및 웹훅으로 전달됩니다. 이것이 프로덕션에 전용 번호가 필요한 이유입니다. 지정된 사용자가 지정된 공유 번호에서 하나의 앱만 사용하기를 원한다는 보장은 없습니다.

WhatsApp 메시지 보내기

Twilio의 "프로그래밍 가능한 SMS 대시보드"에는 왼쪽 탐색 모음에 "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의 "샌드박스" 페이지에서 개발자는 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 지도를 대체하는 챗봇을 상상해 보세요. 목적지의 문자 메시지를 보냅니다. 챗봇 플랫폼은 사용자의 위치를 ​​추적하고 챗봇은 실시간 음성 안내에 따라 자동으로 재생되는 녹음된 메시지를 전송합니다.

판타지가 아닙니다. WhatsApp은 현재 실시간 위치 공유를 지원합니다. 필요한 것은 수신된 메시지를 자동 재생하는 옵션뿐입니다. 짜잔.

Gett나 Uber 앱 대신 Waze 챗봇이나 택시 챗봇을 생각해 보세요. 현재 위치를 알려주는 메시지를 보내면 택시가 도착하고 WhatsApp으로 지불합니다. 너무 간단합니다.

일부 독자는 "사용자가 타이핑이 아닌 그래픽 인터페이스를 선호하지 않습니까?"라고 생각할 수 있습니다. 나는 챗봇 플랫폼이 챗봇 소유자에게 변환하는 동안 버튼, 이미지 및 순수한 HTML 상자를 보낼 수 있는 옵션을 제공할 것이라고 믿습니다. Facebook은 이미 Messenger용 Webview를 지원합니다. 사용자는 아무 것도 설치할 필요가 없으며 선호하는 인스턴트 메시징 앱을 사용하기만 하면 됩니다.

이러한 이점 때문에 개발자는 잘못된 정보의 확산을 억제하기 위해 코로나바이러스 전염병에 대한 즉각적이고 권위 있는 답변을 제공하는 것과 같은 중요한 작업을 처리하기 위해 WhatsApp 챗봇을 만들려고 합니다.

요약: 웹 앱을 챗봇으로 마이그레이션하는 방법에 대한 7가지 결론

요약하자면:

• 그래픽 사용자 인터페이스를 설계하고 계획할 필요가 없기 때문에 챗봇을 개발하면 개발 시간을 크게 단축할 수 있는 경우가 많습니다. (단, 시작하기 전에 챗봇 UX 디자인의 세세한 부분을 살펴보고 다른 사람들의 실수에서 배우는 것이 좋습니다.)
• 챗봇에 새로운 기능을 추가하는 것이 훨씬 쉽습니다. 개발자는 현재 요소를 다시 디자인하거나 변경할 필요가 없습니다. 챗봇은 새로운 유형의 메시지를 이해하기 시작하기만 하면 됩니다.
• 챗봇은 기본적으로 특별한 도움이 필요한 사람들이 훨씬 더 쉽게 접근할 수 있습니다.
• 플랫폼 간 솔루션을 사용자 정의할 필요가 없습니다. 챗봇 플랫폼은 이미 그렇게 하고 있습니다.
• 사용자는 정보 공유를 위해 챗봇을 훨씬 더 신뢰합니다. 권한을 요청하거나 경고를 표시할 필요가 없습니다. 예를 들어 사용자는 갤러리에서 이미지를 선택하고 챗봇으로 보내기만 하면 됩니다. 이미지 갤러리에 대한 액세스 권한은 이미 채팅 플랫폼에 부여되어 있습니다.
• 채팅 플랫폼을 사용하면 푸시 알림을 쉽게 처리할 수 있습니다. 푸시 알림은 사용자가 잊어버리는 앱과 사용자가 정기적으로 사용하는 앱 간의 차이를 만드는 것입니다.
• 채팅 플랫폼은 오프라인과 온라인 조건 간의 이동을 처리합니다.

WhatsApp 챗봇을 구축하는 방법: 이별 조언 및 모범 사례

챗봇 작성의 장점은 꽤 명확합니다. 하나를 만들 준비가 된 개발자는 하나의 메시지를 이해하는 챗봇으로 작게 시작하는 것이 좋습니다. 그리고 잘 처리합니다.

챗봇은 짧은 메시지에 충실해야 합니다. 사람들은 긴 메시지를 읽지 않습니다. 보내야 할 중요한 내용 중 간결하게 표현할 수 없는 내용이 있을 때는 메시지를 여러 개로 나누어서 보내는 것이 좋습니다.

개성 있는 챗봇이 더 잘 받습니다. 최소한의 "인간의 말"조차도 "시스템 메시지 형식"접근 방식에 비해 먼 길을갑니다. "데이터베이스가 업데이트되었습니다."대신 "주차 맵을 업데이트하겠습니다." 챗봇은 사용자가 이해할 수 없는 위치에 있을 수 있는 기술 작업을 수행하는 블랙박스가 아니라 사용자에게 서비스를 제공하기 위해 존재하는 기계라는 느낌을 사용자에게 제공해야 합니다.

이 WhatsApp 챗봇 튜토리얼은 사용자가 챗봇에 보낼 자연어 메시지 구문 분석에 대한 세부 사항을 다루지 않았습니다. 그러나 챗봇 개발 서비스를 제공하려는 야심 찬 제공자는 WhatsApp Parking Assistant 봇(특히 사용자의 요청을 작업으로 수락하는 hackparkDialogFlow.ts )의 소스 코드를 정독하여 해당 측면이 작동하는 방식에 대한 느낌을 얻을 수 있습니다.

프로그래밍에 대한 종속성 주입 접근 방식을 따르는 동시에 다양한 유형의 사용자 메시지를 감지하는 방법에 대한 자세한 기사는 Toptal의 TypeScript 챗봇 튜토리얼을 참조하십시오.

WhatsApp 챗봇 개발에 행운을 빕니다!