I tried following a tutorial to implement functionality in T, but I am facing issues with getting a response from the API. I am unsure if there has been an update to the OpenAI API that is causing this problem.
Any assistance would be greatly appreciated.
Error
http://localhost:3000/api/chat-gpt net::ERR_ABORTED 500 (Internal Server Error)
onClick @ page.tsx:13
Show 14 more frames
/app/(main)/page.tsx
'use client'
import React from 'react';
import Navbar from './_components/navbar';
const HomePage = () => {
return (
<div className="w-full min-h-full">
<Navbar />
<div className="flex flex-col justify-center">
<h1 className="text-4xl">Welcome to Mood Palette</h1>
<button
onClick={async () => {
const response = await fetch('/api/chat-gpt', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
message: 'Hello, World!',
}),
});
console.log("Response", response);
}}
>
Create Palette
</button>
</div>
</div>
);
}
export default HomePage;
/app/api/route.ts
import { NextRequest, NextResponse } from "next/server";
import OpenAI from "openai";
const openai = new OpenAI({
apiKey: `Bearer ${process.env.OPENAI_API_KEY}`,
project: 'project_id',
});
export async function POST(request: Request) {
const response = await openai.chat.completions.create({
model: "gpt-3.5-turbo",
messages: [
{ role: "system", content: "You are Jarvis from Iron Manl" },
{ role: "user", content: "Who are you?"}
],
temperature: 0,
max_tokens: 1024,
top_p: 1,
frequency_penalty: 0,
presence_penalty: 0
});
return NextResponse.json(response);
}
After following the OpenAI documentation 'getting started' and a tutorial, I encountered issues with the API not responding properly. Any tips on troubleshooting would be helpful.