1. Tubelator AI
  2. >
  3. Videos
  4. >
  5. People & Blogs
  6. >
  7. Understanding and Implementing Next.js Middleware for Route Protection

Understanding and Implementing Next.js Middleware for Route Protection

Available In Following Subtitles
Persian
Variant 1 Variant 2
Posted on:
Video by: Code Ryan
Learn about the core Next.js fundamental of using middleware for route protection. Discover how to restrict access to certain paths based on user authentication status and redirect them accordingly. Gain insights into implementing isAuthenticated middleware and leverage nextResponse.next for seamless request handling.
tubelator logo

Instantly generate YouTube summary, transcript and subtitles!

chrome-icon Install Tubelator On Chrome

Video Summary & Chapters

No chapters for this video generated yet.

Video Transcript

0:00
یک پایه اصلی در Next.js استفاده از تغییر مسیر در یک فایل middleware است.
0:05
و یکی از دلایلی که ممکن است بخواهید این کار را انجام دهید این است که به سادگی از مسیرها محافظت کنید.
0:11
این بدان معنی است که اگر یک کاربر معتبر باشد، پس از آن آنها می توانند به مسیرهای مختلف در برنامه شما دسترسی پیدا کنند.
0:17
اما اگر آنها تأیید نشده اند، ممکن است بخواهید آنها را به یک صفحه ورود بازگردانید، مانند آنچه که ما در اینجا داریم.
0:22
به عنوان مثال اگر من سعی می کنم به صفحه Dashboard بروم و سپس اینجا را فشار دهید وارد کنید.
0:29
شما می بینید که من فقط به صفحه ورود ارسال می شود. من واقعا نمی توانم به
0:33
دسترسی به صفحه dashboard و دلیل این است که در middleware.js ما
0:39
فایل که در ریشه دایرکتوری ما در اینجا است بنابراین آن را در ما نیست
0:44
اپلیکیشن دایرکتوری
0:44
این در ریشه پروژه ما در همان سطح است که JSON config، package.json، بنابراین
0:51
در ادامه و به همین ترتیب.
0:51
ما این middleware.js را داریم و اساسا ما نوع خنده دار، خوب، isAuthenticated جعلی است.
0:57
اگر تصدیق شوند، خوب است.
0:59
فقط از nextResponse.next استفاده کنید و ما nextResponse را از nextServer وارد می کنیم.
1:03
فقط با درخواست خود ادامه دهید.
1:06
آنها معتبر هستند بنابراین شما می توانید به این صفحه دسترسی پیدا کنید.
1:09
دیگر، اگر آنها تأیید نشده اند، بنابراین شما این را وارد نمی کنید اگر بلوک،
1:13
سپس آنها را به صفحه login هدایت کنید.
1:15
بنابراین ما فقط از پاسخ بعدی استفاده می کنیم.
1:17
ما روش نقطه را به شیوه پاسخ بعدی می نامیم.
1:22
و سپس در اینجا ما یک URL جدید را با خواندن این ویژگی جدید URL که ما برای
1:27
آزاد در این
1:29
و سپس ما از نام مسیر و همچنین URL پایه عبور می کنیم.
1:34
که آنها را به LOCOS3000 منتقل می کند.
1:38
و سپس ما اطمینان حاصل می کنیم که این کار را انجام می دهیم هنگامی که آنها سعی می کنند به صفحه dashboard دسترسی پیدا کنند.
1:42
بنابراین اگر شما صفحات دیگری دارید که می خواهید محافظت کنید،
1:45
البته شما می توانید آنها را به این سازگاری پیکربندی زیر اضافه کنید.
1:49
بنابراین فقط برای نشان دادن دوباره، اگر ما
1:51
برای دسترسی به dashboard، من فقط به سمت راست به صفحه ورود هدایت شده است. اما اگر من این را به درست،
2:00
بنابراین در حال حاضر ما نوع خنده دار هستیم، خوب کاربر وارد شده است و در حال حاضر آنها سعی می کنند به دسکتاپ دسترسی داشته باشند،
2:06
در واقع می توانند به آن دسترسی پیدا کنند، زیرا آنها معتبر هستند.
2:10
این بدان معنی است که ما فقط نوعی وارد این اگر بلاک و ما ادامه می دهیم.
2:13
شما به عنوان کاربر می خواهید به جای هدایت آنها.
2:16
بنابراین یک راه حل ساده و سریع در Next.js این است که اگر شما می خواهید برای محافظت از
2:21
مسیرهای خود را یا اگر شما می خواهید در میان نرم افزار خود را تغییر دهید، شما می توانید از موارد زیر استفاده کنید.
2:27
پاسخ، وارد کردن آن از سرور بعدی و تماس با روش تغییر مسیر بر روی آن، عبور
2:32
راه جدیدی است که آنها
2:35
باید کاربر را دوباره هدایت کنید. و سپس اگر شما نوعی از مسیرهای محافظت با
2:40
فقط اطمینان حاصل کنید که شما یک پیکربندی را با یک خواص مطابقت که تعریف می کند
2:46
راه های مختلف که شما می خواهید این middleware را اجرا کنید یا که شما می خواهید آن را
2:51
برای محافظت. بنابراین بسیار سریع یکی در اینجا اما امیدوارم کمک کند. امیدوارم شما یاد گرفتید
2:55
چیزی هست و من در قسمت بعدی شما را می بینم.

