{"id":14653,"date":"2024-03-22T18:53:00","date_gmt":"2024-03-22T18:53:00","guid":{"rendered":"https:\/\/csdev.site\/creole_new\/?p=14653"},"modified":"2024-08-20T10:33:22","modified_gmt":"2024-08-20T10:33:22","slug":"build-ai-whatsapp-chatbot-step-by-step","status":"publish","type":"post","link":"https:\/\/csdev.site\/creole_new\/build-ai-whatsapp-chatbot-step-by-step\/","title":{"rendered":"Building an AI-Powered WhatsApp Chatbot: A Step-by-Step Guide"},"content":{"rendered":"\n<h2 class=\"wp-block-heading\"><strong>Summary:<\/strong><\/h2>\n\n\n\n<p>Learn how to build a WhatsApp AI chatbot step-by-step, leveraging Node.js and OpenAI\u2019s capabilities. From setting up a Meta business account to integrating WhatsApp API and OpenAI, this guide empowers businesses to streamline customer interactions and unlock new possibilities in automated communication.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Introduction<\/strong><\/h2>\n\n\n\n<p>In today\u2019s digital age, harnessing the power of artificial intelligence (AI) to enhance customer interactions is paramount for businesses striving to stay ahead in the market. WhatsApp, being one of the most widely used messaging platforms globally, presents a prime opportunity for businesses to engage with their audience effectively. Enter the realm of WhatsApp ai chatbot. These virtual assistants are revolutionizing customer service, providing round-the-clock support, and streamlining communication processes.<\/p>\n\n\n\n<p>Whether you\u2019re a burgeoning startup or an established enterprise, navigating through the steps of development can be made simpler with the right approach. In this comprehensive guide, we\u2019ll explore the fundamental principles, step-by-step procedures, and crucial considerations necessary for integrating the WhatsApp Business API with your Node.js application. Harnessing the power of OpenAI\u2019s natural language processing capabilities, we\u2019ll craft a seamless user experience that resonates with your audience.<\/p>\n\n\n\n<p>From setting up your WhatsApp Business account to integrating OpenAI\u2019s API with your Node.js code, follow along as we demystify the process and empower you to build your AI-driven solution. This transformative journey into the realm of conversational AI chatbot is not one you have to undertake alone. An <a href=\"https:\/\/csdev.site\/creole_new\/ai-chatbot-development\/\" target=\"_blank\" rel=\"noreferrer noopener\"><strong>AI Chatbot Development Company<\/strong><\/a> can serve as your trusted partner, providing invaluable insights and expertise along the way. Let\u2019s embark on this exciting expedition together.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Step 1: Setting Up Meta (Facebook) Business Account and App<\/strong><\/h2>\n\n\n\n<ol class=\"wp-block-list\">\n<li><strong>First create a Meta business account, (<\/strong><a href=\"https:\/\/business.facebook.com\/\" target=\"_blank\" rel=\"noreferrer noopener\"><strong>click here<\/strong><\/a><strong>).<\/strong><\/li>\n<\/ol>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXfufznPcsXgMK0tXPOcqwfpGaM2_Irt4Z7Z9OOEdFDNOQkKTDr4_WbB6hdAKU6AEu_w-ArxrZP62cmmuoTqpJnWQsEiXULduu19paPDeqofur4CnmSn-eG_2iP-rss3moKLUZ8828mkcEaTZoPg7q-fUkBf?key=BDiNiVOHydXubbrOBy8KTQ\" alt=\"\"\/><\/figure>\n\n\n\n<p>Fill the details and click on Submit.<\/p>\n\n\n\n<p><strong>2. Create a new Meta (Facebook) App (<\/strong><a href=\"https:\/\/developers.facebook.com\/\" target=\"_blank\" rel=\"noreferrer noopener\"><strong>click here<\/strong><\/a><strong>).<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/business.facebook.com\/business\/loginpage\/?next=https%3A%2F%2Fdevelopers.facebook.com%2F&amp;app=436761779744620&amp;login_options%5B0%5D=FB&amp;login_options%5B1%5D=SSO&amp;is_work_accounts=1\" target=\"_blank\" rel=\"noreferrer noopener\">(Log in<\/a>) to your Meta (Facebook) Developer Account.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXd5RzK4ArNmKZTEYthFSVe2LHOIJbPoxBjyRTNK9FaxVR0YccfhE8qRwuqE7NwRTn_68pj95Egb7_jrYlL5WeCNTFbKqe3NSCctM5Ny6a5_UHJLMy5mw0GWl7JbSPYx2Kdb3GouWkmTBhSNKZX64QcYB5k?key=BDiNiVOHydXubbrOBy8KTQ\" alt=\"\"\/><\/figure>\n\n\n\n<p>After login, click on \u201cMy Apps\u201d<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXf-k5xfUl1yq-Bi2Mg0tERAAiXlmJWY_MtbL27Ux9WgKo41BR-d9IJw4GQieIjs08zLYvC7weDTXeGAJIIftV-pByeYiRPRaHPuxEFoO6cIFL9AyPZFvC6NZnzL3ScrOjqUmh0_sHKeEhztJQaB2Ew54Y3G?key=BDiNiVOHydXubbrOBy8KTQ\" alt=\"click on my app\"\/><\/figure>\n\n\n\n<p><strong>3. Now click on \u201ccreate app\u201d<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXf0bRS3vRenjrru5S_-vHMkoGF_QDU022_Ai1KBXuG-6Ds2ewz0JPTOllb8qCwsUym60xhS_MjpVq0JFYvI6DorvF2nvz6_-WPCg9VwAdhA9nolAxRHZv1sylcv-ybLSA5XDPYEk_OYdvhy0bBiEW33SQA?key=BDiNiVOHydXubbrOBy8KTQ\" alt=\"\"\/><\/figure>\n\n\n\n<p><strong>4. Select \u201cOther\u201d and click \u201cnext\u201d.<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXcy7WfLW9uyeCldrdvo3DGvhVoAyoEv14jjV7dl_Mcys1SDeORyC59_of5TxN1K9Sl13cTEQrq_Jxe6m8_MSB1FjK29pUDKu4S3nCIL99Vb1CSTVMIBre-yYX-ijXuHAIILFyWA30kPQeB5B4HAw6Uap0k?key=BDiNiVOHydXubbrOBy8KTQ\" alt=\"\"\/><\/figure>\n\n\n\n<p><strong>5. Choose App Type: \u201cBusiness\u201d and click \u201cNext\u201d.<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXdCQmaJDWEXnQ5ESFhLT5UY0w8ee_IkXk-bGmByYLPMhk105u_LD6Tz7gU0Lflj0xAaSg_3tw0G4t19L4WADMYhscecNP5ifjp2B-ZNPme9mL_9nC5D6bpenvZpj34GkynJShb5Yx4iYpCs2q3P2QsTXZjd?key=BDiNiVOHydXubbrOBy8KTQ\" alt=\"\"\/><\/figure>\n\n\n\n<p><strong>6. Provide app details and click on \u201cCreate App\u201d<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXcoMT_h4-CscxUnc_la7b9YNpiVM9XFsEuMc5ax7qEhMEe9adHJKwQRMloPE4YXIOaz-B3qpO0SBVPedP8yz0XJsCgwnrLUqwVKwlUhtJBLaNX1dIGyHoOWL6b15T45goBOlG80Ck28kceiWYdeBRgykBNq?key=BDiNiVOHydXubbrOBy8KTQ\" alt=\"\"\/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Step 2: Setting Up Meta (Facebook) App for WhatsApp Integration<\/strong><\/h2>\n\n\n\n<p><strong>1. Add WhatsApp to your Meta (Facebook) App.<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>In the \u201cDevelopers Dashboard\u201d, choose your app.&nbsp;<\/li>\n\n\n\n<li>Locate \u201cAdd products to your app\u201d in your app\u2019s dashboard tab.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXcNIrTvr-n3q38n4xd1OMyTZqFWxNYJ3WVVFXfVfN0IDMgJAFTPEr9ixpKBHmKpcLpY8zhNseZbHDkQ0SinZefQjE4zPJLAw9MwgOpHUsVJiiNuafsBX1Mr6OESbMHGTNu5VghMjqSn_wD88CatOLEOBWc6?key=BDiNiVOHydXubbrOBy8KTQ\" alt=\"\"\/><\/figure>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Choose \u201cWhatsApp\u201d for setup.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXcSWlqgS6Z7EpAL9N2A61dhApbwkj6R_TYymmIiEAA8dvBkxpkRqrSueIJ9W30XDkQwqg_0ORzc6tvBQ3DPzdPGYM8Y7Xd4YszW0BKm2nsZs1FMK9MXIQkfsuxmVEEtFUWi1T4eBCHIDuOTXlVld45gIUaX?key=BDiNiVOHydXubbrOBy8KTQ\" alt=\"\"\/><\/figure>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Select your Meta (Facebook) Business Account<\/li>\n\n\n\n<li>Navigate to App settings &gt; Basic from the sidebar<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXcq7OpMY4wuXU_alpcmjI6U4DBWjPY8kFvRywBtpxjq_Z1zuYQ3cwEOxIPGCVE8tYroUPID0x2FePCzHmo7_zWWH15m5-jmVFMi-urLQ5QBlEUO_RVoSuFd6tmNaxZ3DgVF6zNe79Sti_TvhI_H_E7YYtp7?key=BDiNiVOHydXubbrOBy8KTQ\" alt=\"\"\/><\/figure>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Save changes.<\/li>\n\n\n\n<li>Set App Mode to Live<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXcUaTDiZJZh6RRlJfAQkNt66K_PGxbwz4QW9ze2TJ59OsYAc3OEs8kCT6mkKoRB4CKPEg3xr0p-kr3lm_Yd3WFxKQZ4Tw-h8VWVYgp1Zrtb44dSNtFCjcDJKvzdcQeKqS-KUrDWWZ9zuuBSbkLqBUSasN4O?key=BDiNiVOHydXubbrOBy8KTQ\" alt=\"\"\/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Step 3: Generate WhatsApp Token<\/strong><\/h2>\n\n\n\n<p>To obtain a permanent WhatsApp Access Token, follow 1 to 3 steps:<\/p>\n\n\n\n<p><strong>1. Create a \u201cSystem User\u201d:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Visit the <a href=\"https:\/\/business.facebook.com\/\" target=\"_blank\" rel=\"noreferrer noopener\">Meta Business Suite<\/a>.<\/li>\n\n\n\n<li>Find your business account in the top-left dropdown menu and click its Settings (gear) icon.<\/li>\n\n\n\n<li>Click Business Settings.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXeC7yH_jdAHnfDyv4Gy7P1zzEPIFISEcrTNWgbWBCjEthasmJyITeI4f1sN4prOFCuxFq9_IhsXAYtkC-AehhGSBOJojRpTZe3KXX7yxP09Px_GjiPtEXj3kjqkLK8CYITRatVrF3abdgKC1sD9CqqK5IIc?key=BDiNiVOHydXubbrOBy8KTQ\" alt=\"\"\/><\/figure>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Go to <a href=\"https:\/\/business.facebook.com\/settings\/system-users\" target=\"_blank\" rel=\"noreferrer noopener\">Users > System users<\/a>.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXfzCH9f-dtTRShKmJBdHwt9NJiTKzVAjL6YyD-16BX-5J2Gg-jlCKzKMoeoxjLVgjfVXibqVtq0uQwxYUInvGd8hOz9MZFhvBHcCC2LdO6TFaB6CgILzNdPqC5kseWtuQ5lo64hBO-POExQEfj5u-v4jAs7?key=BDiNiVOHydXubbrOBy8KTQ\" alt=\"\"\/><\/figure>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Add an Admin system user.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXfpsosE-K16s7EJfiIgqcHAPinC3zPhvSUqxmuYparhLPxm2qgq8iiL3y__whQ_ps_VbZTgNWi5eWcSUKiosdQzoglzc2xfK5l3wYrHICoGbxo9Fz0UmGpKgU8sDKmNp5DArcCezxGtml8Fyq4cwdh-vl0?key=BDiNiVOHydXubbrOBy8KTQ\" alt=\"\"\/><\/figure>\n\n\n\n<p><strong>2. Add Assets.<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>After creating the system user, click on Add Assets.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXenT25UBbBEADttua_yhYMgr0_DR_S1Wx-VZe4IAebxOVFt17hBqE8Mmc31PLtUGjXJ7i6KcVrm_CyNMHkHQDDilDhBc8s_3N0D18pPPp6ctY2HjjWaW5sdW2AZYV9gOVLdLJdYSS3nsCfzfzgY-RJ3uoj_?key=BDiNiVOHydXubbrOBy8KTQ\" alt=\"\"\/><\/figure>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Navigate to Apps &gt; \u201cYour app name\u201d.<\/li>\n\n\n\n<li>Select your app and grant full control to manage the app.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXe4D3UABR_eE8QenZx2VON5t7XbcHyyt-5MXm0ACcSR311XDkxj0I0iHSPBPm-5SRD6t5DD91tvnVYZY85YbhnZmeYVBNzaE7OzFCp0kzPdxmcL_-ur6v3PqS2t8HyYJ08jqCoxtXSZgH_UVaeJoCra1fc?key=BDiNiVOHydXubbrOBy8KTQ\" alt=\"\"\/><\/figure>\n\n\n\n<p><strong>3. Generate System User Access Tokens.<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Click the Generate New Token button on the system user.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXdQ3vW98sJESSMbQC4h09JuRxOOG4EynXyKAdqZ5A2DThHzicRvFUnkmaUrVayuRX-rlOgtOLIIkTTQAdQgEewQ5p1Jy_yMFpD5p4UjTjWnqRqIIauUKPlpRPHWm7xUQFl41_HagU3nnTDK3Gy_gSWr4Y9a?key=BDiNiVOHydXubbrOBy8KTQ\" alt=\"\"\/><\/figure>\n\n\n\n<p>Choose the app that will use the token and set the token expiration to never.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXccubOwCW_xtIQOBsrfY4kpGgdZg2uEb3AS9ikKxhjN0JHe3VZYQpP-ohHCLiHZY1o0j32PrEoLCteSu67CjAsMNKj0-ct84KR75JVEU88cZ2USiJVjmf_va36aW06FQaMUfMb5_nErsXlW5aEsJfTgq_qY?key=BDiNiVOHydXubbrOBy8KTQ\" alt=\"\"\/><\/figure>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Select \u201cwhatsapp_business_messaging\u201d and \u201cwhatsapp_business_management\u201d permissions.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXcwcAGBkMTIdY1_pWOgDSDRvXaP8SFw1J8IyN3luKLlyP5RnwP41NfP2Fbj0lb-DqTl76KoMUOPTzyTASWifTu0Bvn1ClRPzmhZ17ITcYNZdjX10WTI3036jbVxYGvgEZ4OsgkDg5f0fGQziz6zszDq_mI?key=BDiNiVOHydXubbrOBy8KTQ\" alt=\"\"\/><\/figure>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Generate the token.<\/li>\n\n\n\n<li>Copy the access token and store it securely.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXeazbH7Jno29jy6EMzGR0_oo2FZwcQ7fyTvenI1BcQveJ3DTbRSS4QPsNtnQlTvYRBm3wsYze7Hrvu12d7UxahgPjkK0tXcJfLPjgTxkShaPTQSLTEs2I_ADQ1Tb97NRaHldJqxCriUw1dbSkfTOX9vzM4?key=BDiNiVOHydXubbrOBy8KTQ\" alt=\"\"\/><\/figure>\n\n\n\n<p><strong>4. Add a new Business Number for WhatsApp<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>You can use your business number or utilize the provided test number for your WhatsApp AI chatbot.<\/li>\n\n\n\n<li>In the <a href=\"https:\/\/developers.facebook.com\/apps\/\" target=\"_blank\" rel=\"noreferrer noopener\">WhatsApp Developer Dashboard<\/a>, navigate to WhatsApp > API Setup from the sidebar.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXd-sVxBCXWmyauex40Y0eJp1GNHKKjoGKzcec9RDj-KGi7zIl4-oJJHbGK7Wdag4o4ezLAeWYGicnCX5PFAeeVSSP8JMVUMhG2rB-UwLev8LzcZHjC1FhaLz5AwwibOYIk4e5oAZNFoxYdnOh1CD5PIQ5Tt?key=BDiNiVOHydXubbrOBy8KTQ\" alt=\"\"\/><\/figure>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Proceed to \u201cStep 5: Add a Phone Number,\u201d click Add phone number.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXdjrS8-QRZ-V_cH7zi4bgoTbffTBMtbjOoEXkTI2vYUGoCQFHd-lrQugY_m23_PTr3XBrV6xOH2HPZ5BVpsTEKZR9eIO0dfkAZGdmJ-OxBk7k_j0sC3_bs26JpdU7QCrcFbEe8JfxJgKJ4n11krb6O2_VI?key=BDiNiVOHydXubbrOBy8KTQ\" alt=\"\"\/><\/figure>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Provide details required in the following form.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXeyDj53ah3ySQ48v7MOhHKYdQNHS9nhuhZOBbG2aIsgjxWF3yNPfe5QBRldZB3TRwyZaCJS26Va8xOylvMirN-FNNdzKZQVYGXxsGS_N2jFS1SQxGeFEEIS6CO0KAGYd6OYksFtqtX_fkDuHjDCp_M-35c?key=BDiNiVOHydXubbrOBy8KTQ\" alt=\"\"\/><\/figure>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Verify your number using the received code.<\/li>\n\n\n\n<li>Once successfully added, select your phone number in Step 1 of API Setup.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXf9qwJmIJgX_cLoU0ecK8fFxnnH2pYSvWyDmiZCe6yzPkw3pdqu8Rr7HySRsJgQvALkWRMXHBJJYswO9mb4KN6qYpes39QedQ6H5GwEdPuR0AniOuY4gTzg6kLBzq_xjkWXsCIiqUxJJEZi7RNMjPXsa0s?key=BDiNiVOHydXubbrOBy8KTQ\" alt=\"\"\/><\/figure>\n\n\n\n<p><strong>5. Add a Payment Method<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>To send messages via WhatsApp, you need a valid payment method. Visit <a href=\"https:\/\/developers.facebook.com\/docs\/whatsapp\/pricing\/\" target=\"_blank\" rel=\"noreferrer noopener\">here<\/a> for details.<\/li>\n\n\n\n<li>After adding your business phone number, click \u201cAdd payment method\u201d to address the \u201cMissing valid payment method\u201d alert.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXedc3Dc47QdV4giXu3jHZ8NbdBjoHU381dns7KNtwIowFVlbLBlQKRMRcnFmScB-EcTiy_KyaMKz8yLPQvRClp-r9wdqCiQOji084DRWlDFI6TDi3TzSnYMclgfDqwpJjjGBdeEz4N9eJu6foqY4lgjQNAS?key=BDiNiVOHydXubbrOBy8KTQ\" alt=\"\"\/><\/figure>\n\n\n\n<ul class=\"wp-block-list\">\n<li>You\u2019ll be directed to your WhatsApp account settings. Click \u201cPayment Methods\u201d &gt; \u201cAdd business payment method\u201d and follow the prompts to add your card info.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXcjGp6IADEomjErukz86QyqLECKv3MTnFqYHCnSUqR12LzsqleRxLHk8SD9Axs_9LWGZAesUwthwabOr6v2x4LUWSNGQXodH0uTYeNy75v4MYVtWsud_riSVIzla-rmsOaN_I3VLEW2gzIryLH2p8se29D2?key=BDiNiVOHydXubbrOBy8KTQ\" alt=\"\"\/><\/figure>\n\n\n\n<p><strong>6. Test your new Business Number for WhatsApp<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Return to WhatsApp Developer Dashboard, navigate to API Setup&nbsp;<\/li>\n\n\n\n<li>Enter a testing \u201cTo\u201d number.<\/li>\n\n\n\n<li>Click \u201cSend message\u201d to verify successful message delivery.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXeF25Afj4JEfR5BHxJ1Yi7HDHXetXeSjAPKKxdjcuGWH04nl-_h_FEZH0LtVzuPUhd7AvBZwZH0eG9xTk_8D9tvVJJIT-yN48h9-qGHUhMawJEkiL6ogtSsksdGtTqPsNwV35C7eUv4I-2j7WeMBkSKymU?key=BDiNiVOHydXubbrOBy8KTQ\" alt=\"\"\/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Step 4: Configure WhatsApp API Webhook settings<\/strong><\/h2>\n\n\n\n<p><strong>1. Verify WhatsApp Webhook Callback.<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>In WhatsApp Developer Dashboard, navigate to Configuration.<\/li>\n\n\n\n<li>Under Webhook, click edit<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXfNeE4qSP8IwqvKodUjXbfmWwc2Mpg3z4lJqIOIw_nlosU8GAfBxYjdn1JzZblNlP2Du1SzQYRHjSWE3cF92XGck_u4mGazEjI7L-BzFAB7OO9rPLqXwrGx2gnT9lLw_KG5bJA550Onwuv31bugNFSf-rbN?key=BDiNiVOHydXubbrOBy8KTQ\" alt=\"\"\/><\/figure>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Now, we need to provide a live webhook URL and token to WhatsApp. The live URL is your application\u2019s URL, and the token is also generated from your end. In the image below, I\u2019ve added my Ngrok URL because my Node.js application is running on Ngrok, and I\u2019ve used a UUID as a token.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXcRH8-b9s-hxqR_QM6GuABCagEuXJfo4XppUQL1sPy0_OawJSxOnkkHNfZNOZVYXnDP3Tt3uGlMZmxYOblIgrmLYZT-lqJJC7Ixj5n_B146AjJbMEKA2JCxMFWKM4dAvIEeXXRT4nd-jwmV7ZAy3dy13Zeq?key=BDiNiVOHydXubbrOBy8KTQ\" alt=\"\"\/><\/figure>\n\n\n\n<ul class=\"wp-block-list\">\n<li>In the verification process, WhatsApp sends a GET request to the callback URL to validate the hub token. The following code, written in Next.js (a Node.js framework), handles this verification process. The verification will only be successful if your code sends a 200 status code in response, as shown below.<\/li>\n<\/ul>\n\n\n\n<div class=\"code\"><code>\n<p>export async function GET(req: NextRequest) {<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;let hubMode = req.nextUrl.searchParams.get(\"hub.mode\");<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;let hubChallenge = req.nextUrl.searchParams.get(\"hub.challenge\");<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;let hubToken = req.nextUrl.searchParams.get(\"hub.verify_token\");<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;\/\/find the token in database<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;if (<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;hubMode === \"subscribe\" &amp;&amp;<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;hubToken === \"&lt;value from .env OR from database&gt;\"<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;) {<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;console.log(\"verified successfully\");<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return new Response(hubChallenge);<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;}<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;return new Response(\"Invalid Credentials\", { status: 400 });<\/p>\n\n\n\n<p>&nbsp;}<\/p><\/code><\/div>\n\n\n\n<p><\/p>\n\n\n\n<p><\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-us.googleusercontent.com\/WR0TAhgEBjb1WdPpzt60NUKMHQ-E0qNvd7sHKzceYKCqXhOGZ2rij9JYmDX0xh8z6VRQY71GZiKCAzqKqHvQCRxQqK1-Xzn0Mxn0Rati4FQicyA5_eeScO6ebfM6N20OxVjI2HEsjG4ZjRIrFlEQO98\" alt=\"\"\/><\/figure>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Find the \u201cmessages\u201d field and subscribe to it by checking the box.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-us.googleusercontent.com\/EKPBjccfJ0aXuwurGajl6O3UyFvo-jM5WuRKb_fai5nqcKvyRy87RB_DE7wQqWwicz_alKboa8_nhED5bI55XcjE-XrojCURURmTX6V_6MqWDWXGcRi20663yd0ldQc915qQJdiKt5I3T4yre_Hvh6E\" alt=\"\"\/><\/figure>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Now we need WhatsApp Access token and Facebook app secrete which we get from the same WhatsApp business account<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-us.googleusercontent.com\/_v6pSyyhHf2r5Y_HJJHzP0Iu1wqMytjpuOhayXFLlDVHb1QbDt5wXs0dVq5AMBp8W8PUoS4n56199uEEzrD15UZhJ1OoJpp7erggsftnylpONOZHHI4zbo_lgPLePieTwb5Iyp-sn0Ne8VntRTLJA9A\" alt=\"\"\/><\/figure>\n\n\n\n<ul class=\"wp-block-list\">\n<li>In the below image you see Facebook app secrete<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-us.googleusercontent.com\/liuL5cr71H6HJ_ijGDv6VxY5s42pR5nSnsVp93ZWP96ruhpFxtx5UJlIJy-Fpi2egpBwc0skQYYNIqwdujObwbac2JGNZtOm_WUqipSj9A7KqES6XmqGrnWKmPSdkNjPFHlCFEgkhGlKghiDaOl9vdQ\" alt=\"\"\/><\/figure>\n\n\n\n<p>also we need to keep the following highlighted data<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-us.googleusercontent.com\/S5iRetlpChPaJan6vXMuFgvunU0H9n4fp6Sd_3V-oi1X9xbbm8fvLCGN0BN9H4E6VhRggQkVa_92OTEswxNzUY_EEXIGZOZgS9GxmJWN-CA-ob0cm2AFOyeZ61E8OSVbZOQQBZBSQsvL1gqmSTLut6g\" alt=\"\"\/><\/figure>\n\n\n\n<p>In our code, we need various identifiers such as the access token, app secret, test number, phone number ID, and business account ID. These identifiers help us determine from whom we are receiving messages and to whom we need to send messages.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Step 5: Sending and Receiving message through API<\/strong><\/h2>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-us.googleusercontent.com\/-bhMOl1lmjsiazA3qVl14iO0FrqEyn9m9Yrrep89eNbgUnXOPN9toAiqLsFBJdQxxIT_7-YhR0qMCHUxrujxN6OyyIrdZCCp2wT_t9VvUSMQnSVD4mLrzr1vikuKFzztug7sObJeo7j6ovZ3S9r_nTg\" alt=\"\"\/><\/figure>\n\n\n\n<ul class=\"wp-block-list\">\n<li>In the provided TypeScript code, we have successfully integrated the WhatsApp API to send and receive messages. Additionally, I have incorporated OpenAI and a custom-trained AI model to respond to incoming messages, for my goal.<\/li>\n\n\n\n<li>The callback URL provided to WhatsApp is used for both GET and POST requests. When a message is sent to the business number, WhatsApp triggers this callback URL and sends the message along with user details. The following code reads that message and responds based on the implemented logic.<\/li>\n\n\n\n<li>The POST function is an asynchronous function that handles incoming POST requests. It first parses the incoming request to JSON and extracts the message sent by the user from WhatsApp. If the message is undefined or empty, it returns a response with a status of 200 and does not proceed further.<\/li>\n\n\n\n<li>The function then retrieves the business phone number and the sender\u2019s phone number from the request.&nbsp;<\/li>\n\n\n\n<li>The function then prepares a POST request to send a message back to the user via WhatsApp. It constructs the URL for the request, defines the message to be sent, and sets the request options, including the method, headers, and body.<\/li>\n\n\n\n<li>The function then sends the request using the fetch function. If the request is successful, it returns a response with a status of 200. If an error occurs at any point, it is logged to the console.<\/li>\n\n\n\n<li>The getResponseNumber function is a helper function that extracts the sender&#8217;s phone number from the incoming request.<\/li>\n\n\n\n<li>This code provides a basic example of how to integrate a Node.js application with the WhatsApp Business API, allowing for automated sending and receiving of messages.<\/li>\n<\/ul>\n\n\n\n<p>\/\/ WhatsApp will triger this post request once user asked question to bot and also response to the user<\/p>\n\n\n\n<div class=\"code\"><code>\n<p>export async function POST(req: NextRequest) {<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;let res: any = await req.json();<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;let questionFromWhatsapp =<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;res?.entry?.[0]?.changes?.[0]?.value?.messages?.[0]?.text?.body; \/\/ question received from whatsapp<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;if (<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;questionFromWhatsapp == undefined ||<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;questionFromWhatsapp.trim().length &lt;= 0<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;) {<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;\/\/if the request is only about status don't move further<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;\/\/ return NextResponse.json({ message: \"received\" });<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return new Response(\"received\", { status: 200 });<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;}<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;\/\/get the phone number id from the response. this phone number is business number<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;const phoneNumberId =<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;res?.entry?.[0]?.changes?.[0]?.value?.metadata[\"phone_number_id\"];<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;\/\/this method will return the phone number from whom the message has been received<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;const responseNumber = getResponseNumber(res);<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;\/\/ retriving userId from database<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;try {<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;const version = \"v18.0\";<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;\/\/check whether limit is reached or not<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;const phoneNumberId = \"your phone number id\";<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;const recipientPhoneNumber = \"+\" + responseNumber;<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;\/\/ const accessToken = process.env.WHATSAPPTOKEN<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;const accessToken = \"token which you get from facebook\";<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;try {<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;\/\/--------------- This code is for sending message to telegram<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;const url = `https:\/\/graph.facebook.com\/${version}\/${phoneNumberId}\/messages`;<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;\/\/ Define the data to be sent in the request body<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;const data = {<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;messaging_product: \"whatsapp\",<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;recipient_type: \"individual\",<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;to: `${recipientPhoneNumber}`,<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;type: \"text\",<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;text: {<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;preview_url: false,<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;body: \"Hii, I am a chatbot, I am currently busy, I will get back to you soon.\",<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;},<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;};<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;\/\/ Define the options for the fetch request<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;const options = {<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;method: \"POST\",<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;headers: {<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;\"Content-Type\": \"application\/json\",<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Authorization: `Bearer ${accessToken}`,<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;},<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;body: JSON.stringify(data),<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;};<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;\/\/ Make the POST request using fetch<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;try {<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;const response = await fetch(url, options);<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if (!response.ok) {<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;throw new Error(`HTTP error! Status: ${response.status}`);<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;const data = await response.json();<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;\/\/ Handle the data as needed<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} catch (error) {<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;\/\/ Handle the error as needed<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;console.log(error);<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return new Response(\"received\", { status: 200 });<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} catch (error) {<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;console.log(\"error\", error);<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;} catch (error: any) {<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;console.log(error);<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;\/\/mantain the error log in database, in case of unhandle error<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;}<\/p>\n\n\n\n<p>}<\/p>\n\n\n\n<p>const getResponseNumber = (res: any) =&gt; {<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;return res?.entry?.[0]?.changes?.[0]?.value?.contacts[0]?.wa_id;<\/p>\n\n\n\n<p>};<\/p><\/code><\/div>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Conclusion<\/strong><\/h3>\n\n\n\n<p>In this comprehensive guide, we\u2019ve navigated the intricacies of integrating the WhatsApp Business API with a Node.js application. From setting up webhooks to processing incoming messages and sending tailored responses, we\u2019ve covered essential steps like handling access tokens, app secrets, test numbers, phone number IDs, and business account IDs.<\/p>\n\n\n\n<p>This seamless integration not only empowers businesses to automate communication on WhatsApp but also unlocks a myriad of possibilities, whether it\u2019s crafting customer support bots, automating marketing endeavors, or pursuing personal projects. As you embark on this journey, remember that this is merely a foundation. The WhatsApp Business API offers a plethora of additional features waiting to be explored and integrated into your application.<\/p>\n\n\n\n<p>As you continue to refine your WhatsApp AI chatbot development endeavors, consider leveraging the expertise of an<strong> <\/strong><a href=\"https:\/\/csdev.site\/creole_new\/ai-chatbot-development\/\" target=\"_blank\" rel=\"noreferrer noopener\"><strong>AI Chatbot Development Company<\/strong><\/a>. Their insights and support can catalyze your progress, ensuring your WhatsApp AI chatbot endeavors reach their full potential. Always refer to the official <a href=\"https:\/\/developers.facebook.com\/docs\/whatsapp\/api\/reference\" target=\"_blank\" rel=\"noreferrer noopener\"><strong>WhatsApp Business API documentation<\/strong><\/a> for comprehensive and accurate information as you advance in your development journey.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Summary: Learn how to build a WhatsApp AI chatbot step-by-step, leveraging Node.js and OpenAI\u2019s capabilities. From setting up a Meta business account to integrating WhatsApp API and OpenAI, this guide empowers businesses to streamline customer interactions and unlock new possibilities in automated communication. Introduction In today\u2019s digital age, harnessing the power of artificial intelligence (AI) [&hellip;]<\/p>\n","protected":false},"author":8,"featured_media":14654,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"class_list":["post-14653","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","cs-tags-ai-chatbot"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v25.4 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Building an AI-Powered WhatsApp Chatbot: Step-by-Step Guide<\/title>\n<meta name=\"description\" content=\"Learn to build an AI-powered WhatsApp chatbot with Node.js and OpenAI. Streamline customer interactions and unlock automated communication.\" \/>\n<meta name=\"robots\" content=\"noindex, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Building an AI-Powered WhatsApp Chatbot: Step-by-Step Guide\" \/>\n<meta property=\"og:description\" content=\"Learn to build an AI-powered WhatsApp chatbot with Node.js and OpenAI. Streamline customer interactions and unlock automated communication.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/csdev.site\/creole_new\/build-ai-whatsapp-chatbot-step-by-step\/\" \/>\n<meta property=\"og:site_name\" content=\"Creole Studios\" \/>\n<meta property=\"article:published_time\" content=\"2024-03-22T18:53:00+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-08-20T10:33:22+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/csdev.site\/creole_new\/wp-content\/uploads\/2024\/04\/Building-an-AI-Powered-WhatsApp-Chatbot.webp\" \/>\n\t<meta property=\"og:image:width\" content=\"1600\" \/>\n\t<meta property=\"og:image:height\" content=\"1200\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/webp\" \/>\n<meta name=\"author\" content=\"Rudresh Sisode\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Rudresh Sisode\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"14 minutes\" \/>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Building an AI-Powered WhatsApp Chatbot: Step-by-Step Guide","description":"Learn to build an AI-powered WhatsApp chatbot with Node.js and OpenAI. Streamline customer interactions and unlock automated communication.","robots":{"index":"noindex","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"og_locale":"en_US","og_type":"article","og_title":"Building an AI-Powered WhatsApp Chatbot: Step-by-Step Guide","og_description":"Learn to build an AI-powered WhatsApp chatbot with Node.js and OpenAI. Streamline customer interactions and unlock automated communication.","og_url":"https:\/\/csdev.site\/creole_new\/build-ai-whatsapp-chatbot-step-by-step\/","og_site_name":"Creole Studios","article_published_time":"2024-03-22T18:53:00+00:00","article_modified_time":"2024-08-20T10:33:22+00:00","og_image":[{"width":1600,"height":1200,"url":"https:\/\/csdev.site\/creole_new\/wp-content\/uploads\/2024\/04\/Building-an-AI-Powered-WhatsApp-Chatbot.webp","type":"image\/webp"}],"author":"Rudresh Sisode","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Rudresh Sisode","Est. reading time":"14 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/csdev.site\/creole_new\/build-ai-whatsapp-chatbot-step-by-step\/#article","isPartOf":{"@id":"https:\/\/csdev.site\/creole_new\/build-ai-whatsapp-chatbot-step-by-step\/"},"author":{"name":"Rudresh Sisode","@id":"https:\/\/csdev.site\/creole_new\/#\/schema\/person\/3cc94e6b0e748646fdcfba081146d832"},"headline":"Building an AI-Powered WhatsApp Chatbot: A Step-by-Step Guide","datePublished":"2024-03-22T18:53:00+00:00","dateModified":"2024-08-20T10:33:22+00:00","mainEntityOfPage":{"@id":"https:\/\/csdev.site\/creole_new\/build-ai-whatsapp-chatbot-step-by-step\/"},"wordCount":1403,"commentCount":0,"publisher":{"@id":"https:\/\/csdev.site\/creole_new\/#organization"},"image":{"@id":"https:\/\/csdev.site\/creole_new\/build-ai-whatsapp-chatbot-step-by-step\/#primaryimage"},"thumbnailUrl":"https:\/\/csdev.site\/creole_new\/wp-content\/uploads\/2024\/04\/Building-an-AI-Powered-WhatsApp-Chatbot.webp","inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/csdev.site\/creole_new\/build-ai-whatsapp-chatbot-step-by-step\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/csdev.site\/creole_new\/build-ai-whatsapp-chatbot-step-by-step\/","url":"https:\/\/csdev.site\/creole_new\/build-ai-whatsapp-chatbot-step-by-step\/","name":"Building an AI-Powered WhatsApp Chatbot: Step-by-Step Guide","isPartOf":{"@id":"https:\/\/csdev.site\/creole_new\/#website"},"primaryImageOfPage":{"@id":"https:\/\/csdev.site\/creole_new\/build-ai-whatsapp-chatbot-step-by-step\/#primaryimage"},"image":{"@id":"https:\/\/csdev.site\/creole_new\/build-ai-whatsapp-chatbot-step-by-step\/#primaryimage"},"thumbnailUrl":"https:\/\/csdev.site\/creole_new\/wp-content\/uploads\/2024\/04\/Building-an-AI-Powered-WhatsApp-Chatbot.webp","datePublished":"2024-03-22T18:53:00+00:00","dateModified":"2024-08-20T10:33:22+00:00","description":"Learn to build an AI-powered WhatsApp chatbot with Node.js and OpenAI. Streamline customer interactions and unlock automated communication.","breadcrumb":{"@id":"https:\/\/csdev.site\/creole_new\/build-ai-whatsapp-chatbot-step-by-step\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/csdev.site\/creole_new\/build-ai-whatsapp-chatbot-step-by-step\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/csdev.site\/creole_new\/build-ai-whatsapp-chatbot-step-by-step\/#primaryimage","url":"https:\/\/csdev.site\/creole_new\/wp-content\/uploads\/2024\/04\/Building-an-AI-Powered-WhatsApp-Chatbot.webp","contentUrl":"https:\/\/csdev.site\/creole_new\/wp-content\/uploads\/2024\/04\/Building-an-AI-Powered-WhatsApp-Chatbot.webp","width":1600,"height":1200,"caption":"Building-an-AI-Powered-WhatsApp-Chatbot"},{"@type":"BreadcrumbList","@id":"https:\/\/csdev.site\/creole_new\/build-ai-whatsapp-chatbot-step-by-step\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/csdev.site\/creole_new\/"},{"@type":"ListItem","position":2,"name":"Building an AI-Powered WhatsApp Chatbot: A Step-by-Step Guide"}]},{"@type":"WebSite","@id":"https:\/\/csdev.site\/creole_new\/#website","url":"https:\/\/csdev.site\/creole_new\/","name":"Creole Studios","description":"Creole Studios","publisher":{"@id":"https:\/\/csdev.site\/creole_new\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/csdev.site\/creole_new\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/csdev.site\/creole_new\/#organization","name":"Creole Studios","url":"https:\/\/csdev.site\/creole_new\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/csdev.site\/creole_new\/#\/schema\/logo\/image\/","url":"https:\/\/csdev.site\/creole_new\/wp-content\/uploads\/2024\/04\/creole_smalllogo.webp","contentUrl":"https:\/\/csdev.site\/creole_new\/wp-content\/uploads\/2024\/04\/creole_smalllogo.webp","width":290,"height":158,"caption":"Creole Studios"},"image":{"@id":"https:\/\/csdev.site\/creole_new\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/csdev.site\/creole_new\/#\/schema\/person\/3cc94e6b0e748646fdcfba081146d832","name":"Rudresh Sisode","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/csdev.site\/creole_new\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/e04ff138cac38146b3b36c84f05496d322e90929c4a20cf427032cda2c49bf5d?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/e04ff138cac38146b3b36c84f05496d322e90929c4a20cf427032cda2c49bf5d?s=96&d=mm&r=g","caption":"Rudresh Sisode"}}]}},"_links":{"self":[{"href":"https:\/\/csdev.site\/creole_new\/wp-json\/wp\/v2\/posts\/14653","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/csdev.site\/creole_new\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/csdev.site\/creole_new\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/csdev.site\/creole_new\/wp-json\/wp\/v2\/users\/8"}],"replies":[{"embeddable":true,"href":"https:\/\/csdev.site\/creole_new\/wp-json\/wp\/v2\/comments?post=14653"}],"version-history":[{"count":5,"href":"https:\/\/csdev.site\/creole_new\/wp-json\/wp\/v2\/posts\/14653\/revisions"}],"predecessor-version":[{"id":16514,"href":"https:\/\/csdev.site\/creole_new\/wp-json\/wp\/v2\/posts\/14653\/revisions\/16514"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/csdev.site\/creole_new\/wp-json\/wp\/v2\/media\/14654"}],"wp:attachment":[{"href":"https:\/\/csdev.site\/creole_new\/wp-json\/wp\/v2\/media?parent=14653"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}