Route Guarding with nextjs

How do you implement route guarding with nextjs? Not too sure what would be the recommended way to do it. Basically what I is use a context provider then “useeffect“ my way into route guarding Context: Firebase for backend and auth
N
Neto323d ago
middleware or something like get server side props
M
matdexir323d ago
Can you show me a minimal example?
G
Glenn323d ago
I did it with getServerSideProps as well, will send in an example asap
export async function getServerSideProps(context: GetServerSidePropsContext) {
const session = await getServerAuthSession(context);
if (!session) {
return {
redirect: {
destination: "/auth/signin",
},
};
}

if (!session.user.configured) {
return {
redirect: {
destination: "/app/getting-started",
},
};
}

return { props: {} };
}
export async function getServerSideProps(context: GetServerSidePropsContext) {
const session = await getServerAuthSession(context);
if (!session) {
return {
redirect: {
destination: "/auth/signin",
},
};
}

if (!session.user.configured) {
return {
redirect: {
destination: "/app/getting-started",
},
};
}

return { props: {} };
}
Dunno if that's the right way to do it But it works
M
matdexir323d ago
Thanks for sharing! Where should I put this? Also does it route guard any of the possible paths? Ex: say I have path /A, /B, /Login. My expectations would be that if you go to /A or /B you get redirected to /Login and also if you go to /doesnotexist you also get redirected to /Login
G
Glenn323d ago
Same file as the Page Components you create Just like you do it all the time with getServerSideProps
M
matdexir323d ago
Want results from more Discord servers?
Add your server
More Posts
the URL must start with the protocol `mongo`I have been geting this error recently, and I have no idea why. my mongodb DATABASE_URL is without "Read and Write in Next Js Is not working in production (vercel)this code is working in local environment but not working in production can anyone tell me how to reDesperate for help with Trpc resolver.How can i get resolve({ default: base64Data }); to only trigger once trpc has returned success or fuseRouter queryHow do y'all handle typescript with nextjs's query params? Currently I'm doing ```const cartId = quPassword hashing on EDGE?I'm making an app and noticing that vercel's serverless functions are taking very much time to complAuth.js Muti-device SupportI'm implementing auth right now in a site that the user will likely be switching from mobile to deskNextJS should I use a headless CMS?Hello I am working on a project that is a multi user blog where anyone can create a post and commenHow to define this exact relation on prismaGiven this two models, how could I implement a relation between them, where a duel has 2 user Ids inHow much do y'all charge for your apps?I have created two complete custom apps for clients, took 40-60 hours a piece. Just curious how y'aDrizzle client side vs server side?hi can someone help explain to me a bit about drizzle? as far as i can tell, its doing client side at3-turbo + next-i18n + tRPC doesn't work on Vercel only locallyHi. I tried to implement server side localisation in tRPC according to this article https://levelupAnyone have an exampe of two nextjs applications in a single repo?Basically I want to have a website for the customer facing site and another for the admin portal to Recommendations for validation library?in t3 docs under other recommendations section, there is no validation library there https://createsuperplanet conection fails in production modeI need help with next auth / planetscale connection. my app works fine in localhost but does not conQuestion about next auth.Hey all, The stack and full stack development in javascript in general is new for me. I finding my Why does `npm create t3-app@latest` use the /pages directory. How can I use the app router?I want to build an application which uses the latest nextjs app router, however the `create t3-app@lnextjs13 do get request with searchbarHi, I am currently building a nextjs 13 project, trying to get in touch with the app router and servHow to sent a mutation procedure from the clientupdateUserStats:protectedProcedure .input(z.object({ id:z.string().nonempty(), pServer Actions high level questions (scale, request library, exposing to other clients)**1) how are you supposed to scale a backend if your business logic is in react components?** if thiupload thing jesthow to i set up testing with jest on components that include uploadthing? [2:40 PM] seems like it ke