AI 기반 WhatsApp 챗봇 구축: 단계별 가이드

게시 됨: 2024-03-22

요약:

Node.js와 OpenAI의 기능을 활용하여 AI 기반 WhatsApp 챗봇을 단계별로 구축하는 방법을 알아보세요. Meta 비즈니스 계정 설정부터 WhatsApp API와 OpenAI 통합까지, 이 가이드는 기업이 고객 상호 작용을 간소화하고 자동화된 커뮤니케이션의 새로운 가능성을 열어줄 수 있도록 지원합니다.

오늘날의 디지털 시대에는 인공 지능(AI)의 힘을 활용하여 고객 상호 작용을 향상시키는 것이 시장에서 앞서 나가기 위해 노력하는 기업에게 가장 중요합니다. 전 세계적으로 가장 널리 사용되는 메시징 플랫폼 중 하나인 WhatsApp은 기업이 청중과 효과적으로 소통할 수 있는 최고의 기회를 제공합니다. AI 기반 WhatsApp 챗봇의 영역으로 들어가세요. 이러한 가상 비서는 고객 서비스를 혁신하고 24시간 지원을 제공하며 커뮤니케이션 프로세스를 간소화하고 있습니다.

급성장하는 스타트업이든 기존 기업이든 관계없이 올바른 접근 방식을 사용하면 개발 단계를 더욱 간단하게 진행할 수 있습니다. 이 종합 가이드에서는 WhatsApp Business API를 Node.js 애플리케이션과 통합하는 데 필요한 기본 원칙, 단계별 절차 및 중요한 고려 사항을 살펴보겠습니다. OpenAI의 자연어 처리 기능을 활용하여 청중의 공감을 불러일으키는 원활한 사용자 경험을 만들어 보겠습니다.

WhatsApp Business 계정 설정부터 OpenAI의 API를 Node.js 코드와 통합하는 것까지 프로세스를 이해하고 자체 AI 기반 솔루션을 구축할 수 있도록 지원하는 과정을 따라해보세요. AI 기반 대화 에이전트 영역으로의 이 혁신적인 여정은 혼자서 수행해야 하는 여정이 아닙니다. AI 챗봇 개발 회사는 귀하의 신뢰할 수 있는 파트너로서 귀중한 통찰력과 전문 지식을 제공할 수 있습니다. 이 흥미진진한 탐험을 함께 시작해 보세요.

1단계: 메타(Facebook) 비즈니스 계정 및 앱 설정

  1. 먼저 메타 비즈니스 계정을 만드세요(여기를 클릭하세요).

세부 사항을 입력하고 제출을 클릭하세요.

2. 새 메타(Facebook) 앱을 만듭니다(여기 클릭).

  • (로그인) 메타(Facebook) 개발자 계정에 로그인하세요.

로그인 후 '내 앱'을 클릭하세요.

내 앱을 클릭하세요

3. 이제 '앱 만들기'를 클릭하세요.

4. “기타”를 선택하고 “다음”을 클릭하세요.

5. 앱 유형: "비즈니스"를 선택하고 "다음"을 클릭하세요.

6. 앱 세부정보를 제공하고 '앱 만들기'를 클릭하세요.

2단계: WhatsApp 통합을 위한 메타(Facebook) 앱 설정

1. 메타(페이스북) 앱에 WhatsApp을 추가하세요.

  • '개발자 대시보드'에서 앱을 선택하세요.
  • 앱의 대시보드 탭에서 '앱에 제품 추가'를 찾습니다.
  • 설정을 위해 “WhatsApp”을 선택하세요.
  • 메타(Facebook) 비즈니스 계정을 선택하세요.
  • 사이드바에서 앱 설정 > 기본으로 이동하세요.
  • 변경 사항을 저장하다.
  • 앱 모드를 라이브로 설정

3단계: WhatsApp 토큰 생성

영구 WhatsApp 액세스 토큰을 얻으려면 다음 1~3단계를 따르세요.

