Next.js 13 Role Based Authorization with Middleware & NextAuth

Поділитися
Вставка
  • Опубліковано 22 жов 2024

КОМЕНТАРІ • 50

  • @TuomoKankaanpaa
    @TuomoKankaanpaa  Рік тому

    To try everything Brilliant has to offer-free-for a full 30 days, visit brilliant.org/Tuomo/. The first 200 of you will get 20% off Brilliant’s annual premium subscription.

  • @AnthonyCandaele
    @AnthonyCandaele 2 місяці тому

    Thanks a lot Tuomo for this video. It's a lot clearer to me now how to implement role based authorization in Next.js. My only question is how to do this with email password authentication instead of Github authentication. Greetings, Anthony

  • @blackbeans3112
    @blackbeans3112 7 місяців тому

    Thanks for this bro, Usually the username,email,image only will store in database for the backend? and the exp date is not usually included in the frontend part when sending the data to the backend?

  • @timmywong7736
    @timmywong7736 Рік тому

    this video really help a lot for me to understand the most basic structure of Role-based access control (RBAC) of next js.
    Thank you so much!!

  • @parmetra
    @parmetra 10 місяців тому

    Hello! Could you please advise me how to set up role issuance in a production application? After all, in the video there was a rigid binding by hand.
    Maybe it should be connected to a database or something like that? Could you please answer this question or make a detailed video on this topic?
    Thanks!!!

    • @TuomoKankaanpaa
      @TuomoKankaanpaa  10 місяців тому +1

      Hello! Yeah I would probably get the information from a database in prod as u said in the example it was just hardcoded

  • @Adrian-mu8gg
    @Adrian-mu8gg Рік тому

    i am new to backend web development, i got the machinisim of how this work logically but was a bit confused. If i m correct right now the role assignment is hardcoded right? in real world, how would we handle and assign role to a user? it sounded like its going to be very complicated and required to set up admin pannel and check role from user database?

  • @saadah3573
    @saadah3573 Рік тому

    Hi
    How to add in next-intl .. because in middleware i am getting the issue.. please help me if possible

  • @sayedarifin5082
    @sayedarifin5082 Рік тому

    Sir, suppose i have 2 role in my project admin and superadmin. Now how to protect admin from superadmin and superadmin to admin

  • @wassu8499
    @wassu8499 Рік тому +1

    Sorry sir I wil watching your video very late because I am few days sick. Love from India ❤

  • @Kimitri
    @Kimitri Рік тому

    thank you so much, I didn't know that middleware should be as the same level as app folder, I was putting it in the root and it wasn't working

  • @AntNZ
    @AntNZ Рік тому +1

    Tuomo, I have my middleware file in the root of my project exactly as you have laid out in this tutorial, using next 13.2.4 and next auth ^4.22.0. If i attempt to access a page that is blocked by the middleware, I login but the callback is stuck in a loop on the same login screen. is this an issue the the version of next/next-auth?

    • @harveykay4203
      @harveykay4203 Рік тому

      I have the same problem

    • @TuomoKankaanpaa
      @TuomoKankaanpaa  Рік тому

      That's weird! Make sure you have the NEXTAUTH_SECRET and NEXTAUTH_URL correctly setup in the environment file, not sure but hopefully that helps!

  • @forcohen
    @forcohen Рік тому

    Is this middleware strategy compatible with client components or only with server components?
    Can both kinds of components coexis using this middleware strategy?

    • @TuomoKankaanpaa
      @TuomoKankaanpaa  Рік тому

      Yea you should be able to use both kind of components!

  • @havanapple2535
    @havanapple2535 Рік тому

    Love your tutes. Helped me out a few times now. Having a small issue with this one tho. Got it mostly working, but for some reason the admin pages are only blocked if I go directly to the url using the address bar... following a Link however allows me access to the protected pages. Any ideas? Im just using the standard nextjs Link components, but they appear to be ignoring the middleware.

    • @TuomoKankaanpaa
      @TuomoKankaanpaa  Рік тому

      Thanks, great to hear you have liked the videos! The problem sounds weird, does it still ignore the middleware after sev server reboot and hard refresh / clearing browser cache?

  • @painghtetaung6780
    @painghtetaung6780 Рік тому

    how can I check role base for dynamic route
    if(req.nextUrl.pathname === "/artist/[id]") {
    //do something
    }
    can I use that above code

    • @chi-mf1cx
      @chi-mf1cx Рік тому

      export const config = { matcher: ["/admin/:anything*"] };

  • @gojamoja6719
    @gojamoja6719 Рік тому +1

    thanks your english is very good can all finnish speak this well english

  • @shawn-skull
    @shawn-skull Рік тому

    The [...nextauth] file works in the app directory now.

  • @DanteMishima
    @DanteMishima Рік тому

    Would this work the same with Google?

  • @omarshehab3615
    @omarshehab3615 10 місяців тому

    There is a little problem with that approach, if of any importance to anybody. withAuth doesn't work on the Edge Network (which totally different from the browser by the way), and guess what if you don't run serverless this will be your second main option. but thanks any way

  • @AmitSoni-e5z
    @AmitSoni-e5z Рік тому

    Hello Tuomo,
    Thank you for the sharing the valuable information. Can you please share the code as well ?

    • @TuomoKankaanpaa
      @TuomoKankaanpaa  Рік тому

      Sure, it's here in the main branch: github.com/tumetus/next-js-middleware-role-auth-example

  • @saimonjt585
    @saimonjt585 Рік тому

    Thanks

  • @Squink13
    @Squink13 Рік тому

    Thanks for clarifying the api routing for next auth! I was wondering why nextauth wasn't working with my other new api routes in the app folder.
    This and your earlier nextauth for nextjs13 tutorials are the most in depth tutorials on the new app router features i've seen so far

    • @TuomoKankaanpaa
      @TuomoKankaanpaa  Рік тому

      Thank you that’s great to hear that the videos have been helpful!

  • @raphauy
    @raphauy Рік тому

    Thank you!

  • @ShayanAli-vq6iq
    @ShayanAli-vq6iq Рік тому

    Thank for this video

  • @brobruberty734
    @brobruberty734 Рік тому

    tanks for the video , can we have the source code ?

    • @TuomoKankaanpaa
      @TuomoKankaanpaa  Рік тому

      Sure, it's here in the main branch: github.com/tumetus/next-js-middleware-role-auth-example

  • @UAng-ro9kt
    @UAng-ro9kt Рік тому

    Really awsome

  • @julianbrandt9275
    @julianbrandt9275 Рік тому

    please attach link source github

    • @TuomoKankaanpaa
      @TuomoKankaanpaa  Рік тому

      Sure, it's here in the main branch: github.com/tumetus/next-js-middleware-role-auth-example

  • @Vantivify
    @Vantivify Рік тому

    It's a shame that simply having nextjs middleware is adding 100 ms overhead delay to every request of your app.....

    • @TuomoKankaanpaa
      @TuomoKankaanpaa  Рік тому

      I'm not sure if it adds that much to be honest, of course depends what kind of code is ran in the middleware

  • @sihabmolla7838
    @sihabmolla7838 9 місяців тому

    halar po hala title a ki likco ar ki dekico kisur sate kisu mill ny