Costruire un chatbot WhatsApp basato sull'intelligenza artificiale: una guida passo passo

Pubblicato: 2024-03-22

Riepilogo:

Scopri passo dopo passo come creare un chatbot WhatsApp basato sull'intelligenza artificiale, sfruttando le funzionalità di Node.js e OpenAI. Dalla creazione di un account Meta aziendale all'integrazione dell'API WhatsApp e OpenAI, questa guida consente alle aziende di semplificare le interazioni con i clienti e sbloccare nuove possibilità nella comunicazione automatizzata.

Nell'era digitale di oggi, sfruttare il potere dell'intelligenza artificiale (AI) per migliorare le interazioni con i clienti è fondamentale per le aziende che desiderano rimanere all'avanguardia nel mercato. WhatsApp, essendo una delle piattaforme di messaggistica più utilizzate a livello globale, rappresenta un'ottima opportunità per le aziende di interagire in modo efficace con il proprio pubblico. Entra nel regno dei chatbot WhatsApp basati sull'intelligenza artificiale. Questi assistenti virtuali stanno rivoluzionando il servizio clienti, fornendo supporto 24 ore su 24 e semplificando i processi di comunicazione.

Che tu sia una startup in espansione o un'impresa consolidata, la navigazione attraverso le fasi di sviluppo può essere semplificata con il giusto approccio. In questa guida completa, esploreremo i principi fondamentali, le procedure dettagliate e le considerazioni cruciali necessarie per integrare l'API WhatsApp Business con la tua applicazione Node.js. Sfruttando la potenza delle capacità di elaborazione del linguaggio naturale di OpenAI, creeremo un'esperienza utente fluida che sia in sintonia con il tuo pubblico.

Dalla configurazione del tuo account WhatsApp Business all'integrazione dell'API di OpenAI con il tuo codice Node.js, seguici mentre demistificamo il processo e ti consentiamo di creare la tua soluzione basata sull'intelligenza artificiale. Questo viaggio di trasformazione nel regno degli agenti conversazionali guidati dall'intelligenza artificiale non è un viaggio che devi intraprendere da solo. Una società di sviluppo di chatbot AI può fungere da partner di fiducia, fornendo informazioni e competenze inestimabili lungo il percorso. Partiamo insieme per questa entusiasmante spedizione.

Passaggio 1: configurazione dell'account aziendale e dell'app Meta (Facebook).

  1. Per prima cosa crea un account Meta business (clicca qui).

Compila i dettagli e fai clic su Invia.

2. Crea una nuova app Meta (Facebook) (fai clic qui).

  • (Accedi) al tuo account sviluppatore Meta (Facebook).

Dopo aver effettuato l'accesso, fare clic su "Le mie app"

clicca sulla mia app

3. Ora clicca su “crea app”

4. Selezionare "Altro" e fare clic su "Avanti".

5. Scegli il tipo di app: "Business" e fai clic su "Avanti".

6. Fornisci i dettagli dell'app e fai clic su "Crea app"

Passaggio 2: configurazione dell'app Meta (Facebook) per l'integrazione di WhatsApp

1. Aggiungi WhatsApp alla tua app Meta (Facebook).

  • Nella "Dashboard sviluppatori", scegli la tua app.
  • Individua "Aggiungi prodotti alla tua app" nella scheda del dashboard della tua app.
  • Scegli "WhatsApp" per la configurazione.
  • Seleziona il tuo account aziendale Meta (Facebook).
  • Passare a Impostazioni app > Base dalla barra laterale
  • Salvare le modifiche.
  • Imposta la modalità app su Live

Passaggio 3: genera token WhatsApp

Per ottenere un token di accesso WhatsApp permanente, segui da 1 a 3 passaggi:

1. Creare un “Utente di sistema”:

  • Visita la Meta Business Suite.
  • Trova il tuo account aziendale nel menu a discesa in alto a sinistra e fai clic sull'icona Impostazioni (ingranaggio).
  • Fai clic su Impostazioni aziendali.
  • Vai su Utenti > Utenti del sistema.
  • Aggiungi un utente del sistema amministratore.

2. Aggiungi risorse.

  • Dopo aver creato l'utente di sistema, fare clic su Aggiungi risorse.
  • Passare ad App > "Nome della tua app".
  • Seleziona la tua app e concedi il pieno controllo per gestire l'app.

3. Genera token di accesso utente del sistema.

  • Fare clic sul pulsante Genera nuovo token sull'utente del sistema.

Scegli l'app che utilizzerà il token e imposta la scadenza del token su mai.

  • Seleziona le autorizzazioni "whatsapp_business_messaging" e "whatsapp_business_management".
  • Genera il token.
  • Copia il token di accesso e conservalo in modo sicuro.

