20.5 Integration zwischen Stackchat und Adobe Experience Platform konfigurieren

Damit Stackchat Ereignisse von Adobe Experience Platform senden und empfangen kann, müssen Sie eine Integration in Stackchat Studio erstellen und konfigurieren. Bevor Sie die Integration in Stackchat Studio einrichten, müssen Sie ein Adobe I/O-Projekt erstellt haben, mit dem Sie mit den Adobe Experience Platform-APIs interagieren können.

20.5.1 Ihr bestehendes Adobe I/O-Projekt

In Modul 3 haben Sie während Übung 3.3.2 - Einrichten Ihres Adobe I/O-ProjektsIhr eigenes Adobe I/O-Projekt erstellt. Wenn Sie dieses Adobe I/O-Projekt erstellt haben, wurde ein Zertifikatpaar erstellt. Sie müssen dieses Zertifikatpaar während dieser Übung verwenden. Wenn Sie das Zertifikat nicht mehr haben, führen Sie die in Übung 3.3.2 - Einrichten des Adobe I/O-Projekts beschriebenen Schritte aus, um entweder ein neues Projekt zu erstellen oder einfach ein neues Zertifikatpaar zu generieren.

Bevor Sie fortfahren, müssen Sie die folgenden Dateien bereitstellen:

  • private.key
  • certificate_pub.crt

Diese wurden während der Einrichtung Ihres Adobe I/O-Projekts generiert und automatisch in einer ZIP-Datei mit dem Namen config.zip auf Ihren Computer heruntergeladen.

Außerdem müssen Sie Ihr Adobe I/O-Projekt öffnen, um weitere wichtige Informationen zu Ihrem Dienstkonto (JWT) abzurufen, wie Client-ID, geheimer Clientschlüssel und mehr.

Gehen Sie dazu zu https://console.adobe.io/projects. Dann sehen Sie das.

Stackchat

Gehen Sie in der oberen Navigation zu Projekten . Suchen Sie nach dem Projekt, das den Namen Platform API ldap erhalten soll, und öffnen Sie es dann.

Stackchat

Nach dem Öffnen des Projektes haben Sie eine ähnliche Ansicht. Klicken Sie auf Dienstkonto (JWT) , um die Anmeldeinformationen Ihres Adobe I/O-Projekts Ansicht.

Stackchat

Dann sehen Sie das. Lassen Sie diesen Bildschirm in den nächsten 2 Schritten geöffnet, da Sie diese Anmeldedaten beim Einrichten der Integration in der Benutzeroberfläche von Stackchat Studio eingeben müssen.

Stackchat

20.5.2 Ihre Adobe-IO-Berechtigungen in Stackchat Hinzufügen

Klicken Sie in Stackchat Studio in Ihrem Bot-Menü auf Integrationen , dann Hinzufügen Integration oben rechts und

Stackchat Adobe Experience Platform-Integration

Wählen Sie anschließend im modalen Fenster Adobe Experience Platform aus:

Stackchat Adobe Experience Platform-Integration

Sie sehen jetzt den leeren Adobe Experience Platform-Integrationsbildschirm.

Stackchat Adobe Experience Platform-Integration

Sie müssen jetzt Werte für alle Felder auf der Registerkarte "Authentifizierung"eingeben.

Felder für JWT-Dienstkonten

Die Felder Client-ID, geheimer Clientschlüssel, technische Konto-ID und IMS-Organisations-ID können durch Kopieren/Einfügen der Werte des JWT-Dienstkontos auf dieser Seite ausgefüllt werden:

Stackchat

Nachdem Sie diese Werte ausgefüllt haben, sollten Sie jetzt Folgendes haben:

Stackchat

Privater Schlüssel

Das Feld " Privater Schlüssel "muss den gesamten Inhalt der Datei " private.key "enthalten, die Sie im Rahmen der Einrichtung Ihres Adobe I/O-Projekts erstellt haben. Öffnen Sie private.key in einem Texteditor und kopieren Sie den gesamten Inhalt in die Eingabe für den privaten Schlüssel.

Stackchat

Nach dem Einfügen von "private.key"in Stackchat Studio sollten Sie nun Folgendes haben:

Stackchat

Verbindungs-ID

