.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
Bienvenue dans le SDK du nœud ChatBotKit. Ce SDK offre une plate-forme basée sur JavaScript pour créer sans effort des robots et des agents d'IA conversationnels. Avec ChatBotKit, vous pouvez développer et déployer rapidement des robots IA capables d'interagir en langage naturel.
Il s'agit d'un méta-dépôt pour le SDK ChatBotKit Node. Il contient les packages SDK pour un certain nombre de plates-formes et de frameworks populaires tels que React , Next.js , NextAuth et plus encore.
Le SDK ChatBotKit Node est composé des packages suivants :
Emballer | Version | Description |
---|---|---|
@chatbotkit/cli | La CLI ChatBotKit. | |
@chatbotkit/sdk | Le SDK de l'API ChatBotKit. | |
@chatbotkit/réagir | Le SDK ChatBotKit React. | |
@chatbotkit/suivant | Le SDK ChatBotKit Next.js. | |
@chatbotkit/nextauth | Le SDK ChatBotKit NextAuth.js. | |
@chatbotkit/fetch | L'implémentation de la récupération isométrique de ChatBotKit. |
Ce référentiel contient également les outils suivants :
Emballer | Version | Description |
---|---|---|
créer-cbk-app | Un outil rapide pour créer une nouvelle application CBK. |
Suivez ces étapes pour démarrer avec ChatBotKit :
npm install @chatbotkit/sdk
Cet exemple illustre les fonctionnalités de streaming dans les environnements Edge et sans serveur :
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 )
}
}
Cet exemple montre comment créer une IA conversationnelle avancée avec le streaming, les appels de fonction, le rendu côté serveur et bien plus encore dans un projet Next.js :
// 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 } ` } , } , ] , } ) }
Cet exemple rapide montre comment utiliser le SDK dans un projet Next.js :
// 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' , }
Découvrez une gamme d’exemples ici.
Voici quelques exemples notables :
Plate-forme | Exemple | Description |
---|---|---|
Suivant.js | Chat sans état (Routeur d'application + RSC + Fonctions + Demande de fonction) | Un exemple de chatbot apatride, où la conversation est gérée par le client et le serveur. Cet exemple utilise les actions du routeur d'application et du serveur ainsi que les fonctions IA avec des requêtes de fonction. Il s'agit d'un exemple puissant pour démontrer toutes les capacités de la plateforme d'IA conversationnelle ChatBotKit. |
Suivant.js | Chat sans état (Routeur d'application + RSC + Fonctions) | Un exemple de chatbot apatride, où la conversation est gérée par le client et le serveur. Cet exemple utilise les actions du routeur d'application et du serveur ainsi que les fonctions d'IA. |
Suivant.js | Chat sans état (routeur d'application + RSC) | Un exemple de chatbot apatride, où la conversation est gérée par le client et le serveur. Cet exemple utilise les actions du routeur d'application et du serveur. |
Suivant.js | Chat sans état (routeur d'application) | Un exemple de chatbot apatride, où la conversation est gérée par le client. Cet exemple utilise le routeur d'applications. |
Suivant.js | Chat apatride | Un exemple de chatbot apatride, où la conversation est gérée par le client. |
Suivant.js | Chat de base | Un exemple de chatbot basique, où la conversation est gérée par ChatBotKit. |
Suivant.js | Exemple NextAuth | Montre comment combiner NextAuth et ChatBotKit. |
Nœud | Chatbot IA de streaming GPT4 | Un exemple simple de chatbot IA en streaming. |
Travailleurs Cloudflare | Chatbot IA GPT4 | Un exemple de chatbot IA en streaming pour Cloudflare Workers. |
Toutes les fonctionnalités du SDK sont considérées comme instables sauf si elles sont explicitement marquées comme stables. La stabilité est indiquée par la présence d'une balise @stable
dans la documentation.
Vous rencontrez un bug ou souhaitez contribuer ? Ouvrez un ticket ou soumettez une pull request sur notre référentiel GitHub officiel.