Welchen Plan habe ich?

Bei allen Chat-Plänen verfügbar

Wenn Sie das Web Widget (Classic) in Ihrem Chat-Konto verwenden, können Sie es so konfigurieren, dass Besucher bei jedem Seitenaufruf anhand der JavaScript-API und des JWT-Tokens authentifiziert werden.

Dieser Beitrag ist für Kunden mit den folgenden Versionen von Live-Chat vorgesehen:

  • Zendesk Chat Phase 4 – nur Zendesk Chat oder mit Zendesk Support
  • Zendesk Chat Phase 3 – mit dem integrierten Chat-Erlebnis im Web Widget (Classic)

Wenn Sie Zendesk Chat Phase 3 (nur Chat) verwenden, lesen Sie den Beitrag Aktivieren authentifizierter Besucher im Chat-Widget.

Wie Sie feststellen können, mit welcher Version von Chat Sie arbeiten, erfahren Sie unter Bestimmen der verwendeten Version von Zendesk Chat.

Dieser Beitrag enthält die folgenden Themen:

  • Übersicht
  • Generieren eines Shared Secret für Chat
  • Erstellen eines JWT-Tokens
  • Codebeispiele
  • Abmelden
  • Agentenerlebnis bei authentifizierten Besuchern
  • Web Widget (Classic)-Erlebnis für authentifizierte Besucher

Übersicht

Sie können das Widget so konfigurieren, dass Besucher jedes Mal, wenn eine Seite geladen wird, anhand eines neuen JavaScript-API- und JWT-Tokens authentifiziert werden.

Wenn Sie das Web Widget (Classic) so konfigurieren, dass Besucher authentifiziert werden, ergeben sich die folgenden Vorteile:

  • Sie können sicher sein, dass der Besucher bzw. Kunde, mit dem Sie oder Ihre Agenten kommunizieren, die richtige Identität hat.
  • Domänenübergreifender Verkehr wird unterstützt. Wenn Sie das Widget auf mehreren Domänen einbetten oder einen extern gehosteten Dienst verlinken (beispielsweise Shopify), „entsteht“ durch Authentifizierung des Besuchers ein einziger Besucher auf allen Domänen. Dadurch erhalten Ihre Agenten mehr Kontextinformationen.
  • Geräte-/browserübergreifende Identifizierung wird unterstützt. Bei Angabe der benutzerspezifischen ID im Authentifizierungsaufruf wird der Besucher als ein und dieselbe Person betrachtet, auch wenn er das Gerät oder den Browser wechselt.
  • Im Widget können frühere Chatkonverstationen des Besuchers angezeigt werden.

Generieren eines Shared Secret für Chat

Hinweis: Dieses Shared Secret unterscheidet sich vom Shared Secret in den Web Widget (Classic)-Einstellungen für beschränkte Help-Center-Inhalte.

So generieren Sie ein Shared Secret:

  1. Gehen Sie im Chat-Dashboard zu Einstellungen > Widget > Registerkarte „Widgetsicherheit“.
  2. Klicken Sie unter dem Abschnitt „Besucherauthentifizierung“ auf die Schaltfläche Generieren:

 

Beim Shared Secret handelt es sich um eine Sicherheitseinstellung. Das Secret muss generiert, kopiert und in der gleichen Sitzung in eine Nachricht an das Engineering-Team oder direkt in den Code eingefügt werden. Es darf nicht in den Browser eingegeben werden:

Hinweis: Es ist wichtig, dass die Sicherheit des Shared Secret jederzeit gewährleistet ist. Deshalb erscheint es nur einmal in ganzer Länge. Wenn Sie keinen Zugriff auf das Shared Secret haben und die komplette Zeichenfolge brauchen, um ein Token zu erstellen, klicken Sie auf Neu generieren.

