Přejít na hlavní obsah
ChattyBox Logo

JavaScript SDK

JavaScript SDK je doporučenou cestou pro nové integrace vedené vývojáři. Vytvořte si vlastní chatovací prostředí, zatímco ChattyBox zajistí vyhledávání, citace, konverzace a škálování. Pokud chcete hotové uživatelské rozhraní bez aplikačního kódu, použijte plně podporovaný hostovaný widget.

Než začnete​

  1. Vytvořte projekt a indexujte svůj obsah.
  2. Otestujte v ovládacím panelu typické otázky.
  3. Otevřete v projektu kartu Vložit.
  4. Vytvořte nebo vyberte veřejný API klíč widgetu a nastavte jeho povolené zdroje.
  5. Zkopírujte adresu URL API widgetu zobrazenou spolu s kódem pro vložení.

Veřejné API klíče widgetu jsou určené k použití v kódu prohlížeče. Identifikují projekt, ale nejsou přihlašovacími údaji pro jeho správu. Omezte klíče prohlížeče na domény, které smějí volat vašeho chatbota.

Instalace​

bun add @openstaticfish/chattybox

Balíček je klient ESM pro současné aplikace Node.js a prohlížeče, které poskytují funkci fetch.

Odeslání zprávy​

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);
console.log(answer.sources);

Nastavte PUBLIC_CHATTYBOX_API_URL na přesnou adresu URL API widgetu z karty Vložit. SDK přijímá kořenovou adresu nasazení i adresu URL končící na /chat.

Odpověď obsahuje:

PoleTypPopis
messagestringVygenerovaná odpověď.
conversationIdstringIdentifikátor používaný k pokračování této konverzace.
sourcesstring[]Adresy URL zdrojů vyhledaných pro odpověď.

Pokračování konverzace​

Uchovejte vrácené ID konverzace ve stavu uživatelského rozhraní a odešlete ho s další zprávou:

const followUp = await chattybox.sendMessage({
  message: 'Can you explain the second step?',
  conversationId: answer.conversationId,
});

Nepoužívejte jedno ID konverzace pro vzájemně nesouvisející návštěvníky. Novou konverzaci vytvoříte tak, že v jejich první zprávě vynecháte conversationId.

Zpracování chyb​

import { Chattybox, ChattyboxError } from '@openstaticfish/chattybox';

try {
  await chattybox.sendMessage({ message: 'Where is the API reference?' });
} catch (error) {
  if (error instanceof ChattyboxError) {
    console.error(error.status, error.code, error.message);
  }
}

ChattyboxError.status obsahuje stav HTTP. code je k dispozici, pokud API vrátí strukturovaný kód chyby.

Pokročilá kompatibilita s widgetem​

SDK také zpřístupňuje metody getWidgetConfig() a getWidgetTranslations(locale). Tyto metody slouží klientům, kteří chtějí napodobit nastavení projektu a lokalizované popisky hostovaného widgetu. Plně vlastní uživatelské rozhraní je může ignorovat.

Další kroky​