Die Verbindungs-ID ist der letzte Teil der DCS Inlet-ID, die bereits in Ihrer Konfigurations-ID hiergespeichert ist. Um Ihnen den Klick zu speichern, lautet Ihre DCS-Inlet-ID wie folgt:

--dcsInletId--

In diesem Beispiel müssen Sie jetzt jedes Zeichen nach dem finalen / in der URL kopieren und den Wert in das Feld Verbindungs-ID in Stackchat Studio einfügen: 92b2eb1267c8fc7ee8b41a760a7d616714ca380b449d2d83e68adf692a0a28b1.

Klicken Sie anschließend auf Anmeldeinformationen​überprüfen.

Stackchat Adobe Experience Platform-Integration

HINWEIS

Wenn Sie den Fehler "Ungültige AEP-Anmeldeinformationen "erhalten, überprüfen Sie bei der Dublette, ob Sie alle Elemente korrekt kopiert/eingefügt haben.

20.5.3 Sandbox, Schemas und Datensätze konfigurieren

Stackchat sendet zwei Arten von Ereignissen an Adobe Experience Platform: ereignis zum Profil von Benutzern und Ereignis zur Interaktion mit Verhaltensweisen. Für jeden Ereignis-Typ ist ein in Adobe Experience Platform definiertes Schema und ein Dataset erforderlich. In diesem Schritt teilen Sie Stackchat mit, wohin Profil- und Interaktionsdaten in Ihrer Adobe Experience Platform-Sandbox gesendet werden sollen.

Wenn Ihre Anmeldedaten im vorherigen Schritt korrekt sind, werden Sie automatisch auf die Registerkarte Data Routing umgestellt. Klicken Sie auf Sandboxen abrufen.

Stackchat Adobe Experience Platform-Integration

Suchen Sie nach dem Abrufen der Sandboxen nach Ihrem Sandbox-Namen und wählen Sie ihn aus. Ihre zu verwendende Sandbox ist --aepSandboxId--. In diesem Beispiel heißt die Sandbox AEP-Aktivierung FY21.

Stackchat Adobe Experience Platform-Integration

Warten Sie einige Sekunden, während Ihre Schema und Datensätze geladen werden. Wählen Sie nach dem Laden der Benutzeroberfläche die folgenden Werte aus:

  • Profil-Schema: Demosystem - Profil-Schema für Stackchat-Chatbot (Global v1.1)
  • Ereignis-Schema: Demosystem - Ereignis-Schema für Stackchat-Chatbot (Global v1.1)
  • Profil-Datensatz: Demosystem - Profil DataSet für Stackchat Chatbot (Global v1.1)
  • Ereignis-Datensatz: Demosystem - Ereignis DataSet für Stackchat Chatbot (Global v1.1)

Klicken Sie nun auf Konfiguration speichern, damit Sie zum nächsten Schritt wechseln können.

Stackchat Adobe Experience Platform-Integration

20.5.4 Profil-Zuordnung

Auf dieser nächsten Registerkarte ordnen Sie Ihre Stackchat-Slots den Eigenschaften zu, die in Ihrem Adobe Experience Platform-Schema definiert sind. Sie sehen Folgendes:

Stackchat Adobe Experience Platform-Integration

Die erste Zuordnung, die durchgeführt werden muss, ist die erforderliche Zuordnung für die Stackchat-ID. Wählen Sie im Menü " Steckplatz auswählen"die Option Benutzer-ID.

Stackchat Adobe Experience Platform-Integration

Als Nächstes müssen Sie mehrere optionale Zuordnungen hinzufügen. Hier ist eine Tabelle, was zusätzlich zu kartieren ist:

Steckplatzname Schemazuordnung
ECID --aepTenantId--.identification.core.ecid
E-Mail --aepTenantId--.identification.core.email
FirstName person.name.firstName
NpsScore --aepTenantId--.customerSatisfactionScore.score
NpsFeedback --aepTenantId--.customerSatisfactionScore.feedback
NPSFeedbackText --aepTenantId--.customerSatisfactionScore.detailedFeedback

Klicken Sie für jede Zuordnung auf die Schaltfläche + , um eine neue Zuordnung hinzuzufügen.

Stackchat Adobe Experience Platform-Integration

