After successfully running my blog on localhost, I encountered an issue when deploying it on Vercel. The page to create a post kept returning error 504 with no additional information in the logs.
I made sure to update the NEXTAUTH_URL with the URL provided by Vercel (https).
Below is the code for the NewPostPage:
const NewPostPage = (props) => {
if (props.messageError) {
console.log("Error auth: " + props.messageError);
}
return (
<div className={classes.pageContainer}>
<NewPostForm />
</div>
);
};
export default NewPostPage
export const getServerSideProps = async (context) => {
try {
return await requireAuthentification(context, "admin", ({ session }) => {
return {
props: { session, messageError: null },
}
})
}
catch (error) {
return {
props: {
messageError: error
}
}
}
}
Here is the function used for authentication:
const requireAuthentification = async (context, levelAcces = "public", callback) => {
const session = await unstable_getServerSession(context.req, context.res, authOptions)
// rest of the function...
}
export default requireAuthentification
The issue persists despite my attempts, and debugging through logs or using GetSession has not been very helpful so far. Why is my code functioning properly on localhost but not on Vercel? How can I effectively debug my application under these circumstances?