Recently, I've been working with Next.js and utilizing the next-connect library to manage middlewares in my project.
However, I'm encountering some difficulties when it comes to handling errors while using multiple middlewares within the getServerSideProps function.
The code snippet below showcases how I have set up my middleware handler within getServerSideProps. The goal is for each middleware to execute successfully, retrieve user data upon authentication, but if any middleware fails, an error should be caught and a redirect to the '/login' page should occur:
import nextConnect from 'next-connect';
import { openDBConnection, retrieveUserInfo } from '@/middlewares/database';
import { verifySessionCookie } from '@/middlewares/firebaseSession';
...
export const getServerSideProps = async ({ req, res }) => {
const handler = nextConnect()
.use(verifySessionCookie)
.use(openDBConnection)
.use(retrieveUserInfo);
try {
await handler.run(req, res);
return {
props: {
user: req.user,
},
};
} catch (e) {
console.log(e);
return {
redirect: {
destination: '/login',
permanent: false,
}
};
}
}
Although no try/catch blocks are defined within the individual middlewares, any errors that arise should ideally be handled within the api pages or the main getServerSideProps block.
Initially, everything worked fine with just one middleware (verifySessionCookie). Errors were properly caught when calling await handler.run(req, res) and handled in the catch block. However, the issue arises when incorporating all 3 middlewares as displayed in the code snippet. If the first middleware (verifySessionCookie) encounters an error, it does not trigger the catch block.
I've attempted implementing a next() call in each middleware, along with a finally clause, which did allow for error handling within getServerSideProps. Unfortunately, scenarios where one middleware fails, causing subsequent ones to not execute as intended, remain problematic.
- verifySessionCookie executes and fails.
- openDBConnection executes without issues.
- retrieveUserInfo executes and fails.
At this point, I'm uncertain whether I'm making mistakes in my approach or if next-connect isn't designed for this specific use case. Perhaps resorting to individual asynchronous functions with (req, res) parameters directly inside getServerSideProps could be a viable alternative, rather than relying on the next-connect plugin.