ホーム>プログラミング関連>その他のソースコード
ダウンロード 

    .d8888b.  888888b.   888    d8P
   d88P  Y88b 888  "88b  888   d8P
   888    888 888  .88P  888  d8P
   888        8888888K.  888d88K
   888        888  "Y88b 8888888b
   888    888 888    888 888  Y88b
   Y88b  d88P 888   d88P 888   Y88b
    "Y8888P"  8888888P"  888    Y88b .ai

ChatBotKit ノード SDK

ChatBotKit ノード SDK へようこそ。この SDK は、会話型 AI ボットとエージェントを簡単に構築するための JavaScript ベースのプラットフォームを提供します。 ChatBotKit を使用すると、自然言語による対話が可能な AI ボットを迅速に開発および導入できます。

これは、ChatBotKit Node SDK のメタ リポジトリです。これには、 React 、 Next.js 、 NextAuthなど、多くの人気のあるプラットフォームやフレームワーク用の SDK パッケージが含まれています。

主なパッケージ

ChatBotKit Node SDK は次のパッケージで構成されています。

パッケージバージョン説明
@チャットボットキット/cli ChatBotKit CLI。
@チャットボットキット/SDK ChatBotKit API SDK。
@チャットボットキット/反応ChatBotKit React SDK。
@チャットボットキット/次へChatBotKit Next.js SDK。
@チャットボットキット/nextauth ChatBotKit NextAuth.js SDK。
@チャットボットキット/フェッチChatBotKit のアイソメトリック フェッチの実装。

その他のツール

このリポジトリには次のツールも含まれています。

パッケージバージョン説明
cbkアプリの作成新しい CBK アプリケーションを作成するための簡単なツール。

SDKの機能

  • 簡単なセットアップ: 迅速かつ簡単なインストールプロセス。
  • サーバーレスの互換性: サーバーレス、Edge、Vercel、Netlify、Cloudflare Workers、Deno、AWS Lambda などの最新のランタイム環境とシームレスに動作します。
  • 最新のフレームワークのサポート: CommonJS、ECMAScript モジュール、async/await、ストリームなどの組み込みサポート。
  • カスタマイズ性: 特定のユースケースに合わせてチャットボットの動作と応答を調整します。
  • マルチプラットフォーム: Web サイト、モバイル アプリ、Slack、Discord、WhatsApp などのメッセージング プラットフォームにチャットボットを導入します。
  • マルチモデル: GPT-3、GPT-4、Claude などを含む幅広い言語モデルをサポートします。

ChatBotKit の機能

  • マルチモーダル サポート: OpenAI、Anthropic、Mistral、AWS、Google などのすべてのベンダーのさまざまな言語および画像モデルをサポートします。
  • ?多言語サポート: 簡単なカスタマイズとさまざまな言語コンテキストでの使用が可能になります。
  • 会話管理: 複雑な会話の欠陥を簡単に管理します。
  • ?チャット履歴: 過去の会話を確認して参照できます。
  • ?カスタム データセット: ボット応答用のデータを整理します。
  • カスタム スキルセット: 画像生成や Web 取得などの独自の機能をチャットボットに装備します。
  • ?ドキュメント ファイルのインポート: さまざまな種類のドキュメント ファイルをチャットボット データセットにインポートします。
  • ?メディア ファイルのインポート: さまざまなメディア ファイル形式をチャットボット データセットにインポートします。
  • ウィジェットの統合: カスタマイズ可能なオプションを使用して、チャットボットを Web サイトにシームレスに埋め込みます。
  • Slack、Discord、WhatsApp ボットの統合: 一般的なメッセージング プラットフォームと簡単に統合できます。
  • ?サイトマップの統合: Web サイトのコンテンツを検索可能なナレッジ ベースに取り込みます。
  • ?ストリーミング: ストリーミング機能を有効/無効にします。
  • データセキュリティ: ユーザーデータを保護するための強力な対策。
  • ?プライバシー重視: 責任あるデータ処理を保証するための強力なプライバシー管理。
  • コンテンツモデレーション: 不正なコンテンツを自動的にスキャンしてフラグを立てます。
  • ?シンプルな価格設定: 透明性のあるわかりやすい価格設定。

はじめる

ChatBotKit の使用を開始するには、次の手順に従います。

  1. インストール: 
    npm install @chatbotkit/sdk
  2. 使用方法: チャットボット プロジェクトに SDK を実装します。

ストリーミングの例

この例では、エッジ環境およびサーバーレス環境でのストリーミング機能を示します。 

 import { ConversationClient } from '@chatbotkit/sdk/conversation/index.js'

const client = new ConversationClient ( /* configuration */ )

for await ( const { type , data } of client
  . complete ( null , { model : 'gpt-4' , messages } )
  . stream ( ) ) {
  if ( type === 'token' ) {
    process . stdout . write ( data . token )
  }
}

