chatGPTを気軽に試そう✌️

こんにちは、なかにしです。

chatGPTを気軽に試せるアプリを作成しました。
ソースコードはこちらです。

お金がかかるので一般公開はできませんが、
身内には公開してchatGPTの販促をしようと思います🙌

今回は、どのあたりに苦労したかを主に書こうと思います。

作ったアプリ
chatGPT APIの使用方法
さいごに

作ったアプリ

chatGPTのAPIを使用し、音声またはテキストで質問ができるというアプリです。

使用技術：Next.js
作成時間： 4時間程度

APIキーを使用する必要があるので、バックエンド側で隠蔽しました。

chatGPT APIの使用方法

概要

chatGPTのAPIを使用することで、質問を誰でも投げることが出来ます。
APIは従量課金制で、AIのモデルとchatGPTの解答量（トークン）によって料金が変わります。

より新しいAIのモデルを使用すると、トークンに対する料金が上がります。
詳しくはこちらをご覧ください。

使用にあたっての準備

必要なのは以下の3つです。
①会員登録 ②料金のチャージ ③プログラミング言語

①会員登録
こちらから会員登録をします。

こちらは「使用者」ではなく「開発者」としての登録になりますので、
使用者として登録している方も、再度登録が必要です。

②料金のチャージ
開発者登録が完了した後は、こちらから料金のチャージをします。

今回は1回の解答で100トークンを上限としたコードにしたので、
とりあえず$10のチャージをしました。（33,000回程度の質問に耐えられる）

こちらからリミットを決められるので、
$5でメール通知、$10をリミットにしました。

これでAWSあるあるの、「今月の請求が50万なんだけど…」の状況を避けることができます。

③プログラミング言語
HTTPのAPIを提供している為、基本的にはどの言語でも問題ないですが、
pythonとnode.jsは公式がライブラリを公開しているので、導入がちょっと楽です。

この2つの言語はいつも便利ですね。
今回はNext.js（node.js）を使用します。

導入方法

以下の流れで実装します。
①APIキーの発行 ②chatGPTのライブラリをインストール ③プログラミング

①APIキーの発行
こちらからAPIキーの発行ができます。

※APIキーの漏洩を検知したら自動で使用できなくなる（削除される）ようです。
試しにGithubにAPIキーを上げてみると、10秒くらいで使えなくなっていました。
仕事早すぎですね。

②chatGPTのライブラリをインストール
新規プロジェクトを立ち上げ、chatGPTのライブラリをインストールします。

npm install openai

③プログラミング
公式リファレンスを参考にして実装します。

以下は実際に実装した内容の一部抜粋です。

  // API_KEYをenvから取得
  const API_KEY = process.env.API_KEY;

  // aiを叩くものを作る
  const openai = new OpenAI({ apiKey: API_KEY });

  try {
    // chatGPTにデータを送る
    const gptResponse = await openai.chat.completions.create({
      model: "gpt-3.5-turbo",
      messages: [{ role: "system", content: requestData.text }],
    });

    // レスポンスの受け取り
    const gptResponseText = gptResponse.choices[0].message.content;
    return NextResponse.json({ text: gptResponseText });
  } catch (error) {
    return NextResponse.json({ text: "Error querying GPT-3.5" });
  }
}