Tidio

offiziell

Verbinden Sie Tidio mit Ihrer Website über MCP

Auf tid.io ansehenDieses MCP ausprobierenGesponsert

Was kann man mit Tidio MCP machen?

  • Tidio mit einer Website verbinden — Bitte darum, Tidio über tidio_connect mit einer Website-URL zu verbinden. Dabei wird ein Browser für den OAuth-Login geöffnet und Ihr öffentlicher Schlüssel automatisch abgerufen.
  • Verbindungsstatus prüfen — Verwenden Sie dies, um zu überprüfen, ob Tidio verbunden ist, und um Ihren aktuellen Einbettungscode abzurufen.
  • Einbettungscode generieren — Rufen Sie dies mit einem öffentlichen Schlüssel auf, um gebrauchsfertiges JavaScript zu erstellen. Optional können Sie zwischen async- oder sync-Laden wählen.
  • Tidio trennen — Führen Sie dies aus, um lokal gespeicherte Anmeldedaten aus ~/.tidio-mcp/credentials.json zu löschen.

Dokumentation

Tidio MCP Connector

Ein MCP-Server (Model Context Protocol), der KI-Assistenten mit dem Tidio-Live-Chat verbindet – mit automatischer Einrichtung

Funktionen

  • Automatische Einrichtung: Verbinden Sie sich mit einem einzigen Befehl mit Tidio – kein manuelles Kopieren von Schlüsseln erforderlich
  • OAuth-Authentifizierung: Öffnet den Browser für eine sichere Tidio-Anmeldung und ruft automatisch Ihren öffentlichen Schlüssel ab
  • Anmeldedaten-Persistenz: Anmeldedaten werden lokal für zukünftige Sitzungen gespeichert
  • Einbettungscode-Generierung: Erhalten Sie gebrauchsfertigen JavaScript-Code für jede Website

Installation

npm install tidio-mcp-connector

Oder klonen und lokal erstellen:

git clone https://github.com/your-username/tidio-mcp-connector.git
cd tidio-mcp-connector
npm install
npm run build

Verwendung

Mit Claude Desktop

Fügen Sie dies zu Ihrer Claude-Desktop-Konfiguration hinzu (~/Library/Application Support/Claude/claude_desktop_config.json):

{
  "mcpServers": {
    "tidio": {
      "command": "npx",
      "args": ["tidio-mcp-connector"]
    }
  }
}

Mit Lovable

Dieser MCP-Connector funktioniert mit Lovable und ähnlichen KI-gestützten Entwicklungsplattformen. Fügen Sie ihn als benutzerdefinierten MCP-Server hinzu.

Mit MCP Inspector (Testen)

npx @modelcontextprotocol/inspector npx tidio-mcp-connector

Verfügbare Tools

tidio_connect (Empfohlen)

Stellt die Verbindung zu Tidio her und erhält automatisch Ihren öffentlichen Schlüssel.

So funktioniert es:

  1. Öffnet Ihren Browser auf der Tidio-Anmeldeseite
  2. Sie authentifizieren sich mit Ihrem Tidio-Konto
  3. Ihr öffentlicher Schlüssel und Einbettungscode werden automatisch zurückgegeben

Parameter:

  • site_url (erforderlich): Die Website-URL, auf der Tidio eingebettet werden soll

Beispiel:

Connect Tidio to https://mywebsite.com

tidio_status

Überprüft Ihren Verbindungsstatus und ruft Ihren Einbettungscode ab.

Parameter: Keine

tidio_disconnect

Löscht gespeicherte Anmeldedaten.

Parameter: Keine

generate_tidio_embed

Generiert Einbettungscode für einen bestimmten öffentlichen Schlüssel (falls Sie bereits einen haben).

Parameter:

  • public_key (erforderlich): Ihr Tidio-öffentlicher Schlüssel
  • loading_mode (optional): "async" (Standard) oder "sync"

So funktioniert es

  1. Benutzer ruft tidio_connect auf mit seiner Website-URL
  2. Browser öffnet sich auf der Tidio-Authentifizierungsseite
  3. Benutzer meldet sich an bei seinem Tidio-Konto
  4. Callback empfangen – der MCP-Server erhält das Refresh-Token
  5. API-Aufrufe durchgeführt – tauscht Token gegen Zugriffstoken aus und ruft dann den öffentlichen Schlüssel ab
  6. Anmeldedaten gespeichert unter ~/.tidio-mcp/credentials.json
  7. Einbettungscode zurückgegeben – bereit zum Hinzufügen zur Website

Speicherung der Anmeldedaten

Anmeldedaten werden lokal unter ~/.tidio-mcp/credentials.json gespeichert:

{
  "public_key": "abc123...",
  "access_token": "...",
  "refresh_token": "...",
  "site_url": "https://example.com",
  "created_at": "2024-01-01T00:00:00.000Z",
  "updated_at": "2024-01-01T00:00:00.000Z"
}

Einbettungscode-Ausgabe

Der Connector generiert optimierten asynchronen Ladecode:

<script type="text/javascript">
document.tidioChatCode = "YOUR_PUBLIC_KEY";
(function() {
  function asyncLoad() {
    var tidioScript = document.createElement("script");
    tidioScript.type = "text/javascript";
    tidioScript.async = true;
    tidioScript.src = "//code.tidio.co/YOUR_PUBLIC_KEY.js";
    document.body.appendChild(tidioScript);
  }
  if (window.attachEvent) {
    window.attachEvent("onload", asyncLoad);
  } else {
    window.addEventListener("load", asyncLoad, false);
  }
})();
</script>

Entwicklung

# Install dependencies
npm install

# Run in development mode
npm run dev

# Build for production
npm run build

# Run built version
npm start