Beginn: Zuordnen der Experience Cloud-ID des Benutzers Wählen Sie im Menü " Steckplatz auswählen"die Option "ECID".

Stackchat Adobe Experience Platform-Integration

Du machst das großartig! Wiederholen Sie diesen Vorgang jetzt für die folgenden Slots, die Sie in Übung 20.2.2erstellt haben. Alle Schemas sind mit den entsprechenden Eigenschaften ausgestattet.

Die endgültige Zuordnung sollte wie folgt aussehen:

Stackchat Adobe Experience Platform-Integration

Sobald diese alle zugeordnet sind, klicken Sie oben rechts auf "Zuordnung aktualisieren".

20.5.5 Ereignis-Zuordnung

In dieser Registerkarte ordnen Sie die Stackchat-Slots den verhaltensbasierten Ereignissen zu, die Stackchat an Adobe Experience Platform sendet. Das Schema, das Sie in Schritt 20.5.2 (Demo System - Ereignis Schema für Stackchat Chatbot (Global v1.1)) ausgewählt haben, hat eine --aepTenantId--.chatbotInteraction Mischung, die automatisch von Stackchat mit Informationen wie dem Konversationsfluss des Benutzers gefüllt wird oder wenn eine Cloud-Funktion ausgeführt wird. Ihre einzige Aufgabe besteht hier darin, die Identifizierungssteckplätze zuzuordnen, damit Adobe Experience Platform dieses Verhalten dem richtigen Benutzer zuordnen kann.

hinzufügen Sie die folgenden Zuordnungen auf der Registerkarte "Ereignis-Zuordnung".

Steckplatzname Schemazuordnung
Benutzer-ID --aepTenantId--.identification.core.stackchatId
ECID --aepTenantId--.identification.core.ecid
E-Mail --aepTenantId--.identification.core.email

Die endgültige Zuordnung sollte wie folgt aussehen:

Stackchat Adobe Experience Platform-Integration

Sobald diese alle zugeordnet sind, klicken Sie oben rechts auf "Zuordnung aktualisieren".

20.5.5 Ereignisse zur Ansicht von Produkten an Adobe Experience Platform senden

Es gibt Situationen, in denen Sie zusätzlich zu den von Stackchat automatisch gesendeten Profil- und Verhaltensweisen-Ereignissen Ereignis an Adobe Experience Platform senden möchten. In diesem Fall können Sie diese Sonderfall-Ereignis über eine Stackchat Cloud-Funktion an Adobe Experience Platform senden.

In diesem Abschnitt konfigurieren wir Ihren Luma Bot, um Adobe Experience Platform User Identified Ereignisses zu senden, wenn wir eine E-Mail-Adresse und Produkt-Ansicht -Ereignis erfassen, wenn der Benutzer auf die ❤️ Schaltfläche einer bestimmten Produktkarte klickt.

Stackchat Adobe Experience Platform-Integration

Die Schaltfläche "❤️"ist bereits als Postback-Schaltfläche konfiguriert. Das bedeutet, dass eine Cloud-Funktion aufgerufen wird, wenn der Benutzer darauf klickt. Die ❤️-Schaltfläche ist so konfiguriert, dass die BenachrichtigungsAEPOfProductView -Cloud-Funktion aufgerufen wird. Die Payload wird wie folgt übergeben:

{
  name: result.name,
  imageUrl: result.image1.url,
  price: result.finalPrice,
  sku: result.SKU,
  pageUrl: BASE_PRODUCT_URL + result.productUrl
}

Die Methode notificationAEPOfProductView wurde bereits zum Erstellen eines Adobe Experience Platform Product Ansicht Ereignisses aus dieser Payload eingerichtet. Sie muss jedoch die ID des Product Ansicht / User Identified Schemas aus Ihrer Adobe Experience Platform-Sandbox kennen.

Gehen Sie zurück zu Ihrer Visual Studio-Code-Umgebung und öffnen Sie die Datei _constants.ts.

VSC

Sie müssen jetzt die folgenden drei Codezeilen aktualisieren:

export const CUSTOM_EVENT_SCHEMA_ID = 'XXXX';   // For "product viewed" and "user identified" events
...
export const CUSTOM_EVENT_DATASET_ID = 'XXXX';
export const CUSTOM_EVENT_ORCHESTRATION_EVENT_ID = 'XXXX';

