Whenever I attempt to retrieve the body from the new
export async function POST( req: Request)api/auth/signup
See folder layout image
export async function POST( req: NextRequest ) {
//Send success response
console.log( req.body );
return new Response( req.body, {
status: 200,
});
}
The handler where I'm sending this data from is here
function handleSubmit( event: FormEvent<HTMLFormElement> ) {
event.preventDefault();
//form validation code here
console.log( "Sent the request to the server" );
fetch( "http://localhost:3000/api/auth/signup", {
method : "POST",
headers:{
"Content-Type": "application/json",
},
body: JSON.stringify({
username: username,
password: password,
email : email,
}),
next: { revalidate: 0 },
})
.then( res => res.json())
.then( data => console.log( data.username, data.password, data.email ));
}
At the end of this handler, I am able to display the values sent to the server. However, when trying to access them in the server's req.body, I receive a readable stream which does not contain the expected properties. View readable stream from body image
The app directory is experimental, but I'm struggling with a seemingly simple feature that just doesn't seem to work. It feels like a personal issue (as is 99.9% of programming :D)
This is all happening via http / localhost, could this be causing any problems?
I've attempted to find solutions, but it appears others are facing the same dilemma.