Tutorial: Anpassen der Begrüßungsaktion basierend auf der aktuellen Seite

Dieses Tutorial zeigt, wie Sie die Begrüßungsaktion, die durch den Web-Chat ausgelöst wird, dynamisch an die Seite anpassen können, die der Benutzer gerade ansieht.

Eine vollständige, funktionsfähige Version des in diesem Tutorial beschriebenen Beispiels finden Sie unter „Begrüßungsaktion für den Web-Chat des KI-Assistenten auswählen “.

Wenn Sie den Startbildschirm nicht aktiviert haben, wird beim Öffnen des Webchats standardmäßig eine leere Nachricht an den Assistenten gesendet, um das Gespräch zu beginnen. Diese leere Nachricht löst die Aktion „_Greet customer_“ aus, die in der Regel eine Willkommensnachricht versendet.

Anstatt die Konversation mit einer allgemeinen Begrüßung zu beginnen, möchten Sie vielleicht, dass Ihre Nutzer eine Aufforderung sehen, die sich auf die Seite bezieht, die sie gerade betrachten. Wenn ein Benutzer beispielsweise bereits zu einer Seite über Kreditkarten navigiert hat und dann den Web-Chat öffnet, sollten Sie die Unterhaltung mit einer Nachricht beginnen, die sich speziell auf Kreditkarten bezieht.

Obwohl dieses Beispiel zeigt, wie der Text auf der Grundlage der aktuellen Seite angepasst wird, können Sie den gleichen grundlegenden Ansatz verwenden, um den Text auf der Grundlage einer beliebigen Client-Bedingung anzupassen (z. B. die Tageszeit oder der geografische Standort des Benutzers).

Gehen Sie folgendermaßen vor, um die Begrüßungsaktion in Abhängigkeit von der aktuellen Seite zu ändern, die der Benutzer gerade anzeigt:

1. Ermitteln Sie, welche Seite der Benutzer gerade anschaut. Je nach dem Design Ihrer Anwendung gibt es verschiedene Möglichkeiten, dies zu tun, aber ein einfacher Mechanismus besteht darin, den Wert eines URL Abfrageparameters (in diesem Beispiel page) zu überprüfen:

    const page = new URLSearchParams(window.location.search).get('page');

1. Erstelle einen Handler für das pre:send Ereignis, das ausgelöst wird, bevor eine Nachricht an den Assistenten gesendet wird. Dieser Handler überprüft zunächst die is_welcome_request Eigenschaft, um festzustellen, ob es sich bei der gesendeten Nachricht um die leere Nachricht handelt, die die Konversation durch Auslösen der Aktion „_Greet customer_“ einleitet.

Ist dies der Fall, überprüft der Handler die aktuell angezeigte Seite und ersetzt die ausgehende leere Nachricht durch eine Nachricht, die eine für die Seite spezifische Aktion auslöst. (In diesem Beispiel wird die Meldung nur auf " Credit Cards gesetzt, aber zusätzliche " if -Bedingungen könnten die Meldung für andere Seiten anpassen)

    function preSendHandler(event) {
      if (event.data.history && event.data.history.is_welcome_request) {
        if (page === 'cards') {
          event.data.input.text = 'Credit Cards';
        }
      }
    }

1. Verwenden Sie in Ihrem onLoad Ereignis-Handler die once() Instanzmethode, um das pre:send Ereignis zu abonnieren, und registrieren Sie dabei die preSendHandler() Funktion als Callback. (Wir können ' once() anstelle von ' on() verwenden, weil dieser Handler nur für die erste Nachricht in der Sitzung aufgerufen werden muss)

    instance.once({ type: 'pre:send', handler: preSendHandler});

Den vollständigen Funktionscode finden Sie im Beispiel „Begrüßung für den AI-Assistenten im Web-Chat auswählen “.