chatbot create
cozeを使って簡単にチャットボットを作ってみます！
UIが見やすく、短時間で作成できるメリットがあります。
でも、まだ英語の部分が多いため、英語ができないと少し難しいです。。
Googleでログインし、「Create Bot」をクリックしてボットを作成します。
操作方法
Persona & Prompt
チャットボットのペルソナとプロンプトを設定する場所です。
チャットボットの性格、口調、基本的な応答スタイルなどを定義できます。
Skills
Plugins: プラグインはチャットボットが外部サービスやAPIと連携できるようにする機能です。これにより、チャットボットは次のような作業を行うことができます。
Workflows: ワークフローは複数の機能を組み合わせて複雑な作業を自動化するものです。視覚的なインターフェースを通じて簡単に設定できます。
Triggers: トリガーは特定の条件が満たされたときに自動で動作する機能です。これにより、チャットボットが自動的に反応するように設定できます。
Knowledge
Text: 文書、URL、サードパーティデータソースをテキスト知識にアップロードすると、ボットがそのコンテンツを参照して質問に答えることができます。ここで文書に質問への回答を入力すれば、そのまま回答することができます。
Table: 表形式のデータを追加できます。例えば、書籍リストなどのデータを追加することができます。
**Images: **チャットボットが使用する画像データを追加できます。
Memory
Variables: チャットボットが会話中に覚えておくべき変数を設定できます。例えば、ユーザーの名前を記憶する場合に使用できます。
Database: データベースに接続してデータを保存および取得できます。
Long-term memory: 長期メモリ機能をオンまたはオフにできます。チャットボットが会話を通じて長期的に覚えておくべき情報を設定できます。
Filebox: ファイルボックス機能をオンまたはオフにできます。チャットボットがファイルを保存および取得できます。
Chat experience (チャット体験)
Opening questions: ユーザーがチャットボットとの会話を始めるときに、最初の質問を設定できます。
Auto-suggestion: この機能は、ユーザーが入力中にチャットボットが自動的に提案を提供する機能です。ユーザーが質問を入力し始めると、チャットボットが関連する質問や回答を自動的に提案し、ユーザーがより簡単に情報を見つけられるようにします。
Shortcuts (ショートカット): ユーザーがよく質問する内容や機能に簡単にアクセスできるようにショートカットボタンを設定する場所です。例えば、「書籍検索」、「最近見た本」、「おすすめの本」などのショートカットを設定して、ユーザーがワンクリックで必要な機能を利用できるようにすることができます。
Background image (背景画像): チャットボットの会話ウィンドウの背景画像を設定できる場所です。ユーザー体験を向上させるために、チャットボットの会話ウィンドウの背景をユーザーに合わせた画像に設定できます。
Roles (役割)
チャットボットの声やキャラクターを設定できる部分です。
設定
図書館チャットボットを作るため、PluginsにGoogle Web Search Pluginを追加して、図書情報を検索できるように設定します。
Promptを入力してOptimizeをクリックすると、プロンプトが適切に作成されます。
チャットボットに本をおすすめされると、回答してくれます。
これをNext.jsと接続してみます。
API エンドポイントの作成
curl --location --request POST 'https://api.coze.com/open_api/v2/chat' \
--header 'Authorization: Bearer {{Personal_Access_Token}}' \
--header 'Content-Type: application/json' \
--header 'Accept: */*' \
--header 'Host: api.coze.com' \
--header 'Connection: keep-alive' \
--data-raw '{
"conversation_id": "123",
"bot_id": "{{Bot_Id}}",
"user": "123333333",
"query": "{{yourquery}}",
"stream":false
}'
Bot as APIをチェック必須！Bot as APIをチェックすると、ストアにアップロードする必要がなくなります。
Authorizationにトークンを入れて、bot_idに作成したチャットボットのURLの一番後ろにある数字を入力します。
const response = await fetch("https://api.coze.com/open_api/v2/chat", {
method: "POST",
headers: {
Authorization: `Bearer ${process.env.NEXT_PUBLIC_COZE_API_TOKEN}`,
"Content-Type": "application/json",
Accept: "*/*",
},
body: JSON.stringify({
conversation_id: conversationId,
bot_id: process.env.NEXT_PUBLIC_COZE_BOT_ID,
user: userId,
query: query,
stream: false,
}),
});
if (!response.ok) {
throw new Error("Network response was not ok");
}
const data = await response.json();
console.log("API Response:", data);
console.log("API Response:", data);がこのように入ります！
データからフィルタリングしたい内容はフィルタリングしました！
const messages = data.messages
.filter((message) => message.type !== "follow_up" && message.type !== "verbose")
.map((message) => {
if (message.content_type === "text") {
try {
const parsedContent = JSON.parse(message.content);
if (parsedContent.data) {
const parsedData = JSON.parse(parsedContent.data);
return parsedData.chunks.map((chunk) => chunk.slice).join("\n");
}
} catch (e) {
return message.content;
}
}
return message.content;
});
console.log(messages, "messages");
return { ...data, messages: messages.slice(0, 1) };
これでフロントエンドに取り込んでチャットボットのようにデザインすれば、チャットボットが完成します！
Discussion