1. "시스템 사용자"를 생성합니다:

  • 메타 비즈니스 스위트를 방문해 보세요.
  • 왼쪽 상단 드롭다운 메뉴에서 비즈니스 계정을 찾아 설정(톱니바퀴) 아이콘을 클릭하세요.
  • 비즈니스 설정을 클릭합니다.
  • 사용자 > 시스템 사용자로 이동합니다.
  • 관리 시스템 사용자를 추가합니다.

2. 자산을 추가합니다.

  • 시스템 사용자를 생성한 후 자산 추가를 클릭합니다.
  • 앱 > '앱 이름'으로 이동합니다.
  • 앱을 선택하고 앱 관리에 대한 모든 권한을 부여하세요.

3. 시스템 사용자 액세스 토큰을 생성합니다.

  • 시스템 사용자에서 새 토큰 생성 버튼을 클릭합니다.

토큰을 사용할 앱을 선택하고 토큰 만료를 없음으로 설정하세요.

  • "whatsapp_business_messaging" 및 "whatsapp_business_management" 권한을 선택하세요.
  • 토큰을 생성합니다.
  • 액세스 토큰을 복사하여 안전하게 저장하세요.

4. WhatsApp에 대한 새 비즈니스 번호 추가

  • 자신의 회사 번호를 사용하거나 WhatsApp 챗봇에 제공된 테스트 번호를 활용할 수 있습니다.
  • WhatsApp 개발자 대시보드의 사이드바에서 WhatsApp > API 설정으로 이동하세요.
  • '5단계: 전화번호 추가'로 이동하여 전화번호 추가를 클릭하세요.
  • 다음 양식에 필요한 세부 정보를 입력하세요.
  • 수신된 코드를 사용하여 번호를 확인하세요.
  • 성공적으로 추가되면 API 설정 1단계에서 전화번호를 선택하세요.

5. 결제수단 추가

  • WhatsApp을 통해 메시지를 보내려면 유효한 결제 방법이 필요합니다. 자세한 내용은 여기를 방문하세요.
  • 회사 전화번호를 추가한 후 '결제 수단 추가'를 클릭하여 '유효한 결제 수단 누락' 알림을 해결하세요.
  • WhatsApp 계정 설정으로 이동됩니다. '결제 수단' > '비즈니스 결제 수단 추가'를 클릭하고 안내에 따라 카드 정보를 추가하세요.

6. WhatsApp의 새 비즈니스 번호를 테스트하세요

  • WhatsApp 개발자 대시보드로 돌아가서 API 설정으로 이동하세요.
  • 테스트 "받는 사람" 번호를 입력하세요.
  • 성공적인 메시지 전달을 확인하려면 "메시지 보내기"를 클릭하세요.

4단계: WhatsApp API Webhook 설정 구성

1. WhatsApp Webhook 콜백을 확인하세요.

  • WhatsApp 개발자 대시보드에서 구성으로 이동합니다.
  • 웹훅에서 편집을 클릭하세요.
  • 이제 WhatsApp에 라이브 웹훅 URL과 토큰을 제공해야 합니다. 라이브 URL은 애플리케이션의 URL이며 토큰도 사용자 측에서 생성됩니다. 아래 이미지에서는 Node.js 애플리케이션이 Ngrok에서 실행되고 UUID를 토큰으로 사용했기 때문에 Ngrok URL을 추가했습니다.
  • 확인 프로세스에서 WhatsApp은 허브 토큰의 유효성을 검사하기 위해 콜백 URL에 GET 요청을 보냅니다. Next.js(Node.js 프레임워크)로 작성된 다음 코드는 이 확인 프로세스를 처리합니다. 아래와 같이 코드가 응답으로 200 상태 코드를 보내는 경우에만 확인이 성공합니다.
