ChatGPTの公式APIを使うとデフォルトでは、あるリクエストに対して、応答が全て取得できたら、レスポンスが返ってきます。

これをChatGPT本家のようにタイピング形式 (細切れ形式?)で返したい場合に

参考になる情報を調べたので共有いたします。

■ 概要としては以下のとおりです。

– APIのリクエストパラメータのstreamをtrueにすることでAPIのレスポンスが SSE (Server sent event)で返ってきます。

– それらをフロントに細切れに読み出していくためにReadableStreamとして処理します

– フロントではストリームが完了([DONE]まで)するまでデコードを繰り返して、値を取り出していきます。

■ NextJSでの実装を公式が用意してくれてました。

(Edge Functionsを使ったChatGPT APIのstream形式でのレスポンスの受け取り方)

また、NextJS公式がChatGPTの他、いろいろなAIを使ったテンプレートを用意してくれてるみたいです

〜追記〜

これらを、Zenn.devにて、わかりやすく記事にまとめていた方を発見しました

ChatGPTのAPIも誰でも使えるのでぜひ！ちなみに、無料枠もあります👍

■ 参考

BLOGブログ

ChatGPTの応答をストリームとして処理するには