Angemeldete Benutzer im Messenger Notiondesk identifizieren

Notiondesk Messenger kann Benutzer identifizieren, die in Ihrer Anwendung angemeldet sind.

Zur Identifizierung wird ein kurzlebiges Benutzertoken verwendet, das von Ihrem Backend generiert wird. Ihr Frontend übergibt dieses Token an das Messenger SDK (Notiondesk), wenn Messenger initialisiert wird.

Dadurch wird verhindert, dass sensible Authentifizierungsdaten im Browsercode offengelegt werden.

Bevor Sie beginnen

Sie benötigen:

• Notiondesk Messenger wurde mit dem @notiondesk-so/messenger-js-sdk Paket installiert

• Die Authentifizierung ist in Ihrer Anwendung bereits implementiert.

• Ein Backend, das ein Notiondesk Benutzertoken generieren kann.

• Ihr Notiondesk App-Geheimnis

Geben Sie Ihr Notiondesk App-Geheimnis niemals in Frontend-JavaScript, React-Komponenten, an den Browser ausgelieferten Umgebungsvariablen oder öffentlichen Repositories preis.

Wie die Benutzeridentifizierung funktioniert

Der Authentifizierungsablauf ist wie folgt:

1. Ein Benutzer meldet sich in Ihrer Anwendung an

2. Ihr Frontend fordert ein Notiondesk Benutzertoken von Ihrem Backend an.

3. Ihr Backend signiert ein kurzlebiges Token für diesen authentifizierten Benutzer.

4. Ihr Backend sendet das signierte Token an den Browser zurück.

5. Ihre Website oder Anwendung übergibt das Token an Notiondesk Messenger

6. Messenger erkennt den Besucher als den entsprechenden Benutzer.

Ihr Backend sollte die Identität des Benutzers anhand der authentifizierten Anwendungssitzung ermitteln. Vertrauen Sie keiner Benutzer-ID, die direkt vom Browser übermittelt wird.

Schritt 1: Erstellen Sie ein App-Geheimnis

Gehen Sie zu Einstellungen → Zugriff in Notiondesk und erstellen Sie ein App-Geheimnis.

Speichern Sie das Geheimnis in einer serverseitigen Umgebungsvariablen, zum Beispiel:

NOTIONDESK_APP_SECRET

Das App-Geheimnis wird nur einmal bei der Erstellung angezeigt. Kopieren Sie es und bewahren Sie es sicher auf, sobald es erscheint.

Sie können Ihre App-Geheimnisse unter Einstellungen → Zugriff verwalten und rotieren.

Fügen Sie das App-Geheimnis niemals hinzu zu:

• Frontend-JavaScript

• React- oder Vue-Clientkomponenten

• Variablen des öffentlichen Umfelds

• Browser-Bundles

• Öffentliche Repositorien

Schritt 2: Signieren Sie ein Benutzertoken auf Ihrem Backend

Generieren Sie das Benutzertoken von Ihrem Backend, nachdem Ihre Anwendung den aktuellen Benutzer authentifiziert hat.

Notiondesk-Benutzertoken verwenden HS256 und müssen folgende Ansprüche enthalten:

Verwenden Sie user_id als Benutzerkennung. Verwenden Sie nicht sub anstelle von user_id.

Sie können auch Benutzerinformationen angeben, wie zum Beispiel:

• email

• name

Tokens sollten nur kurzlebig sein und ausschließlich auf dem eigenen Server generiert werden.

Notiondesk stellt in Ihrer Messenger-Konfiguration sprachspezifische Signaturbeispiele für Sprachen wie Node.js, Python, PHP und Ruby bereit. Verwenden Sie das Beispiel in Ihrem Notiondesk-Dashboard, anstatt Token im Browsercode zu signieren.

Schritt 3: Übergeben Sie das Token an Messenger

Sobald Ihr Backend das Token generiert hat, übergeben Sie es an Ihre Messenger-Installation.

Standard-Website-Installation

Wenn Sie Messenger mithilfe des Standard-Skripts installiert haben, geben Sie das signierte Token mit data-user-token an:

Ersetzen:

<script
  async
  src="https://static.notiondesk.help/messenger/widget.js"
  data-messenger-id="YOUR_MESSENGER_ID"
  data-user-token="YOUR_SIGNED_TOKEN">
</script>

• YOUR_MESSENGER_ID mit Ihrer Messenger-ID

• YOUR_SIGNED_TOKEN mit dem Token, das von Ihrem Backend für den aktuellen Benutzer generiert wurde

Das Benutzertoken darf nicht fest in eine statische Website-Vorlage einprogrammiert werden. Das Token sollte für den aktuell authentifizierten Benutzer generiert werden.