CUSTOM_EREIGNIS_SCHEMA_ID

Sie können die ID "CUSTOM_EREIGNIS_SCHEMA_ID"abrufen, indem Sie die Adobe Experience Platform-Benutzeroberfläche öffnen, die Seite " Schema "aufrufen und nach dem Schema " Demo System - Ereignis"für Stackchat Chatbot (Global v1.1) suchen und auf klicken, um das Schema zu öffnen.

VSC

Um die Schema-ID abzurufen, kopieren Sie sie aus der URL - es ist die lange Zahl am Ende der Abfrage-Zeichenfolge, z. B. fa8b21f33509e8ab9d5139b53652b61ec2b18dcea138888888888888. 411.

VSC

Kopieren Sie die Schema-ID und fügen Sie sie in dieses Feld in der Datei _constants.ts ein:

export const CUSTOM_EVENT_SCHEMA_ID = 'fa8b21f33509e8ab9d5139b53652b61ec2b18dcea1388411';

Ihre Datei _constants.ts sollte nun wie folgt aussehen:

VSC

CUSTOM_EREIGNIS_DATASET_ID

Jetzt machen wir das Gleiche für den Datensatz. Rufen Sie die Adobe Experience Platform-Benutzeroberfläche auf, öffnen Sie die Seite Datasets , suchen Sie nach Demo System - Ereignis DataSet for Stackchat Chatbot (Global v1.1) und klicken Sie auf das Ergebnis des Datasets.

Kopieren Sie die DataSet-ID aus der Beschriftung auf der rechten Seite und fügen Sie sie in dieses Feld in der Datei _constants.ts ein:

VSC

export const CUSTOM_EVENT_DATASET_ID = 'paste-your-value-here';

Ihre Datei _constants.ts sollte nun wie folgt aussehen:

VSC

CUSTOM_EREIGNIS_ORCHESTRATION_EREIGNIS_ID

Noch ein letzter Punkt: Ihre Journey Orchestrationen-ID aus dem vorherigen Schritt! In 20.4 Verwenden Sie Journey Orchestration, um eine E-Mail-Follow-up auszulösen, nachdem Sie mit Ihrem chatbot Sie Ihr eigenes Ereignis in der Journey Orchestration erstellt haben. Kopieren Sie die erstellte "orchestration eventID"und fügen Sie sie in dieses Feld in der Datei _constants.ts ein.

Die eventID der Orchestrierung finden Sie hier:

ACOP

In diesem Beispiel lautet die Orchestereignis-ID bacd25051c871367b0e2d5e4a1af292c6b716673faf85aad776de0e010e0d8. 8a

export const CUSTOM_EVENT_ORCHESTRATION_EVENT_ID = 'XXXX';

Ihre Datei _constants.ts sollte nun wie folgt aussehen. Speichern Sie Ihre Änderungen in file _constants.ts

VSC

Du bist alle fertig! Jetzt müssen wir einfach Ihren Code kompilieren und Ihre Cloud-Funktionen in Stackchat Studio aktualisieren.

Öffnen Sie zunächst ein Terminal (Ansicht -> Terminal).

vs_terminal-open

Dadurch wird ein Bedienfeld am unteren Rand des VS-Code-Fensters geöffnet.

HINWEIS

Vergewissern Sie sich, dass Sie im richtigen Verzeichnis arbeiten. Für die folgenden Schritte müssen wir im Ordner /cloud-function arbeiten. Zur Bestätigung dieses Typs pwd (Druckarbeitsverzeichnis) im Terminal und drücken Sie die Eingabetaste. Wenn der gedruckte Pfad mit /cloud-Funktionen endet, werden Sie alle eingestellt, wenn nicht versuchen, cd-Cloud-Funktionen auszuführen, um den richtigen Ordner festzulegen. Nun, wieder ausführen pwd, sollten Sie sehen, der Pfad Ende mit /cloud-Funktionen.

Erstellen Sie Ihre Cloud-Funktionen, indem Sie den folgenden Befehl im Terminal ausführen: npm starten build und drücken Sie die Eingabetaste.

vs_terminal-open

Dadurch wird ein Ordner namens ./dist , die eine einzelne Datei namens cloud-function.js enthalten wird.