Beim Neugenerieren des Shared Secrets wird das vorherige Token außer Kraft gesetzt. Wenn Verdacht besteht, dass das Shared Secret nicht mehr sicher ist, sollten Sie ein neues generieren. Wenn ein Schlüsselwechsel erforderlich ist, sollten Sie ihn durchführen lassen, wenn Chat ohnehin schon offline ist, denn beim Neugenerieren des Shared Secret wird die Verbindung zum Widget 5 Minuten lang unterbrochen.

Nachdem Sie das Shared Secret generiert haben, erstellen Sie ein JWT-Token (weitere Informationen zu JWT), das Sie dann zum Web-Widget-Snippet hinzufügen.

Erstellen eines JWT-Tokens

So erstellen Sie ein JWT-Token und fügen den Code zum Snippet für das eigenständige Widget hinzu

  1. Erstellen Sie eine serverseitige Payload für das JWT-Token. Sie muss folgende Informationen enthalten:
    • name: Name des Benutzers.
    • email: E-Mail-Adresse des Benutzers.
    • external_id: eindeutige alphanumerische Zeichenfolge zur Identifizierung des Kunden. Nach der Einrichtung kann dieser Wert nicht geändert werden. Wir empfehlen, für dieses Feld die eindeutige Benutzer-ID des Systems zu verwenden, z. B. user-123456.
    • iat: ganzzahliger Wert für den aktuellen Zeitstempel in Sekunden. Manche Funktionen in bestimmten Sprachen, wie z. B. Date.now() in JavaScript, geben Millisekunden zurück; vergessen Sie nicht, Millisekunden in Sekunden umzurechnen. Bei der Chat-Authentifizierung lässt der Wert „iat“ eine Uhrzeittoleranz von bis zu zwei Minuten zu.
    • exp: ganzzahliger Wert für den aktuellen Zeitstempel in Sekunden. Dieser Wert gibt an, wie lange dieses JWT-Token gültig ist. Der Wert „exp“ kann maximal 7 Minuten länger sein als der Wert „iat“.
  2. In den Codebeispielen unten finden Sie Vorlagen für die gängigsten Sprachen.
  3. Verwenden Sie die JavaScript-API „zESetting“ mit dem Schlüssel „webWidget.authentication.chat.jwtFn“, um eine Funktion bereitzustellen, die bei jedem Aufruf ein neues JWT-Token liefert. Codebeispiel: 
    window.zESettings = {
 webWidget: {
   authenticate: {
     chat: {
       jwtFn: function(callback) { 
         fetch('JWT_TOKEN_ENDPOINT').then(function(res) {
            res.text(jwt).then(function(jwt) {
             callback(jwt);
            });
          });
        }
      } 
    }
  }
};
    Im Beispiel oben ist JWT_TOKEN_ENDPOINT ein Endpunkt, der auf Ihrem eigenen Server implementiert werden kann, um ein neues JWT-Token anzufordern. Hinweis: „jwtFn“ kann bei einer Chatsitzung mehrmals aufgerufen werden, um ein neues JWT-Token anzufordern und die Identität des Besuchers über die Sitzungsdauer hinweg zu validieren.
    Hinweis: „jwtFn“ kann bei einer Chatsitzung mehrmals aufgerufen werden, um ein neues JWT-Token anzufordern und die Identität des Besuchers über die Sitzungsdauer hinweg zu validieren.

Codebeispiele

Das Token muss beim Laden der Webseite auf Serverseite dynamisch generiert werden. Machen Sie unten die Vorlage für die verwendete Sprache ausfindig. Passen Sie die Vorlage entsprechend an, indem Sie #{Details} durch Ihre eigenen Informationen ersetzen.

Wenn Ihnen die folgenden Vorlagen nicht weiterhelfen, werfen Sie einen Blick auf die JWT-Bibliotheken.

  • Ruby
  • NodeJS
  • Python
  • PHP
  • Elixir

Ruby

Installieren Sie zuerst ruby-jwt.

Wenn Sie Rubygems verwenden:

gem install jwt

Wenn Sie Bundler verwenden, fügen Sie Folgendes zu Ihrer gem-Datei hinzu:

