I tried using the OpenAI API to use ChatGPT on my own webpage, however I'm getting a 405 error

This is the HTML/JavaScript code I’m using.

<!DOCTYPE html>
<html>
<head>
    <title>GPT-3 Test</title>
    <script>
        async function submitPrompt(event) {
            event.preventDefault();
            console.log("submitPrompt function called");

            // Get the value of the input field
            var prompt = document.getElementById("prompt").value;

            // Make a request to the GPT-3 API
            const response = await fetch("https://api.openai.com/v1/models/text-davinci-003", {
                method: "POST",
                headers: {
                    "Content-Type": "application/json",
                    "Authorization": "Bearer KEY-PLACEHOLDER"
                },
                body: JSON.stringify({
                    "model": "text-davinci-003",
                    "prompt": prompt,
                    "max_tokens": 256
                })
            });
            const responseJson = await response.json();

            // Display the response on the page
            document.getElementById("response").innerHTML = responseJson.choices[0].text;
        }
    </script>
</head>
  <body>
    <form>
      <label for="prompt">Enter your prompt:</label><br>
      <input type="text" id="prompt" name="prompt"><br>
      <button type="submit" onclick="submitPrompt(event)">Submit</button>
    </form> 
    <br>
    <div id="response"></div>
  </body>
</html>

When I open the locally saved page in my browser, fill something in the form and press the submit button, the console gives me a 405 error code. Anyone know what I’m doing wrong?

1 Like

Wrong / old URL, I think?

post https://api.openai.com/v1/completions

Hope this helps. Welcome to the community…Hope you stick around!