비동기 함수 내보내기 GET(req: NextRequest) {

허브모드 = req.nextUrl.searchParams.get("hub.mode");

lethubChallenge = req.nextUrl.searchParams.get("hub.challenge");

lethubToken = req.nextUrl.searchParams.get("hub.verify_token");

//데이터베이스에서 토큰 찾기

만약에 (

HubMode === "구독" &&

hubToken === "<.env 또는 데이터베이스의 값>"

) {

console.log("성공적으로 확인되었습니다.");

새로운 응답(hubChallenge)을 반환합니다.

}

return new Response("잘못된 자격 증명", { status: 400 });

}

  • "메시지" 필드를 찾아 상자를 선택하여 구독하세요.
  • 이제 동일한 WhatsApp 비즈니스 계정에서 얻는 WhatsApp 액세스 토큰과 Facebook 앱 비밀이 필요합니다.
  • 아래 이미지에서 Facebook 앱 비밀을 볼 수 있습니다.

또한 다음과 같은 강조 표시된 데이터를 유지해야 합니다.

코드에는 액세스 토큰, 앱 비밀번호, 테스트 번호, 전화번호 ID, 비즈니스 계정 ID와 같은 다양한 식별자가 필요합니다. 이러한 식별자는 우리가 메시지를 받는 사람과 메시지를 보내야 하는 사람을 결정하는 데 도움이 됩니다.

5단계: API를 통해 메시지 보내기 및 받기

  • 제공된 TypeScript 코드에서 WhatsApp API를 성공적으로 통합하여 메시지를 보내고 받습니다. 또한 내 목표를 위해 OpenAI와 맞춤형 학습 AI 모델을 통합하여 들어오는 메시지에 응답했습니다.
  • WhatsApp에 제공된 콜백 URL은 GET 및 POST 요청 모두에 사용됩니다. 회사 전화번호로 메시지가 전송되면 WhatsApp은 이 콜백 URL을 트리거하고 사용자 세부정보와 함께 메시지를 보냅니다. 다음 코드는 해당 메시지를 읽고 구현된 논리에 따라 응답합니다.
  • POST 함수는 들어오는 POST 요청을 처리하는 비동기 함수입니다. 먼저 JSON으로 들어오는 요청을 구문 분석하고 WhatsApp에서 사용자가 보낸 메시지를 추출합니다. 메시지가 정의되지 않았거나 비어 있으면 상태 200의 응답을 반환하고 더 이상 진행되지 않습니다.
  • 그런 다음 함수는 요청에서 회사 전화번호와 보낸 사람의 전화번호를 검색합니다.
  • 그런 다음 함수는 WhatsApp을 통해 사용자에게 메시지를 다시 보내기 위한 POST 요청을 준비합니다. 요청에 대한 URL을 구성하고, 보낼 메시지를 정의하고, 메서드, 헤더, 본문을 포함한 요청 옵션을 설정합니다.
  • 그런 다음 함수는 가져오기 함수를 사용하여 요청을 보냅니다. 요청이 성공하면 상태 200의 응답을 반환합니다. 어느 지점에서든 오류가 발생하면 콘솔에 기록됩니다.
  • getResponseNumber 함수는 수신 요청에서 발신자의 전화번호를 추출하는 도우미 함수입니다.
  • 이 코드는 Node.js 애플리케이션을 WhatsApp Business API와 통합하여 자동으로 메시지를 보내고 받는 방법에 대한 기본 예를 제공합니다.

// 사용자가 봇에게 질문을 하고 사용자에게 응답하면 WhatsApp은 이 게시물 요청을 트리거합니다.