Video Summary & Chapters

No chapters for this video generated yet.

Video Transcript

0:00
یک پایه اصلی در Next.js استفاده از تغییر مسیر در یک فایل middleware است.
0:05
و یکی از دلایلی که ممکن است بخواهید این کار را انجام دهید این است که به سادگی از مسیرها محافظت کنید.
0:11
این بدان معنی است که اگر یک کاربر معتبر باشد، پس از آن آنها می توانند به مسیرهای مختلف در برنامه شما دسترسی پیدا کنند.
0:17
اما اگر آنها تأیید نشده اند، ممکن است بخواهید آنها را به یک صفحه ورود بازگردانید، مانند آنچه که ما در اینجا داریم.
0:22
به عنوان مثال اگر من سعی می کنم به صفحه Dashboard بروم و سپس اینجا را فشار دهید وارد کنید.
0:29
شما می بینید که من فقط به صفحه ورود ارسال می شود. من واقعا نمی توانم به
0:33
دسترسی به صفحه dashboard و دلیل این است که در middleware.js ما
0:39
فایل که در ریشه دایرکتوری ما در اینجا است بنابراین آن را در ما نیست
0:44
اپلیکیشن دایرکتوری
0:44
این در ریشه پروژه ما در همان سطح است که JSON config، package.json، بنابراین
0:51
در ادامه و به همین ترتیب.
0:51
ما این middleware.js را داریم و اساسا ما نوع خنده دار، خوب، isAuthenticated جعلی است.
0:57
اگر تصدیق شوند، خوب است.
0:59
فقط از nextResponse.next استفاده کنید و ما nextResponse را از nextServer وارد می کنیم.
1:03
فقط با درخواست خود ادامه دهید.
1:06
آنها معتبر هستند بنابراین شما می توانید به این صفحه دسترسی پیدا کنید.
1:09
دیگر، اگر آنها تأیید نشده اند، بنابراین شما این را وارد نمی کنید اگر بلوک،
1:13
سپس آنها را به صفحه login هدایت کنید.
1:15
بنابراین ما فقط از پاسخ بعدی استفاده می کنیم.
1:17
ما روش نقطه را به شیوه پاسخ بعدی می نامیم.
1:22
و سپس در اینجا ما یک URL جدید را با خواندن این ویژگی جدید URL که ما برای
1:27
آزاد در این
1:29
و سپس ما از نام مسیر و همچنین URL پایه عبور می کنیم.
1:34
که آنها را به LOCOS3000 منتقل می کند.
1:38
و سپس ما اطمینان حاصل می کنیم که این کار را انجام می دهیم هنگامی که آنها سعی می کنند به صفحه dashboard دسترسی پیدا کنند.
1:42
بنابراین اگر شما صفحات دیگری دارید که می خواهید محافظت کنید،
1:45
البته شما می توانید آنها را به این سازگاری پیکربندی زیر اضافه کنید.
1:49
بنابراین فقط برای نشان دادن دوباره، اگر ما
1:51
برای دسترسی به dashboard، من فقط به سمت راست به صفحه ورود هدایت شده است. اما اگر من این را به درست،
2:00
بنابراین در حال حاضر ما نوع خنده دار هستیم، خوب کاربر وارد شده است و در حال حاضر آنها سعی می کنند به دسکتاپ دسترسی داشته باشند،
2:06
در واقع می توانند به آن دسترسی پیدا کنند، زیرا آنها معتبر هستند.
2:10
این بدان معنی است که ما فقط نوعی وارد این اگر بلاک و ما ادامه می دهیم.
2:13
شما به عنوان کاربر می خواهید به جای هدایت آنها.
2:16
بنابراین یک راه حل ساده و سریع در Next.js این است که اگر شما می خواهید برای محافظت از
2:21
مسیرهای خود را یا اگر شما می خواهید در میان نرم افزار خود را تغییر دهید، شما می توانید از موارد زیر استفاده کنید.
2:27
پاسخ، وارد کردن آن از سرور بعدی و تماس با روش تغییر مسیر بر روی آن، عبور
2:32
راه جدیدی است که آنها
2:35
باید کاربر را دوباره هدایت کنید. و سپس اگر شما نوعی از مسیرهای محافظت با
2:40
فقط اطمینان حاصل کنید که شما یک پیکربندی را با یک خواص مطابقت که تعریف می کند
2:46
راه های مختلف که شما می خواهید این middleware را اجرا کنید یا که شما می خواهید آن را
2:51
برای محافظت. بنابراین بسیار سریع یکی در اینجا اما امیدوارم کمک کند. امیدوارم شما یاد گرفتید
2:55
چیزی هست و من در قسمت بعدی شما را می بینم.
shape-icon

Download extension to view full transcript.

chrome-icon Install Tubelator On Chrome

YouTube First AI Assistant

chrome-icon Install On Chrome

AI Art For This Video No image generated for this video yet but here is the example.

ai art
0:09
Prompt
spider man in aladdin style, bright colors, hyper quality, high detail, high resolution, --video --s 750 --v 6. 0 --ar 1:2
ai images

Explore more in People & Blogs