20.7 채팅 보트를 Facebook Messenger에 연결

FB_Messenger_logo

이 연습에서는 Facebook 데스크탑 사이트를 사용하여 채팅 보트를 Facebook Messenger에 연결하므로 Facebook 계정에 액세스해야 합니다.

20.7.1 Facebook 페이지 만들기

facebook 계정에 로그인하면 화면 오른쪽 상단에 있는 + 아이콘을 선택합니다.

FB_Plus_btn

여기에는 만들기 드롭다운이 표시되고 다양한 옵션이 표시됩니다.

FB_Homepage

Page​을 선택합니다.

FB_Create_Page_btn

이제 페이지 이름, 카테고리, 설명 등과 같은 페이지 정보 입력을 시작할 수 있는 옵션이 제공됩니다. 이 필드에 입력할 때 적합하지만 이 예에서는 다음을 사용했습니다.

요청된 정보 설명 답변 예
페이지 이름 ldap-fb-page idexon-fb-page
범주 [업계] 업계 또는 비즈니스 유형 소매 회사
설명 페이지 설명 채팅 보트 테스트를 위한 내 facebook 페이지

FB_CreatePage_PageDetails

완료되면 페이지 만들기​를 클릭합니다.

FB_CreatePage_btn.png

이제 왼쪽 옵션에서 프로필 사진과 커버 사진을 추가할 수 있습니다. 자유롭게 그렇게 할 수 있지만 선택적입니다.

FB_CreatePage_PageDetails_addImgs

페이지 세부 사항이 만족되면 저장​을 클릭합니다.

FB_Save_btn

이제 완료된 Facebook 페이지가 표시됩니다. 필요에 따라 언제든지 새 Facebook 페이지를 업데이트 및 편집할 수 있지만 이 자습서에서는 채팅 보트 설정을 계속 진행하겠습니다.

facebook 페이지에서 20.7.2 고급 메시지 구성

새로 만든 Facebook 페이지의 홈 페이지에는 화면 왼쪽에 옵션 목록이 표시됩니다.

FB_ManagePage_Nav

옵션 아래에서 페이지 설정​을 선택합니다.

FB_Pagesetting_btn

여기서는 Facebook 페이지를 구성하는 데 시간이 많이 소요될 수 있지만, 자습서를 위해 채팅 보트 설정을 계속 진행할 예정입니다.

FB_Pagesetting_Nav

고급 메시징​을 선택합니다.

FB_AdvancedMessaging_btn

일반 설정 > 연결된 앱​으로 스크롤합니다. 연결된 앱이 표시되지 않습니다. 채팅 UI와 채팅 보트를 연결하면 스택채트가 나열됩니다.

FB_GeneralSettings_ConnectedApps

20.7.3 Facebook Messenger에 스택 채팅 연결

facebook 페이지가 만들어졌으므로 이제 페이지로 전송되는 메시지를 관리하기 위해 Stackchat 권한을 Adobe에 부여해야 합니다. Stackchat Studio에서 Luma 보트 를 표시하고 보트 메뉴에서 통합 단추를 클릭합니다.

Stackchat_Integration_FB

오른쪽 상단에 있는 통합 추가 단추를 클릭하고 Facebook Messenger를 선택합니다.

Stackchat_Integration_FB

Facebook 권한 관리 단추를 클릭합니다.

Stackchat_Integration_FB

facebook 로그인 모달이 표시됩니다. 없는 경우 브라우저가 모달 팝업을 차단했을 수 있습니다. 경고가 있는지 확인하고 Stackchat에서 팝업을 시작할 수 있는 권한을 부여합니다. facebook 계정에 로그인합니다.

Stackchat_Integration_FB

차트 봇을 연결할 페이지를 모두 선택합니다. 스택 채트는 이 페이지를 기억하고 목록에서 선택할 수 있는 옵션을 제공합니다. 페이지를 선택했으면 다음 버튼을 누릅니다.

Stackchat_Integration_FB

이러한 권한은 그대로 둡니다. 완료 단추를 누른 다음 확인 단추를 누릅니다.

Stackchat_Integration_FB

모달이 닫히고 이제 차트 봇을 연결할 Facebook 페이지를 선택할 수 있습니다.

Stackchat_Integration_FB

통합 추가 단추를 누르면 됩니다!

20.7.4 통합 테스트

데모를 시작하려면 Facebook에 로그인하고 이전 단계에서 만든 Facebook 페이지로 이동합니다. 이 자습서에서는 Luma Retail 데모 페이지를 사용하게 됩니다.

Facebook_LumaRetail_HP

이 페이지의 관리자이므로 방문자로 보기 단추를 누르십시오.

