Zum Hauptinhalt springen
Offenes JavaScript-SDK

Entwickeln Sie einen eigenen Chatbot mit unserem JavaScript-SDK

Mit @openstaticfish/chattybox gestalten Sie die Oberfläche, während ChattyBox Suche, Quellenangaben, Konversationen und Skalierung übernimmt. Der browsersichere API-Schlüssel identifiziert Ihr Projekt und lässt sich auf erlaubte Ursprünge beschränken.

Crawlt veröffentlichte DokumentseitenQuellenzitierte AntwortenEinbettung mit einem SkriptKeine Dokumentenmigration erforderlichKeine Kreditkarte erforderlichIhre Inhalte bleiben Ihre Inhalte
ChattyBox fragen
x
Wo sollte ich anfangen, wenn ich eine verlässliche Antwort von dieser Website brauche?
Fügen Sie zunächst Ihre öffentliche Website-URL zu ChattyBox hinzu. Es nutzt abgerufene indexierte Inhalte als Grundlage und kann Quellenlinks zur Prüfung anzeigen. Testen Sie Antworten und Fallbacks vor dem Start.
iQuellen3^
JavaScript-SDK Leitfaden
chattybox.ai
Analysen
chattybox.ai
Startseite
chattybox.ai
Eine Frage stellen...
Bereitgestellt von ChattyBox
Entwickelt für JavaScript- und TypeScript-Teams

Starten Sie einen quellenbelegten Chatbot, ohne Ihren Website-Stack neu aufzubauen

ChattyBox crawlt Ihre bestehende Website, Dokumentation, Ihr Help Center, CMS oder Ihre Wissensdatenbank und bettet anschließend einen Chatbot ein, der aus Ihren eigenen veröffentlichten Inhalten statt aus dem allgemeinen Modellgedächtnis antwortet.

Installieren Sie ein typisiertes ESM-Paket von npm mit Bun oder Ihrem bevorzugten Paketmanager.
Gestalten Sie Nachrichtendarstellung, Konversationsstatus, Quellenangaben und Interaktionen selbst.
Nutzen Sie dieselbe verwaltete Such- und Antwortinfrastruktur mit Quellenbezug wie das gehostete Widget.
Öffentliche Browserschlüssel funktionieren standardmäßig ursprungsübergreifend; exakte Origin-Beschränkungen sind optionale Absicherung, keine Authentifizierung.
1Workflow-Schritt

Erstellen Sie ein ChattyBox-Projekt, indexieren Sie Ihre Inhalte und testen Sie typische Fragen.

2Workflow-Schritt

Erstellen Sie einen öffentlichen Widget-API-Schlüssel; optional können Sie ihn auf Ihre Anwendungsursprünge beschränken.

3Workflow-Schritt

Installieren Sie @openstaticfish/chattybox und initialisieren Sie den Client mit der API-URL aus dem Dashboard.

4Workflow-Schritt

Zeigen Sie Antworten und zitierte Quell-URLs in der passenden Produktoberfläche an.

Dreistufiger Start

Fügen Sie Ihre JavaScript-SDK-URL ein, testen Sie die zitierten Antworten und installieren Sie dann das Widget.

Mit dem SDK loslegen
Headless-Chat-Infrastruktur

Gestalten Sie das Produkterlebnis, nicht die Suchpipeline

Das SDK empfiehlt sich für entwicklergeführte Integrationen mit eigener Oberfläche, Anwendungsstatus oder produktspezifischen Workflows.

Entscheidungsweg

Verwenden Sie diese Prüfpunkte, um zu entscheiden, ob ChattyBox neben Ihrer Dokumentenplattform stehen, einen separaten Assistenten ersetzen oder zum Testen isoliert bleiben soll.

01

Typisierte Client-API

Nutzen Sie einen fokussierten, TypeScript-freundlichen Client für Nachrichten, Folgegespräche, Widget-Konfiguration und lokalisierte Beschriftungen.

02

Quellenangaben

Erhalten Sie Quell-URLs zu jeder fundierten Antwort und bestimmen Sie selbst deren Darstellung.

03

Fortlaufende Konversationen

Behalten Sie die zurückgegebene Gesprächs-ID, um Nachrichten in einem Gespräch zu gruppieren. Die aktuelle Antwortanfrage enthält keine früheren Nachrichten als Modellkontext.

04

Klare Zuständigkeiten

Ihre Anwendung übernimmt Darstellung und Interaktionsdesign; ChattyBox betreibt Crawling, Suche, Generierung und Skalierung.

Installationspfad

JavaScript-Chatbot-SDK installieren

Das Paket funktioniert in aktuellen Browser- und Node.js-Anwendungen, die fetch bereitstellen. Verwenden Sie genau die Widget-API-URL und den öffentlichen Browser-Schlüssel aus dem Einbetten-Tab Ihres Projekts.

  1. 1Installieren Sie @openstaticfish/chattybox von npm.
  2. 2Initialisieren Sie einen Chattybox-Client mit Ihrem öffentlichen API-Schlüssel und der Widget-API-URL.
  3. 3Senden Sie eine Nachricht und zeigen Sie Antwort, Konversations-ID und Quell-URLs an.
Mit dem SDK loslegen
chat.ts
ts
import { Chattybox } from '@openstaticfish/chattybox';

// Replace these placeholders with the public key and widget API URL from Embed.
const chattybox = new Chattybox({
  apiKey: 'YOUR_PUBLIC_WIDGET_KEY',
  baseUrl: 'YOUR_WIDGET_API_URL',
});

const answer = await chattybox.sendMessage({
  message: 'How do I get started?',
});

console.log(answer.message, answer.sources);
Häufige Fragen

Häufige Fragen

1

Was ist ein Headless-JavaScript-Chatbot-SDK?

Eine Client-Bibliothek, die Chatübertragung und Antwortdaten bereitstellt, ohne eine Oberfläche vorzugeben. Ihre Anwendung zeigt Nachrichten, Quellen, Ladezustände und Steuerelemente an.

2

Ist das JavaScript-SDK von ChattyBox öffentlich auf npm verfügbar?

Ja. Installieren Sie @openstaticfish/chattybox von npm und nutzen Sie die öffentliche API aus der SDK-Referenz.

3

Umfasst das SDK Suche und Quellenangaben?

Das SDK ruft die verwaltete ChattyBox-Infrastruktur auf. Diese durchsucht Ihre indexierten Inhalte und gibt die erzeugte Nachricht mit zitierten Quell-URLs zurück.

4

Sollte ich das SDK oder widget.js verwenden?

Nutzen Sie das SDK für eine eigene Oberfläche oder einen eigenen Workflow. Nutzen Sie widget.js, wenn ChattyBox eine fertige Chat-Oberfläche ohne Build-Schritt pflegen soll.

Kostenlos starten

Keine Kreditkarte erforderlich. Ihre Inhalte werden nicht für Modelltraining verwendet.

Erstellen Sie einen kostenlosen Chatbot

Kostenloser Tarif. Keine Karte nötig.

Wir verwenden optionale Analyse- und Tag-Management-Tools, um zu verstehen, wie die Website genutzt wird. Entscheiden Sie, ob Sie Ahrefs Web Analytics, PostHog und Google Tag Manager erlauben möchten. Wenn Sie die Analyse deaktivieren, wird diese Seite neu geladen, damit die Änderung sauber wirksam wird. Die grundlegenden Funktionen der Website und die Fehlerüberwachung werden von dieser Auswahl nicht gesteuert. Datenschutzerklärung lesen.