01
Typisierte Client-API
Nutzen Sie einen fokussierten, TypeScript-freundlichen Client für Nachrichten, Folgegespräche, Widget-Konfiguration und lokalisierte Beschriftungen.
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 Dokumentseiten
Quellenzitierte Antworten
Einbettung mit einem Skript
Keine Dokumentenmigration erforderlich
Keine Kreditkarte erforderlichIhre Inhalte bleiben Ihre Inhalte
ChattyBox fragen
xWo sollte ich anfangen, wenn ich eine verlässliche Antwort von dieser Website brauche?
Fügen Sie zunächst Ihre Website-URL zu ChattyBox hinzu. Es crawlt Ihre Inhalte, beantwortet Fragen anhand der gefundenen Seiten und zeigt Besuchern die Quellen hinter jeder Antwort.
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 Chatbot mit Quellenangaben, ohne Ihren Docs-Stack neu aufzubauen
ChattyBox crawlt Ihre bestehende Dokumentation, indexiert die Inhalte für den Abruf und bettet einen Chatbot ein, der mit Ihren Docs antwortet statt mit generischem Modellgedächtnis.
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.
Beschränken Sie öffentliche Browser-Schlüssel auf erlaubte Ursprünge, ohne Verwaltungszugänge offenzulegen.
Workflow-Schritt
Erstellen Sie ein ChattyBox-Projekt, indexieren Sie Ihre Inhalte und testen Sie typische Fragen.
Workflow-Schritt
Erstellen Sie einen öffentlichen Widget-API-Schlüssel und beschränken Sie ihn auf die Ursprünge Ihrer Anwendung.
Workflow-Schritt
Installieren Sie @openstaticfish/chattybox und initialisieren Sie den Client mit der API-URL aus dem Dashboard.
Workflow-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.
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.
02
Quellenangaben
Erhalten Sie Quell-URLs zu jeder fundierten Antwort und bestimmen Sie selbst deren Darstellung.
03
Fortlaufende Konversationen
Speichern Sie die zurückgegebene Konversations-ID im Besucherstatus, um kontextbezogene Folgefragen zu ermöglichen.
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.
- 1Installieren Sie @openstaticfish/chattybox von npm.
- 2Initialisieren Sie einen Chattybox-Client mit Ihrem öffentlichen API-Schlüssel und der Widget-API-URL.
- 3Senden Sie eine Nachricht und zeigen Sie Antwort, Konversations-ID und Quell-URLs an.
chat.ts
ts
import { Chattybox } from '@openstaticfish/chattybox';
const chattybox = new Chattybox({
apiKey: import.meta.env.PUBLIC_CHATTYBOX_API_KEY,
baseUrl: import.meta.env.PUBLIC_CHATTYBOX_API_URL,
});
const answer = await chattybox.sendMessage({
message: 'How do I get started?',
});
console.log(answer.message, answer.sources);Als Nächstes ansehen
Weitere Möglichkeiten, ChattyBox zu nutzen
01
React-Chatbot-SDK
Verwalten Sie Chatstatus und Antworten mit Quellenangaben in einer eigenen React-Oberfläche.
Öffnen
02
Next.js-KI-Chatbot
Nutzen Sie das SDK sicher über Server- und Client-Grenzen des App Routers hinweg.
Öffnen
03
JavaScript-SDK-Referenz
Informieren Sie sich über Client-Methoden, Antwortfelder, Konversationen und Fehler.
Öffnen
04
Installation des gehosteten Widgets
Wählen Sie die gepflegte Oberfläche ohne Build-Schritt, wenn Sie keine eigene Darstellung benötigen.
Öffnen
05
Öffentliches npm-Paket
Prüfen Sie veröffentlichte Versionen, Paketmetadaten und den Installationsbefehl auf npm.
Öffnen
06
GitHub-Quellcode-Repository
Prüfen Sie das Quellcode-Repository, Releases, Issues und den Projektverlauf auf GitHub.
Öffnen
Häufige Fragen
Häufige Fragen
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.
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.
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.
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.