Facebook_LumaRetail_viewVisitor

이렇게 하면 보기가 변경되고 고객인 것처럼 페이지가 표시됩니다

Facebook_LumaRetail_HP_cv

오른쪽 상단에 있는 메시지 보내기 단추를 누릅니다

Facebook_LumaRetail_sendMessage

이렇게 하면 현재 Stackchat에서 제공하는 차트봇이 열립니다. 채팅 보트를 처음 열면 시작하기 Luma 소매를 선택하면 공개 정보가 표시됩니다

Facebook_LumaRetail_ChatBot_welcomeAnon

시작하기​를 선택합니다.

Facebook_LumaRetail_ChatBot_getstarted_btn

chatbot이 시작되면 환영 메시지가 표시됩니다. 이전 섹션의 웹 메신저에서 했던 것처럼 "I need idea" 흐름을 따라 대화가 올바르게 표시되는지 테스트합니다.

Facebook_LumaRetail_ChatBot_initiate2

다음으로 Luma Bot가 해당 정책에 대한 링크를 공유하고 동의를 요청하는 것을 볼 수 있습니다. 계속하려면 ​를 클릭하십시오.

Facebook_LumaRetail_ChatBot_optin

웹 Messenger를 테스트하는 동안 사용하는 데모 이메일이나 Luma를 사용하여 첫 번째 터치 포인트인 Facebook과 같은 경험을 확인하기 위해 새 데모 이메일을 제출합니다.

Facebook_LumaRetail_ChatBot_email-submit2

이제 Luma Bot에 제품 회전판이 표시됩니다. 제품을 탐색하여 원하는 제품을 원하는 마음에 내림 아이콘을 클릭합니다. 항상 낙하산 바지를…

Facebook_LumaRetail_ChatBot_productLike

노트

핫 팁! 다음 명령들이 우리의 채팅 봇에게 은밀히 '구워진' 것이다.

  • /debug - 채팅 보트가 현재 연결되어 있는 AEP 인스턴스를 확인합니다
  • /reset - 처음부터 대화를 다시 시작할 수 있도록 해줍니다

따라서 언제든지 통합을 확인하거나 대화를 각각 재설정할 수 있습니다. 궁금한 경우 Studio UI 또는 CDML 편집기에서 이러한 키워드 구성을 찾을 수 있는지 확인합니다. 이 키워드 구성은 정규 표현식을 사용하여 구성됩니다.

이제 Cora Acroutass Pants 제품을 '좋아함'으로 확인했으므로, 이메일의 받은 편지함을 확인하여 Exercise 20.4에 설정된 여정이 트리거되어 성공적으로 배달되었음을 확인할 수 있습니다.

배달된 JO 이메일

다음에 '대화'를 온사이트에서 어떻게 계속할 수 있는지 알아보겠습니다. 이제 Luma 보트와 방금 나눈 Facebook Messenger 대화 내용이 Luma 소매업체와의 첫 번째 상호 작용이었다고 가정해 보겠습니다. Facebook에서 Luma 보트와 상호 작용한 후 처음 웹 사이트 방문자가 어떤 경험을 사용하는지 살펴보겠습니다. 시크릿 모드​의 Luma 웹 사이트로 이동합니다. 새 시크릿 창이므로 평소대로 ldap, 브랜드(Luma)를 설정해야 합니다. 새로운 Incognito Luma 웹 사이트를 열면 X-Ray 패널을 확인하여 프로필 속성이나 Experience Events가 없는 새로운 사용자임을 확인하십시오.

web_incog-xray.png

LOGIN/REGISTER 페이지로 이동하여 Facebook Messenger 대화 내에서 사용한 이메일에 등록하십시오. 로그인하고 나면 홈 페이지로 돌아가 X-Ray 패널을 엽니다. 이제 경험 이벤트 아래에 Facebook 상호 작용이 표시됩니다.

web_xray-fb-interaction

이제 웹 사이트와 웹 메신저가 사용자의 초기 Facebook 상호 작용을 인지하고 있으므로 '대화'를 계속 진행하여 사용자가 원하는 대로 다음 상호 작용을 개인화할 수 있습니다. 당신은 정보에 없는 시크릿 경험이었더라면 했던 것과는 반대로, 사회적 채널로부터 대화를 확장했을 뿐이다.

됐습니다. 이제 Facebook 통합을 완료하고 Facebook Messenger 및 Web Messenger에서 테스트했습니다.

다음으로, 다른 소셜 채널인 WeChat… 을 간단히 살펴보겠습니다.

다음 단계: 20.8 WeChat 통합 테스트

모듈 20으로 돌아가기

모든 모듈로 돌아가기

이 페이지에서는