Recently, I've been attempting to develop a frontend using nextjs that communicates with a Java backend. To achieve this, I'm utilizing the npm package next-http-proxy-middleware. However, it seems like either my request body is getting lost in transit or I might be misusing the package.
Included below is the entirety of my ./src/api/[...all].ts file:
import type { NextApiRequest, NextApiResponse } from 'next'
import httpProxyMiddleware from 'next-http-proxy-middleware'
type Data = {
name: string
}
export const config = {
api: {
externalResolver: true,
},
}
export default (req: NextApiRequest, res: NextApiResponse) => {
httpProxyMiddleware(req, res, {
target: `http://${process.env.REACT_APP_URL}`,
changeOrigin: true,
})
}Additionally, here is a snippet of code related to my login attempt, where the data is collected using react-hook-form:
const onSubmit: SubmitHandler<Inputs> = async (data: any) => {
//console.log('username', watch('username'), 'password', watch('password'))
const response = await axios.post(
'/api/session',
new URLSearchParams({
email: data.username,
password: data.password,
})
})Even though the connection to my backend is successful, as indicated by errors originating from my Java program and not next.js, I am encountering an issue where the email address seems to become null during the process:
"Cannot invoke \"String.trim()\" because \"email\" is null - NullPointerException (DataManager:149 < PermissionsManager:508 < SessionResource:111 < ...)"
Although I can get it to function properly with vanilla react, there seems to be something amiss with how I have set up the next-http-proxy-middleware implementation. Despite my efforts, I haven't been able to resolve this concern yet. Any assistance would be greatly appreciated, thank you!