unkempt smelt
I'm new to NextJS and this may be an issue with running 13.3.4 and me not understanding some nuances. But in my <Home /> component, I'm able to fetch data from a FastApi server successfully. But when I move the call to /page/api/chat/ the error response I get is an HTML page back. Specifically expected token '<', "<!DOCTYPE "... is not valid JSON. What am I missing about making external api calls?
Works:
async function handleSubmit() {
const response = await fetch("http://localhost:8006/chat", {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({ question: userInput }),
});
const data = await response.json();
if (data.error) {
setResponse(data.error);
} else {
setResponse(data.answer);
}
}```
**Doesn't work:** `/pages/index`
async function handleSubmit() {
const response = await fetch("/api/chat", {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({ question: userInput }),
});
... rest of code```
/pages/api/chat
export default async function handler(req, res) {
const response = await fetch("http://localhost:8006/chat", {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({ question: req.body.question }),
});
const data = await response.json();
if (data.error) {
console.log(data, "data");
} else {
res.status(200).json({ answer: data.answer });
}
}
onyx talon