4. Aggiungi un nuovo numero aziendale per WhatsApp

  • Puoi utilizzare il tuo numero aziendale o utilizzare il numero di prova fornito per il tuo chatbot WhatsApp.
  • Nella dashboard per sviluppatori di WhatsApp, vai su WhatsApp > Configurazione API dalla barra laterale.
  • Procedi al "Passaggio 5: aggiungi un numero di telefono", fai clic su Aggiungi numero di telefono.
  • Fornire i dettagli richiesti nel modulo seguente.
  • Verifica il tuo numero utilizzando il codice ricevuto.
  • Una volta aggiunto correttamente, seleziona il tuo numero di telefono nel passaggio 1 della configurazione API.

5. Aggiungi un metodo di pagamento

  • Per inviare messaggi tramite WhatsApp è necessario un metodo di pagamento valido. Visita qui per i dettagli.
  • Dopo aver aggiunto il numero di telefono della tua attività, fai clic su "Aggiungi metodo di pagamento" per risolvere l'avviso "Metodo di pagamento valido mancante".
  • Verrai indirizzato alle impostazioni del tuo account WhatsApp. Fai clic su "Metodi di pagamento" > "Aggiungi metodo di pagamento aziendale" e segui le istruzioni per aggiungere i dati della tua carta.

6. Prova il tuo nuovo numero aziendale per WhatsApp

  • Torna alla dashboard per sviluppatori di WhatsApp, vai alla configurazione API
  • Inserisci un numero "A" per il test.
  • Fare clic su "Invia messaggio" per verificare la corretta consegna del messaggio.

Passaggio 4: configura le impostazioni del webhook API di WhatsApp

1. Verifica la richiamata del webhook WhatsApp.

  • Nella Dashboard per sviluppatori di WhatsApp, vai a Configurazione.
  • In Webhook, fai clic su Modifica
  • Ora dobbiamo fornire un URL webhook live e un token a WhatsApp. L'URL live è l'URL della tua applicazione e anche il token viene generato da te. Nell'immagine seguente, ho aggiunto il mio URL Ngrok perché la mia applicazione Node.js è in esecuzione su Ngrok e ho utilizzato un UUID come token.
  • Nel processo di verifica, WhatsApp invia una richiesta GET all'URL di richiamata per convalidare il token dell'hub. Il codice seguente, scritto in Next.js (un framework Node.js), gestisce questo processo di verifica. La verifica avrà esito positivo solo se il tuo codice invia in risposta un codice di stato 200, come mostrato di seguito.
esporta la funzione asincrona GET(req: NextRequest) {

let hubMode = req.nextUrl.searchParams.get("hub.mode");

lascia che hubChallenge = req.nextUrl.searchParams.get("hub.challenge");

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

//trova il token nel database

Se (

hubMode === "iscriviti" &&

hubToken === "<valore da .env OR dal database>"

) {

console.log("verificato con successo");

restituire una nuova risposta(hubChallenge);

}

return new Response("Credenziali non valide", { status: 400 });

}

  • Trova il campo "messaggi" e iscriviti selezionando la casella.
  • Ora abbiamo bisogno del token di accesso WhatsApp e del segreto dell'app Facebook che otteniamo dallo stesso account aziendale WhatsApp
  • Nell'immagine qui sotto vedi l'app Facebook secret

inoltre dobbiamo conservare i seguenti dati evidenziati

Nel nostro codice abbiamo bisogno di vari identificatori come token di accesso, segreto dell'app, numero di test, ID del numero di telefono e ID dell'account aziendale. Questi identificatori ci aiutano a determinare da chi riceviamo messaggi e a chi dobbiamo inviarli.

Passaggio 5: invio e ricezione di messaggi tramite API

  • Nel codice TypeScript fornito, abbiamo integrato con successo l'API WhatsApp per inviare e ricevere messaggi. Inoltre, ho incorporato OpenAI e un modello di intelligenza artificiale personalizzato per rispondere ai messaggi in arrivo, per il mio obiettivo.
  • L'URL di richiamata fornito a WhatsApp viene utilizzato sia per le richieste GET che per quelle POST. Quando un messaggio viene inviato al numero aziendale, WhatsApp attiva questo URL di richiamata e invia il messaggio insieme ai dettagli dell'utente. Il codice seguente legge il messaggio e risponde in base alla logica implementata.
  • La funzione POST è una funzione asincrona che gestisce le richieste POST in entrata. Innanzitutto analizza la richiesta in arrivo su JSON ed estrae il messaggio inviato dall'utente da WhatsApp. Se il messaggio è indefinito o vuoto, restituisce una risposta con stato 200 e non procede oltre.
  • La funzione recupera quindi dalla richiesta il numero di telefono dell'azienda e il numero di telefono del mittente.
  • La funzione prepara quindi una richiesta POST per inviare un messaggio all'utente tramite WhatsApp. Costruisce l'URL per la richiesta, definisce il messaggio da inviare e imposta le opzioni della richiesta, inclusi metodo, intestazioni e corpo.
  • La funzione invia quindi la richiesta utilizzando la funzione fetch. Se la richiesta ha esito positivo, restituisce una risposta con uno stato 200. Se si verifica un errore in qualsiasi momento, viene registrato nella console.
  • La funzione getResponseNumber è una funzione di supporto che estrae il numero di telefono del mittente dalla richiesta in arrivo.
  • Questo codice fornisce un esempio di base di come integrare un'applicazione Node.js con l'API WhatsApp Business, consentendo l'invio e la ricezione automatizzati di messaggi.