비동기 함수 내보내기 POST(req: NextRequest) {

let res: any = req.json()을 기다립니다.

질문FromWhatsapp = 하자

res?.entry?.[0]?.changes?.[0]?.value?.messages?.[0]?.text?.body; // WhatsApp에서 받은 질문

만약에 (

질문FromWhatsapp == 정의되지 않음 ||

질문FromWhatsapp.trim().length <= 0

) {

//요청이 상태에 관한 것이라면 더 이상 진행하지 마세요.

// NextResponse.json({ 메시지: "수신됨" })을 반환합니다.

return new Response("수신됨", { 상태: 200 });

}

//응답에서 전화번호 ID를 가져옵니다. 이 전화번호는 회사 전화번호입니다

const 전화번호Id =

res?.entry?.[0]?.changes?.[0]?.value?.metadata["phone_number_id"];

//이 메서드는 메시지를 받은 전화번호를 반환합니다.

const responseNumber = getResponseNumber(res);

// 데이터베이스에서 userId 검색

노력하다 {

const 버전 = "v18.0";

//한도에 도달했는지 확인

const 전화번호;

const receivePhoneNumber = "+" + responseNumber;

// const accessToken = process.env.WHATSAPPTOKEN

const accessToken = "페이스북에서 얻는 토큰";

노력하다 {

//--------------- 텔레그램으로 메시지를 보내기 위한 코드입니다.

const url = `https://graph.facebook.com/${version}/${phoneNumberId}/messages`;

// 요청 본문에 전송할 데이터를 정의합니다.

const 데이터 = {

message_product: "왓츠앱",

receive_type: "개인",

받는 사람: `${recipientPhoneNumber}`,

유형: "텍스트",

텍스트: {

Preview_url: 거짓,

body: "안녕하세요. 저는 챗봇입니다. 현재는 바쁘기 때문에 곧 연락드리겠습니다.",

},

};

// 가져오기 요청에 대한 옵션을 정의합니다.

const 옵션 = {

방법: "POST",

헤더: {

"콘텐츠 유형": "응용 프로그램/json",

승인: `전달자 ${accessToken}`,

},

본문: JSON.stringify(데이터),

};

// 가져오기를 사용하여 POST 요청 만들기

노력하다 {

const 응답 = 가져오기(url, 옵션)를 기다립니다.

if (!response.ok) {

throw new Error(`HTTP 오류! 상태: ${response.status}`);

}

const 데이터 = 응답을 기다립니다.json();

// 필요에 따라 데이터를 처리합니다.

} 잡기(오류) {

// 필요에 따라 오류를 처리합니다.

console.log(오류);

}

return new Response("수신됨", { 상태: 200 });

} 잡기(오류) {

console.log("오류", 오류);

}

} 잡기 (오류: 모두) {

console.log(오류);

//처리 취소 오류가 발생한 경우 데이터베이스에 오류 로그를 보관합니다.

}

}

const getResponseNumber = (res: any) => {

return res?.entry?.[0]?.changes?.[0]?.value?.contacts[0]?.wa_id;

};

결론

이 종합 가이드에서는 WhatsApp Business API를 Node.js 애플리케이션과 통합하는 복잡한 과정을 살펴보았습니다. 웹후크 설정부터 수신 메시지 처리 및 맞춤형 응답 전송까지 액세스 토큰, 앱 비밀, 테스트 번호, 전화번호 ID, 비즈니스 계정 ID 처리와 같은 필수 단계를 다루었습니다.

이러한 원활한 통합을 통해 기업은 WhatsApp에서 커뮤니케이션을 자동화할 수 있을 뿐만 아니라 고객 지원 봇 제작, 마케팅 활동 자동화, 개인 프로젝트 추진 등 다양한 가능성을 열어줍니다. 당신이 이 여행을 시작할 때, 이것은 단지 기초일 뿐이라는 것을 기억하십시오. WhatsApp Business API는 탐색하고 애플리케이션에 통합하기를 기다리는 수많은 추가 기능을 제공합니다.

AI 챗봇 개발 노력을 지속적으로 개선하면서 전문 지식을 활용하는 것을 고려해 보십시오. AI 챗봇 개발회사 . 그들의 통찰력과 지원은 귀하의 진행을 촉진하여 귀하의 챗봇 노력이 최대한의 잠재력을 발휘할 수 있도록 보장합니다. 개발 과정을 진행하면서 포괄적이고 정확한 정보를 얻으려면 항상 공식 WhatsApp Business API 문서를 참조하세요.