gem 'jwt'

Generieren Sie dann ein Token anhand des Shared Secret:

require 'jwt'
payload = {
  :name => "#{customerName}",
  :email => "#{customerEmail}",
  :iat => timestamp,
  :external_id => "#{externalId}"
}
token = JWT.encode payload, "#{yourSecret}"

NodeJS

Installieren Sie jsonwebtoken:

npm install jsonwebtoken --save-dev

Generieren Sie dann ein Token anhand des Shared Secret:

var jwt = require('jsonwebtoken'); 
var payload = {
  name: '#{customerName}',
  email: '#{customerEmail}',
  iat: #{timestamp},
  external_id: '#{externalId}'
};
var token = jwt.sign(payload, '#{yourSecret}');

Python

Installieren Sie python-jose:

pip install python-jose

Generieren Sie dann ein Token anhand des Shared Secret:

from jose import jwt
var payload = {
  'name': '#{customerName}',
  'email': '#{customerEmail}',
  'iat': #{timestamp}, 
  'external_id': '#{externalId}'
}
token = jwt.encode(payload, '#{yourSecret}'

PHP

Laden Sie PHP-JWT herunter:

composer require firebase/php-jwt

Generieren Sie dann ein Token anhand des Shared Secret:

use \Firebase\JWT\JWT;
$payload = {
  'name' => '#{customerName}' ,
  'email' => '#{customerEmail}',
  'iat' => #{timestamp},
  'external_id' => '#{externalId}'
};
$token = JWT::encode($payload, '#{yourSecret}');

Elixir

Fügen Sie „json_web_token_ex“ zur Datei „mix.exs“ hinzu:

defp deps do
  [{:json_web_token, "~> 0.2"}]
end

Generieren Sie dann ein Token anhand des Shared Secret:

data = %{
  name: "#{customerName}",
  email: "#{customerEmail}",
  iat: "#{timestamp}",
  external_id: "#{externalId}"
}
options = %{ key: "#{yourSecret}" }
jwt = JsonWebToken.sign data, options

Abmelden

Zum Abmelden des authentifizierten Besuchers müssen Sie die JavaScript-API „zE.logout“ verwenden. Weitere Informationen zu dieser API finden Sie hier.

Agentenerlebnis bei authentifizierten Besuchern

Wenn ein Agent mit einem authentifizierten Besucher chattet, werden im Chat-Dashboard einige Elemente aktualisiert.

Am grünen Häkchen im Avatar des Besuchers ist zu erkennen, dass es sich um einen authentifizierten Besucher handelt:

Der Name und die E-Mail-Adresse des Besuchers können nicht bearbeitet werden, da sie Teil der Informationen sind, die über die JavaScript-API übermittelt werden.

Wenn ein authentifizierter Besucher gesperrt wird, kann er von keinem Gerät und keinem Browser aus auf das Chat-Widget zugreifen.

Web Widget (Classic)-Erlebnis für authentifizierte Besucher

Für authentifizierte Besucher ist das Benutzererlebnis im Chat-Widget etwas anders. Die Informationen des Besuchers sind schreibgeschützt und können von ihm weder über das Widget noch über die JavaScript-APIs geändert werden.

Laufende Chatsitzungen werden bei der Authentifizierung des Besuchers geräteübergreifend synchronisiert, damit der Besucher den Computer bzw. Browser wechseln kann, ohne eine andere Chatsitzung starten zu müssen.

Authentifizierte Besucher haben nicht die Möglichkeit, in einem Popout-Fenster zu chatten. Bei Popouts gibt es keine Möglichkeit, die Identität zu bestätigen, da die Chat Experience auf unserer Domäne zopim.com gehostet wird.

Authentifizierte Besucher können im Widget frühere Konversationen sehen. Sie brauchen nur im Chatprotokoll nach oben zu blättern. Weitere Informationen zum Konversationsverlauf für authentifizierte Besucher finden Sie hier.

Powered by Zendesk