So basically i created a website that connects with chatgpt and answers but when I type a question into input chat nothing shows. In the console there are 2 errors that show up: Failed to load resource: the server responded with a status of 404 () and Uncaught ReferenceError: ChatGPT is not defined how do I fix it (my url is good and I collected API key from the openai website while being on free trial(im still now on it) also my vpn is temporally turned off)
code:
<html>
<head>
<title>ChatGPT Website</title>
</head>
<body>
<h1>ChatGPT Website</h1>
<p>Ask me a question and I'll do my best to answer!</p>
<div id="chatbox">
<form id="chatform">
<input type="text" id="chatinput" placeholder="Type your message here..." />
<button type="submit">Send</button>
</form>
</div>
<!-- Import the ChatGPT library -->
<script src="https://cdn.openai.com/chatgpt/latest/chatgpt.min.js%22%3E</script>
<script>
// Initialize the ChatGPT model
const chatgpt = new ChatGPT('my api key');
chatgpt.init().then(() => {
console.log("ChatGPT is ready!");
});
// Get the chatform and chatinput elements
const chatform = document.getElementById("chatform");
const chatinput = document.getElementById("chatinput");
// Add an event listener to the chatform to handle messages
chatform.addEventListener("submit", (event) => {
// Prevent the form from refreshing the page
event.preventDefault();
// Get the message from the input field
const message = chatinput.value;
// Clear the input field
chatinput.value = "";
// Use the ChatGPT model to generate a response
chatgpt.chat(message).then((response) => {
// Print the ChatGPT's response to the page
document.body.innerHTML += <p>${response}</p>;
});
});
</script>
</body>
</html>
website should basically have a small input chat