バニラJavaScriptでChat-GPT APIを実装する方法

Apr 22 2023
ChatGPT API をバニラ JavaScript で実装するには、次の手順に従います。 API 応答を処理する: API 呼び出しを行ったら、`.then()` メソッドで応答を処理できます。

ChatGPT API をバニラ JavaScript で実装するには、次の手順に従います。

  1. API キーの登録: ChatGPT API にアクセスするには、API キーを登録する必要があります。API キーは、OpenAI Web サイトで API にサインアップすることで取得できます。

const prompt = 'Hello, how are you?';
      const maxTokens = 2000;
      const model = 'text-davinci-003';
      const user = '1';
      const temperature = 0.5;
      const frequencyPenalty = 0.0;
      const apiKey = 'YOUR_API_KEY';

      const response = await fetch('https://api.openai.com/v1/completions', {
        method: 'POST',
        headers: {
          'Content-Type': 'application/json',
          Authorization: `Bearer ${apiKey}`,
        },
        body: JSON.stringify({
          prompt,
          max_tokens: maxTokens,
          model,
          user,
          temperature,
          frequency_penalty: frequencyPenalty,
        }),
      });
      const data = await response.json();
      console.log(data.choices[0].text);

API 応答を処理する: API 呼び出しを行ったら、`.then()` メソッドで応答を処理できます。上の例では、生成された応答をコンソールに記録しています。これを変更して、チャット インターフェイスに応答を表示することができます。