JavaScript / TypeScript SDK

Rufen Sie das signierte Token von Ihrem Backend ab und übergeben Sie es an initNotiondesk:

Der Endpunkt /api/notiondesk-token ist ein Beispiel. Verwenden Sie die Backend-Route, die zu Ihrer Anwendung passt.

React und Next.js

Übergeben Sie das signierte Token an NotiondeskProvider:

Das Token kann nach der Authentifizierung des Benutzers von Ihrem Backend abgerufen werden.

Das App-Geheimnis Notiondesk darf der Clientkomponente niemals zugänglich sein.

Schritt 4: Token validieren

Bevor Sie live gehen, verwenden Sie das Token-Validierungstool, das in Ihrer Notiondesk Messenger-Konfiguration verfügbar ist.

Fügen Sie ein Token ein, das Ihr Backend soeben generiert hat.

Notiondesk prüft das Token anhand Ihrer aktiven App-Geheimnisse und zeigt die Benutzerinformationen an, die Messenger daraus lesen kann.

Das zur Validierung verwendete Token wird geprüft, aber nicht gespeichert.

Die Validierung ist nützlich, um Folgendes zu erkennen:

import { initNotiondesk } from "@notiondesk-so/messenger-js-sdk";

const userToken = await fetch("/api/notiondesk-token").then((response) =>
  response.ok ? response.text() : null,
);

const notiondesk = await initNotiondesk({
  messengerId: "YOUR_MESSENGER_ID",
  userToken,
});

<NotiondeskProvider
  messengerId="YOUR_MESSENGER_ID"
  userToken={userToken}
>
  {children}
</NotiondeskProvider>

• Fehlende erforderliche Ansprüche

• Ein fehlerhafter user_id

• Ein fehlerhafter site_uuid

• Abgelaufene Token

• Tokens, die mit dem falschen Geheimnis signiert wurden

• Ungültige Signaturen

Benutzertoken aktualisieren

Benutzer-Tokens sollten nur kurzlebig sein.

Wenn Ihre Anwendung ein aktualisiertes Token empfängt, während Messenger bereits initialisiert ist, aktualisieren Sie die Messenger-Konfiguration:

Sie müssen keine weitere Messenger-Instanz erstellen, nur um das Benutzertoken zu aktualisieren.

Abmeldung behandeln

Der identifizierte Benutzer wird gelöscht, wenn sich jemand von Ihrer Anwendung abmeldet.

Sie können das aktuelle Token entfernen:

Oder die Messenger-Instanz vollständig zerstören:

Stellen Sie sicher, dass die Identität des vorherigen Benutzers gelöscht wird, bevor ein anderer Benutzer eine Sitzung im selben Browser startet.

Messenger nur für authentifizierte Benutzer laden

Die Identifizierung eines Nutzers und die Entscheidung, ob Messenger verfügbar sein soll, sind unterschiedliche Angelegenheiten.

Wenn Messenger nur für angemeldete Benutzer geladen werden soll, muss diese Berechtigungsprüfung innerhalb Ihrer Anwendung erfolgen.

Zum Beispiel mit React:

Die anonyme Nutzung von Messenger kann aktiviert bleiben, wenn Ihr Supportangebot sowohl Besuchern als auch angemeldeten Kunden zur Verfügung stehen soll.

Best Practices für Sicherheit

Bei der Identifizierung von Benutzern in Notiondesk Messenger:

notiondesk.updateConfig({
  userToken: refreshedUserToken,
});

notiondesk.updateConfig({
  userToken: null,
});

notiondesk.destroy();

<NotiondeskProvider
  messengerId="YOUR_MESSENGER_ID"
  enabled={currentUser.isAuthenticated}
  userToken={userToken}
>
  {children}
</NotiondeskProvider>

• Bewahren Sie Ihr App-Geheimnis auf dem Server auf.

• Signieren Sie Tokens nur auf Ihrem Backend.

• Verwenden Sie HS256

• Fügen Sie alle erforderlichen Ansprüche hinzu.

• Ermitteln Sie user_id aus Ihrer authentifizierten serverseitigen Sitzung.

• Tokens sollten nur eine kurze Lebensdauer haben.

• Benutzer-Tokens niemals fest im Frontend-Code kodieren.

• Token bei Bedarf aktualisieren

• Das aktuelle Token wird beim Abmelden eines Benutzers gelöscht.

• Ändern Sie Ihr App-Geheimnis, wenn Sie glauben, dass es offengelegt wurde.

Fehlerbehebung

notiondesk.updateConfig({
  userToken: null,
});