Integriere Mellowtel in deine Electron-App

​

Voraussetzungen

• Ein Mellowtel-Konto und ein Konfigurationsschlüssel (erhalte deinen im Dashboard).
• Eine Electron-Anwendung mit Zugriff auf den Hauptprozess.

​

Installation

​

1. Konfiguriere npm-Authentifizierung

@mellowtel-inc:registry=https://npm.pkg.github.com/
//npm.pkg.github.com/:_authToken=YOUR_NPM_TOKEN

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

​

2. Installiere das Paket

npm install @mellowtel-inc/mellowtel-electron

​

3. Füge es deinem Code hinzu

import { app, BrowserWindow } from 'electron';
import Mellowtel from '@mellowtel-inc/mellowtel-electron';


// Wenn die App bereit ist, erstelle das Fenster
app.whenReady().then(async () => {
  let win = createWindow();
  
  const mellowtel: Mellowtel = new Mellowtel('YOUR_CONFIGURATION_KEY');

  await mellowtel.requestConsent(win, "Erhalte 3 Monate kostenlos")
  await mellowtel.init()
});

• new Mellowtel(configurationKey, options?) instanziiert das SDK. Die einzige heute verfügbare Option ist disableLogs, die standardmäßig auf true gesetzt ist. Setze sie auf false, während du integrierst, damit du den Verbindungsstatus und die Anforderungsaktivität in deinem Terminal sehen kannst.
• requestConsent(window, incentive) rendert eine native Electron-Nachricht verankert an das übergebene BrowserWindow. Das zweite Argument ist die prominente Überschrift des Dialogs (zum Beispiel, "Erhalte 3 Monate kostenlos"), die über einer festen Erklärung dessen, was Mellowtel tut, angezeigt wird. Es wird true zurückgegeben, wenn der Nutzer zustimmt, false, wenn der Nutzer ablehnt oder den Dialog schließt, und undefined, wenn die Zustimmung bereits vorliegt. Das SDK speichert die Opt-in-Entscheidung automatisch, sodass du danach nicht optIn() aufrufen musst.
• init() wirft nur, wenn configurationKey leer ist. Wenn der Nutzer nicht zugestimmt hat, wird es protokolliert und kehrt stillschweigend zurück. Andernfalls öffnet es eine WebSocket-Verbindung zum Backend von Mellowtel. Der Aufruf blockiert nicht die Renderer-UI, sodass Fenster während der Verbindungsherstellung reaktionsfähig bleiben.

​

Verhindern von Systemdialogunterbrechungen (empfohlen)

​

Nutzerzustimmung

1. Verwende den eingebauten nativen Dialog über requestConsent(window, incentive). Dies ist der schnellste Weg und wird im obigen Snippet gezeigt. Es rendert einen nativen Electron dialog.showMessageBox mit deinem Anreiztext als Überschrift und speichert die Entscheidung des Nutzers automatisch.
2. Baue deine eigene Zustimmungs-UI und steuere das SDK über optIn(), optOut() und getOptInStatus(). Verwende dies, wenn du benutzerdefinierte Markenbildung, reichhaltigere Erklärungen oder Lokalisierung über das hinaus, was der native Dialog bietet, möchtest.

​

Was dein Zustimmungsdialog enthalten muss

​

Erlaube Nutzern, ihre Zustimmung später zu ändern

​

Methodenreferenz

• init(): Promise<void> startet den Dienst, wenn der Nutzer zugestimmt hat, oder kehrt stillschweigend frühzeitig zurück, wenn nicht. Wirft nur, wenn der Konfigurationsschlüssel leer ist.
• requestConsent(window: BrowserWindow, incentive: string): Promise<boolean | undefined> zeigt den eingebauten nativen Zustimmungsdialog an und speichert das Ergebnis. Gibt true bei Zustimmung, false bei Ablehnung oder Schließen, undefined, wenn die Zustimmung bereits gegeben wurde, zurück.
• showConsentSettings(window: BrowserWindow): Promise<void> zeigt den eingebauten Zustimmungsverwaltungsdialog an. Das SDK handhabt die Opt-In / Opt-Out-Übergänge intern, wenn der Nutzer seine Wahl umschaltet.

• optIn(): Promise<void> kennzeichnet den Nutzer als zugestimmt, ohne einen Dialog anzuzeigen. Verwende dies nur, nachdem du die Zustimmung über deine eigene UI eingeholt hast.
• optOut(): Promise<void> kennzeichnet den Nutzer als abgelehnt und schließt die aktive WebSocket-Verbindung.
• getOptInStatus(): boolean | undefined gibt den aktuellen Opt-In-Status zurück, oder undefined, wenn der Nutzer noch keine Wahl getroffen hat.
• getNodeId(): string gibt die Mellowtel-Knotenkennung für diese Installation zurück. Nützlich beim Einreichen von Support-Tickets.

• getTotalRequestCount(): number gibt die Gesamtanzahl der seit der Installation verarbeiteten Anfragen zurück.
• getDailyRequestCount(): number gibt die Anzahl der heute verarbeiteten Anfragen zurück.
• getRequestCountForDate(date: string): number gibt die Anzahl für ein bestimmtes YYYY-MM-DD-Datum zurück.
• getDailyRequestsHistory(): { [date: string]: number } gibt jede tägliche Anzahl als Karte zurück.
• getRequestCountsInRange(startDate: string, endDate: string): { [date: string]: number } gibt die Anzahlen für einen Datumsbereich zurück.
• getRequestCounts(): { total: number; daily: number; dailyHistory: { [date: string]: number } } gibt alle drei Zähler in einem Aufruf zurück.

​

Herunterfahren und Lebenszyklus

​

Einwilligungsspeicherung

• macOS: ~/Library/Application Support/<YourAppName>/config.json
• Windows: %APPDATA%\<YourAppName>\config.json
• Linux: ~/.config/<YourAppName>/config.json

​

Fehlerbehebung