Lewati ke konten utama
ChattyBox Logo
ChattyBoxMulai Free
SDK JavaScript Terbuka

Buat chatbot kustom dengan SDK JavaScript kami

Gunakan @openstaticfish/chattybox untuk mengendalikan antarmuka, sementara ChattyBox menangani retrieval, sitasi sumber, percakapan, dan penskalaan. Kunci API yang aman untuk browser mengidentifikasi proyek Anda dan dapat dibatasi ke origin yang disetujui.

Merangkak halaman dokumen yang dipublikasikanJawaban yang dikutip dari sumberSematkan dengan satu skripTidak diperlukan migrasi dokumenTidak perlu kartu kreditKonten Anda tetap milik Anda
Mulai membangun dengan SDKBaca referensi SDK
Tanya ChattyBox
Di mana saya harus mulai jika membutuhkan jawaban tepercaya dari situs ini?
Mulai dengan menambahkan URL situs publik Anda ke ChattyBox. Layanan ini mengambil konten terindeks untuk memandu jawaban dan dapat menampilkan tautan sumber untuk diperiksa pengunjung. Uji jawaban dan jawaban cadangan sebelum peluncuran.
iSumber3^
SDK JavaScript panduan
chattybox.ai
Analitik
chattybox.ai
Beranda
chattybox.ai

Percakapan ilustratif — bukan chat langsung.

Didukung oleh ChattyBox

Luncurkan chatbot dengan kutipan sumber tanpa membangun ulang stack situs Anda

ChattyBox merayapi situs web, dokumentasi, pusat bantuan, CMS, atau basis pengetahuan yang sudah ada, lalu menyematkan chatbot yang menjawab berdasarkan konten terbitan Anda sendiri, bukan memori model generik.

Instal paket ESM bertipe dari npm dengan Bun atau package manager pilihan Anda.
Buat sendiri rendering pesan, state percakapan, sitasi, dan desain interaksi.
Gunakan infrastruktur retrieval terkelola dan jawaban berbasis sumber yang sama dengan widget yang dihosting.
Kunci browser publik bekerja lintas origin secara default; pembatasan origin tepat adalah penguatan opsional, bukan autentikasi.
Langkah alur kerja

Buat proyek ChattyBox, indeks konten Anda, dan uji pertanyaan yang representatif.

Langkah alur kerja

Buat kunci API widget publik; batasi ke origin aplikasi Anda jika diinginkan.

Langkah alur kerja

Instal @openstaticfish/chattybox dan inisialisasi klien dengan URL API dari dasbor.

Langkah alur kerja

Tampilkan jawaban dan URL sumber yang disitasi dalam antarmuka yang dibutuhkan produk Anda.

Peluncuran tiga langkah

Tempelkan URL SDK JavaScript Anda, uji jawaban yang dikutip, lalu pasang widget.

Mulai membangun dengan SDK
Infrastruktur chat headless

Kendalikan pengalaman produk, bukan pipeline retrieval

SDK adalah jalur yang direkomendasikan untuk integrasi yang dipimpin developer dan memerlukan UI kustom, state aplikasi, atau alur kerja khusus produk.

Jalur keputusan

Gunakan pos pemeriksaan ini untuk memutuskan apakah ChattyBox harus ditempatkan di samping platform dokumen Anda, menggantikan asisten terpisah, atau tetap terisolasi untuk pengujian.

01

API klien bertipe

Gunakan klien yang ringkas dan ramah TypeScript untuk pesan, percakapan lanjutan, konfigurasi widget, dan label yang dilokalkan.

02

Sitasi sumber

Terima URL sumber bersama setiap jawaban berbasis sumber dan tentukan sendiri cara menampilkannya di antarmuka.

03

Kelanjutan percakapan

Gunakan kembali conversationId yang sama untuk pertanyaan lanjutan agar model menerima hingga 12 pesan terbaru yang tersimpan sebagai konteks, masing-masing dipotong hingga 2.000 karakter. Ini konteks terbatas, bukan seluruh transkrip; pisahkan ID di antara pengunjung yang tidak berkaitan.

04

Batas tanggung jawab yang jelas

Aplikasi Anda mengendalikan rendering dan desain interaksi; ChattyBox mengoperasikan crawling, retrieval, generation, dan penskalaan.

Jalur pemasangan

Instal SDK chatbot JavaScript

Paket ini berfungsi di aplikasi browser dan Node.js modern yang menyediakan fetch. Gunakan URL widget API dan kunci browser publik yang persis seperti pada tab Embed proyek Anda.

  1. 1Instal @openstaticfish/chattybox dari npm.
  2. 2Inisialisasi satu klien Chattybox dengan kunci API publik dan URL widget API Anda.
  3. 3Kirim pesan dan tampilkan jawaban, ID percakapan, serta URL sumber yang dikembalikan.
Mulai membangun dengan SDK
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);
Jelajahi berikutnya

Lebih banyak cara menggunakan ChattyBox

Telusuri panduan platform
01SDK chatbot ReactKelola state chat dan jawaban bersitasi dalam antarmuka React kustom.02Chatbot AI Next.jsGunakan SDK dengan aman melintasi batas server dan klien App Router.03Referensi SDK JavaScriptPelajari metode klien, field respons, percakapan, dan error.04Instalasi widget yang dihostingPilih UI tanpa proses build yang dikelola saat Anda tidak memerlukan rendering kustom.05Paket publik di npmTinjau versi yang telah dipublikasikan, metadata paket, dan perintah instalasi di npm.06Repositori kode sumber di GitHubTinjau repositori kode sumber, rilis, issue, dan riwayat proyek di GitHub.
Tanya Jawab

Pertanyaan umum

1

Apa itu SDK chatbot JavaScript headless?

SDK ini adalah pustaka klien yang menyediakan transport chat dan data respons tanpa menentukan antarmukanya. Aplikasi Anda menampilkan pesan, sumber, state pemuatan, dan kontrol.

2

Apakah SDK JavaScript ChattyBox tersedia publik di npm?

Ya. Instal @openstaticfish/chattybox dari npm dan gunakan API publik yang didokumentasikan pada halaman referensi SDK.

3

Apakah SDK menyertakan retrieval dan sitasi sumber?

SDK memanggil infrastruktur terkelola ChattyBox, yang mengambil informasi dari konten terindeks dan mengembalikan pesan yang dibuat beserta URL sumber yang disitasi.

4

Sebaiknya saya menggunakan SDK atau widget.js?

Gunakan SDK jika tim Anda mengendalikan antarmuka atau alur kerja kustom. Gunakan widget.js jika Anda ingin ChattyBox mengelola UI chat siap pakai tanpa proses build.

Mulai gratis

Tidak perlu kartu kredit

Buat chatbot gratis

Paket gratis. Tanpa kartu.