Next.js の NextGen の例

この例では、Next.js プロジェクトでストリーミング、関数呼び出し、サーバー側レンダリングなどを使用して高度な会話型 AI を構築する方法を示します。

bot: thinking...
) : null}
setText(e.target.value)} onSubmit={submit} placeholder="Type something..." style={{ border: 0, outline: 'none', resize: 'none', width: '100%', marginTop: '10px', }} />
) } export default function ChatArea() { return ( ) } // file: ./actions/conversation.jsx 'use server' import CalendarEvents from '../components/CalendarEvents.jsx' import { streamComplete } from '@chatbotkit/react/actions/complete' import { ChatBotKit } from '@chatbotkit/sdk' const cbk = new ChatBotKit({ secret: process.env.CHATBOTKIT_API_SECRET, }) export async function complete({ messages }) { return streamComplete({ client: cbk.conversation, messages, functions: [ { name: 'getUserName', description: 'Get the authenticated user name', parameters: {}, handler: async () => { return 'John Doe' }, }, { name: 'getCalendarEvents', description: 'Get a list of calendar events', parameters: {}, handler: async () => { const events = [ { id: 1, title: 'Meeting with Jane Doe' }, { id: 2, title: 'Meeting with Jill Doe' }, ] return { children: , result: { events, }, } }, }, { name: 'declineCalendarEvent', description: 'Decline a calendar event', parameters: { type: 'object', properties: { id: { type: 'number', description: 'The ID of the event to decline', }, }, required: ['id'], }, handler: async ({ id }) => { return `You have declined the event with ID ${id}` }, }, ], }) }">
 // file: ./app/page.jsx
import ChatArea from '../components/ChatArea.jsx'

export default function Page ( ) {
  return < ChatArea / >
}

// file: ./components/ChatArea.jsx
'use client'

import { useContext } from 'react'

import { complete } from '../actions/conversation.jsx'

import { ChatInput , ConversationContext } from '@chatbotkit/react'
import ConversationManager from '@chatbotkit/react/components/ConversationManager'

export function ChatMessages ( ) {
  const {
    thinking ,

    text ,
    setText ,

    messages ,

    submit ,
  } = useContext ( ConversationContext )

  return (
    < div >
      < div >
        { messages . map ( ( { id , type , text , children } ) => {
          switch ( type ) {
            case 'user' :
              return (
                < div key = { id } >
                  < div >
                    < strong > user: < / strong > { text }
                  < / div >
                < / div >
              )

            case 'bot' :
              return (
                < div key = { id } >
                  < div >
                    < strong > bot: < / strong > { text }
                  < / div >
                  { children ? < div > { children } < / div > : null }
                < / div >
              )
          }
        } ) }
        { thinking ? (
          < div key = "thinking" >
            < strong > bot: < / strong > thinking...
          < / div >
        ) : null }
      < / div >
      < ChatInput
        value = { text }
        onChange = { ( e ) => setText ( e . target . value ) }
        onSubmit = { submit }
        placeholder = "Type something..."
        style = { {
          border : 0 ,
          outline : 'none' ,
          resize : 'none' ,
          width : '100%' ,
          marginTop : '10px' ,
        } }
      / >
    < / div >
  )
}

export default function ChatArea ( ) {
  return (
    < ConversationManager endpoint = { complete } >
      < ChatMessages / >
    < / ConversationManager >
  )
}

// file: ./actions/conversation.jsx
'use server'

import CalendarEvents from '../components/CalendarEvents.jsx'

import { streamComplete } from '@chatbotkit/react/actions/complete'
import { ChatBotKit } from '@chatbotkit/sdk'

const cbk = new ChatBotKit ( {
  secret : process . env . CHATBOTKIT_API_SECRET ,
} )

export async function complete ( { messages } ) {
  return streamComplete ( {
    client : cbk . conversation ,

    messages ,

    functions : [
      {
        name : 'getUserName' ,
        description : 'Get the authenticated user name' ,
        parameters : { } ,
        handler : async ( ) => {
          return 'John Doe'
        } ,
      } ,

      {
        name : 'getCalendarEvents' ,
        description : 'Get a list of calendar events' ,
        parameters : { } ,
        handler : async ( ) => {
          const events = [
            { id : 1 , title : 'Meeting with Jane Doe' } ,
            { id : 2 , title : 'Meeting with Jill Doe' } ,
          ]

          return {
            children : < CalendarEvents events = { events } / > ,

            result : {
              events ,
            } ,
          }
        } ,
      } ,

      {
        name : 'declineCalendarEvent' ,
        description : 'Decline a calendar event' ,
        parameters : {
          type : 'object' ,
          properties : {
            id : {
              type : 'number' ,
              description : 'The ID of the event to decline' ,
            } ,
          } ,
          required : [ 'id' ] ,
        } ,
        handler : async ( { id } ) => {
          return `You have declined the event with ID ${ id } `
        } ,
      } ,
    ] ,
  } )
}

