Für MailMergic verwenden wir tawk.to für unseren Live-Chat. Mit diesem Widget können unsere Nutzer uns direkt aus unserer Anwendung heraus Nachrichten schicken.
Bei der vorherigen Implementierung hatten wir das Problem, dass uns alle Benutzer im Support-Dashboard in Form von V812368123891237 (oder ähnlich) angezeigt wurden. In dieser anonymisierten Form war es schwierig, die Benutzeranfragen den angemeldeten Benutzern in unserer Anwendung zuzuordnen.
Um unseren Kundensupport zu verbessern, standen wir vor der Herausforderung, benutzerdefinierte Attribute (wie z.B. E-Mail, Vor- und Nachname) von unseren eingeloggten Benutzern an die tawk.to API zu senden.
Wir waren etwas überrascht, dass es dazu keine Dokumentation gibt, obwohl React eines der beliebtesten JavaScript-Frameworks ist und tawk.to auch ein beliebtes Chat-Widget ist.
Im Folgenden zeigen wir Ihnen unsere Implementierung in React.
Zunächst erstellen wir ein Modul, das die tawk.to API aufruft und unsere benutzerdefinierten Attribute während des onLoad-Prozesses übergibt (in unserem Beispiel E-Mail, Vorname und Nachname). Wir haben das Modul in das Verzeichnis src/util/tawkto.js eingefügt.
Anschließend importieren wir dieses Modul in unser AppRouter.js-Modul und verwenden den useEffect-Hook, um unser tawk.to-Modul aufzurufen:
Stellen Sie sicher, dass Sie das Widget in Ihren App-Stamm laden, damit es auf allen Seiten angezeigt wird.
Sehen Sie sich den vollständigen Code auf Github an.
