To use the ChatGPT API in HTML, you will need to make a GET request to the API endpoint and pass in your prompt as a parameter. Here's an example HTML code that demonstrates how to use the ChatGPT API to get an answer to a given prompt:

<!DOCTYPE html>
<html>
  <head>
    <title>ChatGPT API Example</title>
  </head>
  <body>
    <h1>ChatGPT API Example</h1>
    <form>
      <label for="prompt">Prompt:</label>
      <input type="text" id="prompt" name="prompt"><br><br>
      <label for="answer">Answer:</label>
      <input type="text" id="answer" name="answer"><br><br>
      <button type="button" onclick="getAnswer()">Get Answer</button>
    </form>
    <script>
      function getAnswer() {
        var prompt = document.getElementById("prompt").value;
        var url = "https://api.openai.com/v1/engines/davinci-codex/completions?prompt=" + prompt + "&max_tokens=100";
        fetch(url, {
          headers: {
            "Content-Type": "application/json",
            "Authorization": "Bearer YOUR_API_KEY"
          }
        })
        .then(response => response.json())
        .then(data => {
          var answer = data.choices[0].text;
          document.getElementById("answer").value = answer;
        })
        .catch(error => console.error(error));
      }
    </script>
  </body>
</html>

In this example, we have a form with two textboxes - one for the prompt and one for the answer. We also have a button that, when clicked, will call the getAnswer() function.

The getAnswer() function gets the value of the prompt textbox and constructs a URL to make a GET request to the ChatGPT API endpoint. We pass in the prompt as a parameter and set max_tokens to 100 to limit the length of the response.

We then use the fetch() function to make the GET request, passing in our API key in the Authorization header. We parse the response as JSON and extract the answer from the first choice returned by the API.

Finally, we set the value of the answer textbox to the answer returned by the API. Note that you will need to replace YOUR_API_KEY with your actual ChatGPT API key.

write html for chatgpt api, pass prompt and return answer, one textbox for answer, one textbox for answer, dont use server coding like python php, using html only

原文地址: https://www.cveoy.top/t/topic/qm2 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录