基本的な Next.js の例

この簡単な例は、Next.js プロジェクトで SDK を使用する方法を示しています。

bot: thinking...
)} setText(e.target.value)} onKeyDown={handleOnKeyDown} placeholder="Type something..." style={{ border: 0, outline: 'none', resize: 'none', width: '100%', marginTop: '10px', }} /> ) } // file: ./pages/api/conversation/complete.js import { ChatBotKit } from '@chatbotkit/sdk' import { stream } from '@chatbotkit/next/edge' const cbk = new ChatBotKit({ secret: process.env.CHATBOTKIT_API_SECRET, }) export default async function handler(req) { const { messages } = await req.json() return stream(cbk.conversation.complete(null, { messages })) } export const config = { runtime: 'edge', }">
 // file: ./pages/index.js
import { AutoTextarea , useConversationManager } from '@chatbotkit/react'

export default function Index ( ) {
  const {
    thinking ,

    text ,
    setText ,

    messages ,

    submit ,
  } = useConversationManager ( {
    endpoint : '/api/conversation/complete' ,
  } )

  function handleOnKeyDown ( event ) {
    if ( event . keyCode === 13 ) {
      event . preventDefault ( )

      submit ( )
    }
  }

  return (
    < div style = { { fontFamily : 'monospace' , padding : '10px' } } >
      { messages . map ( ( { id , type , text } ) => (
        < div key = { id } >
          < strong > { type } : < / strong > { text }
        < / div >
      ) ) }
      { thinking && (
        < div key = "thinking" >
          < strong > bot: < / strong > thinking...
        < / div >
      ) }
      < AutoTextarea
        value = { text }
        onChange = { ( e ) => setText ( e . target . value ) }
        onKeyDown = { handleOnKeyDown }
        placeholder = "Type something..."
        style = { {
          border : 0 ,
          outline : 'none' ,
          resize : 'none' ,
          width : '100%' ,
          marginTop : '10px' ,
        } }
      / >
    < / div >
  )
}

// file: ./pages/api/conversation/complete.js
import { ChatBotKit } from '@chatbotkit/sdk'
import { stream } from '@chatbotkit/next/edge'

const cbk = new ChatBotKit ( {
  secret : process . env . CHATBOTKIT_API_SECRET ,
} )

export default async function handler ( req ) {
  const { messages } = await req . json ( )

  return stream ( cbk . conversation . complete ( null , { messages } ) )
}

export const config = {
  runtime : 'edge' ,
}

例

ここでさまざまな例を見てみましょう。

注目すべき例としては次のようなものがあります。

プラットフォーム例説明
Next.jsステートレス チャット (App Router + RSC + 関数 + 関数リクエスト)ステートレス チャットボットの例。会話はクライアントとサーバーによって管理されます。この例では、App Router と Server Actions、および関数リクエストを伴う AI 関数を使用します。これは、ChatBotKit 会話型 AI プラットフォームの全機能を示す強力な例です。
Next.jsステートレス チャット (App Router + RSC + 機能)ステートレス チャットボットの例。会話はクライアントとサーバーによって管理されます。この例では、App Router と Server Actions、および AI 関数を使用します。
Next.jsステートレス チャット (App Router + RSC)ステートレス チャットボットの例。会話はクライアントとサーバーによって管理されます。この例では、App Router と Server Actions を使用します。
Next.jsステートレス チャット (アプリ ルーター)ステートレス チャットボットの例。会話はクライアントによって管理されます。この例では、App Router を使用します。
Next.jsステートレスチャットステートレス チャットボットの例。会話はクライアントによって管理されます。
Next.js基本的なチャット基本的なチャットボットの例。会話は ChatBotKit によって管理されます。
Next.js NextAuth の例NextAuth と ChatBotKit を組み合わせる方法を示します。
ノードGPT4ストリーミングAIチャットボットシンプルなストリーミング AI チャットボットの例。
Cloudflare ワーカーGPT4 AIチャットボットCloudflare Workers 用のストリーミング AI チャットボットの例。

安定性

すべての SDK 機能は、明示的に安定しているとマークされていない限り、不安定とみなされます。安定性は、ドキュメント内の@stableタグの存在によって示されます。

ドキュメント

  • Type Documentation : 利用可能なタイプの詳細情報はここにあります。
  • プラットフォームのドキュメント: ChatBotKit の包括的なガイドはこちらです。
  • プラットフォーム チュートリアル: ChatBotKit のステップバイステップ チュートリアルはこちらです。

貢献する

バグに遭遇しましたか? それとも貢献したいですか?公式 GitHub リポジトリで問題を開くか、プル リクエストを送信してください。

拡大する
追加情報
関連アプリ
おすすめ
関連情報 すべて