// WhatsApp attiverà questa richiesta di post una volta che l'utente ha posto la domanda al bot e anche la risposta all'utente

esporta la funzione asincrona POST(req: NextRequest) {

let res: any = attendono req.json();

lascia questionFromWhatsapp =

res?.entry?.[0]?.changes?.[0]?.value?.messages?.[0]?.text?.body; // domanda ricevuta da whatsapp

Se (

questionFromWhatsapp == non definito ||

questionFromWhatsapp.trim().length <= 0

) {

//se la richiesta riguarda solo lo stato non andare oltre

// restituisce NextResponse.json({ messaggio: "ricevuto" });

return new Response("ricevuto", { status: 200 });

}

//ottiene l'ID del numero di telefono dalla risposta. questo numero di telefono è il numero aziendale

const phoneNumberId =

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

//questo metodo restituirà il numero di telefono da cui è stato ricevuto il messaggio

const numerorisposta = getNumerorisposta(res);

// recupero dell'ID utente dal database

Tentativo {

versione const = "v18.0";

//controlla se il limite è stato raggiunto o meno

numerotelefono const;

const destinatarioPhoneNumber = "+" + rispostaNumero;

// const accessToken = process.env.WHATSAPPTOKEN

const accessToken = "token che ottieni da Facebook";

Tentativo {

//--------------- Questo codice serve per inviare il messaggio a Telegram

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

// Definisce i dati da inviare nel corpo della richiesta

dati costanti = {

messaggistica_prodotto: "whatsapp",

recipient_type: "individuo",

a: `${recipientPhoneNumber}`,

digitare: "testo",

testo: {

anteprima_url: falso,

body: "Ciao, sono un chatbot, al momento sono occupato, ti ricontatterò presto.",

},

};

// Definisce le opzioni per la richiesta di recupero

opzioni const = {

metodo: "POST",

intestazioni: {

"Tipo di contenuto": "application/json",

Autorizzazione: `Portatore ${accessToken}`,

},

corpo: JSON.stringify(dati),

};

// Effettua la richiesta POST utilizzando fetch

Tentativo {

const risposta = attendono fetch(url, opzioni);

se (!risposta.ok) {

lancia un nuovo errore(`Errore HTTP! Stato: ${response.status}`);

}

const data = attendono risposta.json();

// Gestire i dati secondo necessità

} cattura (errore) {

// Gestire l'errore secondo necessità

console.log(errore);

}

return new Response("ricevuto", { status: 200 });

} cattura (errore) {

console.log("errore", errore);

}

} catch (errore: qualsiasi) {

console.log(errore);

//mantiene il registro degli errori nel database, in caso di errore non gestito

}

}

const getResponseNumber = (res: qualsiasi) => {

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

};

Conclusione

In questa guida completa, abbiamo esplorato le complessità dell'integrazione dell'API WhatsApp Business con un'applicazione Node.js. Dalla configurazione dei webhook all'elaborazione dei messaggi in arrivo e all'invio di risposte personalizzate, abbiamo trattato passaggi essenziali come la gestione dei token di accesso, dei segreti delle app, dei numeri di prova, degli ID dei numeri di telefono e degli ID degli account aziendali.

Questa perfetta integrazione non solo consente alle aziende di automatizzare la comunicazione su WhatsApp, ma sblocca anche una miriade di possibilità, che si tratti di creare bot di assistenza clienti, automatizzare le attività di marketing o perseguire progetti personali. Mentre ti imbarchi in questo viaggio, ricorda che questo è semplicemente un fondamento. L'API WhatsApp Business offre numerose funzionalità aggiuntive in attesa di essere esplorate e integrate nella tua applicazione.

Mentre continui a perfezionare le tue attività di sviluppo di chatbot AI, considera di sfruttare l'esperienza di un Società di sviluppo di AI Chatbot . Le loro intuizioni e il loro supporto possono catalizzare i tuoi progressi, garantendo che le attività del tuo chatbot raggiungano il loro pieno potenziale. Fai sempre riferimento alla documentazione ufficiale dell'API WhatsApp Business per informazioni complete e precise mentre avanzi nel tuo percorso di sviluppo.