Role-based Authentication in NextJs 13 using NextAuth 

Thank you!

My pleasure!

Thanks 😄

My pleasure!

Thank you!

My pleasure!

Appreciate that.

My pleasure! Thanks for the suggestions.

I think you can do it just based the content on the role with useSession() or getServerSession()

You're welcome!

Sure thing! Can you expand on what you mean by account linking?

Okay, let's say a user is already logged, and we want to the user to link to other social media account to connect so maybe for instance we can show that social platform on their profile page. Something like that please.@@hamedbahram

Yeah that can work, we can rewrite in the `middleware` function.

NextJS redirect or router push id imagine?

That's such a good idea! I'll definitely work on it. Thanks.

Glad to hear that. I don't have a blog version of this video, but I'll write about it at some point. Password reset is a good topic. I'll have that in mind for future videos.

Yes, absolutely. You can update the user object in your DB and then update the session using the `update` function returned from the `useSession` hook.

Glad to hear that!

Watch this video => ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-fmFYH_Xu3d0.html

Absolutely! Thanks for the suggestion.

You can have the admin to assign roles, or an onboarding flow where the user selects the role.

@@hamedbahram my question is, nextauth handles role based auth so is there a way when we are using nextauth for registering like Google or email providers, at that time we can assign or user can select role?

Good question! you can pass the `middleware` function to the `withAuth` function to run the next middleware. I'll create a video on this combining the `next-auth` middleware and the i18n middleware together this coming week.

Looking forward for the next video@@hamedbahram. Btw anyway to run a middleware before the auth in withAuth? cause If you run the middleware inside withAuth it will run after it, if I am not mistaken.

@@nomadmack That's right it would run after the `authorize` callback. I'll look into that for the video.

@@hamedbahram This would be awesome! I'm looking forward to see this video. 😊

@@fluFFPfizschi Absolutely!

Sure, I'll have that in mind for future videos.

That'll make a good example usecase. Is it that the user can change their own roles, or and admin changes someone else's role?

@@hamedbahram The issue is that once the token gets issued I (as an administrator) can't change the user's role. Well I can, but just because it's changed in the database doesn't mean it's affecting the user because they still have their old token. The obvious issue is that I as an admin can't deauthorize an user on demand. This usually gets solved by providing a "refresher token" along with the jwt token but there is 0 documentation on authjs regarding how to implement refresher tokens with credentials provider. So right now every time a user makes a request I query the database and check their role. Imagine 500k users opening 10-20 pages per minute and what kind of db server load that would create. I can't even schedule the db calls to be let's say once every 5 minutes because NextJS is serverless so it doesn't support it.

That's also a viable solution. Just keep in mind that you can redirect the user to the same page from the middleware. The benefit of the middleware is that it runs on the edge before the request is completed.

You have to pass the headers to your fetch request. First get the `header` from `next/headers` then pass it to your fetch request like: ``` fetch(endpoint, { method: "GET", headers: headers() } ```

@@hamedbahram Thanks ! It worked.

For sure, that a good idea! welcome to the channel.

@@hamedbahram waiting for video. I means waiting for a world best front-end development roadmap video. Best of luck hamed ❤️🇧🇩

@@thisishabib744 Thanks! I'll try 🤓

You can use the `headers` or `cookies` function from `next/headers`

@@hamedbahram Please make video on ecommerce with Laravel and Nextjs, I do can not find any video about this on youtube.

You have to update the `NEXTAUTH_URL` env variable and set it to the url you're using to share you project.

@@hamedbahram Thank you very much. It worked. I thought it should change only when in production. Thanks again. Have a good day. And wish you a fortune.

@@KSalvatore Glad to hear that!

That's exactly what I explained in the video.

​​@@hamedbahram 6:46 your saying : "if there is a role on the user object", google does not provide a role property. The only reason you add in your db is because of the Nullish coalescing Then you changed the role manually in the Mongo db to admin. What everyone wants in is this, this will be the ideal case : This is what I'm thinking to implement When signing up using Google, by default it'll be user or admin role (depends on your application) then using a token in the callback url, decode the token in the signin callback and get the role from a token stored table which has the role column, using this update the user table. I don't know if my approach is correct though, couldn't find much resources online to tackle my problem

That's right! However the user might still try to manually access the `admin` route.