I've been working on a project involving authentication using Django backend and Next.js frontend. For state management, I'm utilizing Redux Toolkit. However, I've encountered an issue with the Next.js API that communicates data to the backend. Here are the actions defined in auth.js that send data to the API:
export const login = (email, password) => async dispatch => {
const body = JSON.stringify({
email,
password
});
// alert(`body is ${body}`) //This alert is showing data hence it`s working
dispatch({
type: SET_AUTH_LOADING
});
try {
const res = await fetch('/auth/login/api', {
method: 'POST',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json'
},
body: body
});
} catch (error) {
}
}
Next, here's the API route responsible for interacting with the backend:
export async function POST(request) {
const res = await request.body;
console.log (`Response is ${res}`)
const { email, password } = await request.body;
const body = JSON.stringify({
email,
password
});
console.log(`Posted data is: ${body}`)
return NextResponse.json({ res })
}
The first console.log displays Response is [object Object], followed by the second console.log displaying Posted data is: {}. I am struggling to identify the root cause behind this discrepancy despite the API route being invoked.
Any assistance would be greatly appreciated.