vs-dist-cloud-function

Öffnen Sie die Datei cloud-features.js, kopieren Sie alles und fügen Sie sie in Ihren Cloud-Funktionseditor in Stackchat Studio ein, ersetzen Sie den aktuellen Code und klicken Sie auf die Schaltfläche Speichern .

ui_cloud-features-updated

Gute Arbeit, du bist fast da! Klicken Sie auf die Schaltfläche Veröffentlichen am unteren Rand der Navigation auf der linken Seite und geben Sie eine nostalgische Melodie ein, während Sie warten, bis Ihr Luma Bot veröffentlicht wird.

Stackchat Adobe Experience Platform-Integration

Nachdem der Bot die Veröffentlichung abgeschlossen hat, öffnen Sie das Chat-Widget und senden Sie die Nachricht /das Zurücksetzen , um Ihre Chat-Sitzung und Ihren Beginn zu löschen.

demo

Dann sehen Sie das. Geben Sie Ihren Namen ein und klicken Sie auf Senden.

demo

Wählen Sie als Nächstes das Menüelement Ich benötige Ideen .

demo

Dann sehen Sie das. Klicken Sie auf Ja.

demo

Geben Sie als Nächstes Ihre E-Mail-Adresse ein.

demo

Bestätigen Sie Ihre E-Mail-Adresse, indem Sie auf Ja klicken.

demo

Dann sehen Sie, dass Luma-Produkte im Chatbot angezeigt werden.

demo

Klicken Sie anschließend auf die Schaltfläche ❤️ für einige Produkte, um die angezeigten Ereignis zu generieren und Ihre Reise in die Journey Orchestration zu starten.

Einige Sekunden später sollten Sie eine E-Mail von Adobe Experience Platform und Journey Orchestration mit einer Promotion für den Artikel erhalten, den Sie gerade mögen.

demo

HINWEIS

Sie werden bemerken, dass, wenn Sie jetzt wiederholen, dass ich Ideen Fluss, wird Luma Bot erinnern, die Produkte, die Sie zuvor gemocht und zeigen sie als Empfehlung. Dies geschieht, indem die vom Benutzer angezeigten Ereignis aus Adobe Experience Platform abgerufen werden.

Die nächste Frage im Chatbot ist, ob es Ihnen etwas ausmacht, Feedback zu Ihrem Chat-Erlebnis zu geben. Klicken Sie auf Sicher.

demo

Treffen Sie Ihre Wahl, in diesem Fall ist die Wahl groß.

demo

Klicken Sie auf Herzlichen Glückwunsch!

demo

Geben Sie Ihr zusätzliches Feedback ein und klicken Sie auf Senden.

demo

Überprüfen wir jetzt die Datenerfassung im Adobe Experience Platform Echtzeit-Profil.

Wechseln Sie zu https://platform.adobe.com und navigieren Sie zum Profil. Click the + Browse button. Dann sehen Sie Folgendes:

demo

Wählen Sie den Identitäts-Namensraum - E-Mail und geben Sie die E-Mail-Adresse ein, die Sie im Stackchat-Chat-Gespräch eingegeben haben. Klicken Sie auf Ansicht und dann auf die Profil-ID Ihres Profils.

demo

Daraufhin erhalten Sie einen Überblick über Ihr Profil in Adobe Experience Platform. Wechseln Sie zu Attribute.

demo

In Attributen sehen Sie Dinge wie Ihr NPS-Ergebnis und detailliertes Feedback. Geh zu Ereignissen!

demo

In Ereignissen sehen Sie alle Interaktionen, die stattgefunden haben. Wenn Sie auf die Schaltfläche Ansicht JSON klicken, können Sie noch mehr Details sehen, wie in diesem Fall, alle Details rund um das Produkt Ansicht Ereignis auf der Nadia Elements Shell.

demo

Wenn Sie Ihre E-Mail erhalten haben und Ihr Profil in Adobe Experience Platform visualisieren konnten, funktioniert Ihre Integration mit Stackchat jetzt einwandfrei und Sie können mit der nächsten Übung fortfahren.

Nächster Schritt: 20.6 Testen Sie Ihren Chat auf der Demo-Website

Zurück zu Modul 20

Zurück zu allen Modulen

Auf dieser Seite