React / OpenAI API でチャットボット作成

ReactとOpenAI APIを使ってチャットボットを作ってみる。

ChatGPTのWebブラウザ版と同じく、メッセージ入力/送信ボタン押下でOpenAI APIにリクエストを送り回答を得る。フロントのみなのでセッション保持などはなし。

GitHub: https://github.com/yuheijotaki/chatgpt-bot-sample

OpenAI APIへのPOSTは、

const response = await axios.post(
  'https://api.openai.com/v1/chat/completions',
  {
    model: 'gpt-3.5-turbo',
    messages: [
      ...conversation,
      {
        role: 'user',
        content: message,
      },
    ],
  },
  ...
);

messages 内で会話履歴を配列にいれておくことで、文脈を踏まえて回答するようになる。

所感

レスポンスの早さが gpt-3.5-turbo っていうくらいなので、早いと期待していましたがそこまでではなかったです。
GPT-4も招待来たら使ってみたいと思います。