激闘！AIのAPIとdatabese連携！

本日のプロジェクト作業まとめ

本日は、Vercel AI SDKを使用したNext.jsベースのAIチャットボットアプリケーションの構築と設定を行いました。主に以下の作業を実施しました：

1. 環境構築

• プロジェクトの基礎となるmuscle_botディレクトリを作成
• 必要な依存パッケージをインストール（Next.js、React、Tailwind CSS、Vercel AI SDKなど）

2. 認証設定

• Auth.js (旧NextAuth.js) の設定
• .env.localファイルにAUTH_SECRETを設定

3. Groq (xAI) の設定

• Groq APIキーを取得し、.env.localファイルにXAI_API_KEYとして設定
• デフォルトAIプロバイダをxaiに設定
• providers.tsファイルを修正し、Groqのllama3-70b-8192モデルをデフォルトとして設定

4. データベース接続問題の解決

• PostgreSQLデータベース接続が課題となったため、middleware.tsを修正して認証チェックをバイパス
• これにより、データベース依存なしでアプリケーションの動作が可能に

middleware.ts

export async function middleware(request: NextRequest) {
  // すべてのリクエストを許可する
  return NextResponse.next();
}

5. AIチャットボット機能の実装

• テキスト対話機能を実装（Groq APIを使用）
• ユーザーからのメッセージ入力と応答表示の機能を確認
• llama3-70bモデルによる高品質な応答生成を確認

課題と解決策

• データベース接続エラー：

  • Supabaseの接続URLに問題があったため、認証バイパスで一時的に解決

• AI SDKの更新に伴う互換性問題：

  • openaiのインポートパスが変更されていたため、@ai-sdk/openaiからインポートするよう修正

次のステップ

• Vercel PostgresまたはSupabaseの正しい接続設定
• データベースマイグレーションの実行
• ユーザー認証の完全な実装
• チャット履歴の保存機能の有効化

結論

データベース接続の課題はあるものの、AIチャットの基本機能は正常に動作しています。ミドルウェアの修正により、認証チェックをバイパスし、Groq API経由でのAI応答生成が機能しているため、基本的なチャットボットの動作を確認できました