Esercitazione: personalizzazione dell'azione del messaggio di saluto in base alla pagina corrente

Questa esercitazione mostra come è possibile personalizzare dinamicamente l'azione del messaggio di saluto attivata dalla chat web in base alla pagina che l'utente sta attualmente visualizzando.

Per una versione completa e funzionante dell'esempio descritto in questa esercitazione, vedi Select greeting action for watsonx Assistant web chat.

Se non hai la schermata principale abilitata, il funzionamento predefinito quando si apre la chat web è di inviare un messaggio vuoto all'assistente per avviare la conversazione. Questo messaggio vuoto attiva l'azione Greet customer , che generalmente invia un messaggio di benvenuto.

Invece di avviare la conversazione con un messaggio di saluto generico, è possibile che si desideri che gli utenti visualizzino un prompt specifico della pagina che stanno già visualizzando. Ad esempio, se un utente ha già navigato in una pagina relativa alle carte di credito e quindi apre la chat web, è possibile che si desideri avviare la conversazione con un messaggio specifico per le carte di credito.

Anche se questo esempio mostra come adattare il testo in base alla pagina corrente, è possibile utilizzare lo stesso approccio di base per adattare il testo in base a qualsiasi condizione del client (come l'ora del giorno o la posizione geografica dell'utente).

Per modificare l'azione del messaggio di saluto in base alla pagina corrente visualizzata dall'utente, attenersi alla seguente procedura:

Determinare quale pagina l'utente sta attualmente visualizzando. A seconda della progettazione della propria applicazione, esistono diversi modi per eseguire questa operazione, ma un semplice meccanismo consiste nel verificare il valore di un parametro di query URL (in questo esempio page):
```
const page = new URLSearchParams(window.location.search).get('page');
```
Crea un handler per l'evento pre:send , che viene attivato prima che venga inviato un messaggio all'assistente. Questo gestore inizia controllando la proprietà is_welcome_request per determinare se il messaggio inviato è il messaggio vuoto che avvia la conversazione attivando l'azione Greet customer .

In caso affermativo, il gestore controlla la pagina attualmente visualizzata e sostituisce il messaggio vuoto in uscita con un messaggio che attiverà un'azione specifica per la pagina. Questo esempio mostra solo l'impostazione del messaggio su Credit Cards, ma ulteriori condizioni if potrebbero personalizzare il messaggio per altre pagine.
```
function preSendHandler(event) {
  if (event.data.history && event.data.history.is_welcome_request) {
    if (page === 'cards') {
      event.data.input.text = 'Credit Cards';
    }
  }
}
```
Nel tuo gestore eventi onLoad , utilizza il metodo dell'istanza once() per sottoscrivere l'evento pre:send , registrando la funzione preSendHandler() come callback. È possibile utilizzare once() invece di on() perché questo gestore deve essere richiamato solo per il primo messaggio nella sessione.
```
instance.once({ type: 'pre:send', handler: preSendHandler});
```

Per un codice di lavoro completo, vedi l'esempio Seleziona azione di saluto per la chat web watsonx Assistant .