Welchen Plan habe ich?

Bei allen Chat-Plänen verfügbar

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.

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

  • Zendesk Chat Phase 3 – nur Zendesk Chat

Wenn Sie eine der folgenden Versionen verwenden, lesen Sie den Beitrag Aktivieren authentifizierter Besucher im Web Widget (Classic):

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

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
  • Agentenerlebnis bei authentifizierten Besuchern
  • Widget-Erlebnis für authentifizierte Besucher

Übersicht

Die Konfiguration des Chat-Widgets für die Authentifizierung von Besuchern hat folgende 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.

Generieren eines Shared Secret für Chat

Um das Widget für die Authentifizierung von Besuchern zu konfigurieren, brauchen Sie ein Shared Secret. Beim Shared Secret handelt es sich um eine Sicherheitseinstellung, die in ein und derselben Sitzung generiert, kopiert und in eine Nachricht an das Engineering-Team oder direkt in die Codebase eingefügt wird. Das Shared Secret darf nicht in einen Browser eingegeben werden.

Nur Chat-Administratoren können die Einstellungen für die Besucherauthentifizierung konfigurieren.

So generieren Sie ein Shared Secret für authentifizierte Besucher

  1. Gehen Sie im Chat-Dashboard zu Einstellungen > Widget.
  2. Klicken Sie auf die Registerkarte Widget-Sicherheit.
  3. Klicken Sie im Abschnitt „Besucherauthentifizierung“ auf die Schaltfläche Generieren.
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. Geben Sie HS256 als JWT-Algorithmus im Header der JWT-Payload an:
    {
  "typ":"JWT",
  "alg":"HS256"
}

    HS256 steht für HMAC SHA 256, einen 256-Bit-Verschlüsselungsalgorithmus der U.S. National Security Agency.

    Hinweis: Die JWT-Algorithmen RS256 und ES256 JWT werden von Zendesk nicht unterstützt.
  3. In den Codebeispielen unten finden Sie eine Vorlage für die gängigsten Sprachen.
  4. Verwenden Sie die JavaScript-API „$zopim.livechat.authenticate“, um eine Funktion bereitzustellen, die bei jedem Aufruf ein neues JWT-Token liefert. Codebeispiel:
    $zopim(function() {
  $zopim.livechat.authenticate({
    jwtFn: function(callback) {
      fetch('JWT_TOKEN_ENDPOINT').then(function(res) {
        res.text().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.
  5. Sie können die API „$zopim.livechat.clearAll()“ verwenden, um den Benutzer vom Widget abzumelden, wenn er sich von der Host-App bzw. Website abmeldet.

    Bei aus einer einzigen Seite bestehenden Apps ist es nicht möglich, den Besucher nach Verwendung von „$zopim.livechat.clearAll()“ erneut zu authentifizieren. Sie müssen die Seite neu laden, damit der Besucher erneut authentifiziert wird.

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

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.

Widget-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, Dadurch kann der Besucher den Computer bzw. Browser wechseln, ohne eine andere Chatsitzung starten zu müssen, wenn er zum Beispiel eine im Chat-Widget eines Desktop-Webbrowsers begonnene Konversation in einem mobilen Webbrowser fortsetzen möchte.

Hinweis: Da die aktuellen Mobile SDKs für Chat keine Besucherauthentifizierung unterstützen, können Besucher nicht ohne Unterbrechung einer laufenden Chat-Sitzung zwischen dem Desktop-Widget und einer mobilen App wechseln, die das Chat SDK verwendet.

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.

Powered by Zendesk