ساده ترین روش پیاده سازی رفرش توکن در ریاکت: احراز هویت و refresh token

برای امنیت بیشتر و جلوگیری از دسترسی غیر مجاز به اطلاعات و حساب کاربر، بازه زمانی که accessToken اعتبار داره رو ما کم میکنیم (مثلا ۱ دقیقه) و اینطوری بعد گذشتن این تایم کوتاه توکن باطل میشه و ما باید اونو رفرش کنیم تا یه توکن جدید بگیریم (که اونم ۱ دقیقه اعتبار داشته باشه و ...

فرایند رفرش شدن نیاز داره به یه توکنی نام refresh token، رو کاغذ و وقتی تو ذهنمون درباره‌ش فکر میکنیم خیلی ساده به نظر میاد. "هروقت توکن باطل شد یه درخواست بزن توکن جدید بگیر" ولی پیاده سازی این موضوع خیلی پیچیدگی های دیگه‌ای داره. مخصوصا وقتی ما اپلیکیشین تحت وب داریم و از ابزار ری اکت یا فریمورک های نکست و ریمیکس استفاده میکنیم.

چون تو react ممکنه چندتا کامپوننت همزمان بیان رو صفحه و هرکدوم ممکنه بخوان همزمان یه دیتای متفاوت رو بگیرن ممکنه چندبار این درخواست رفرش شدن توکن به سمت سرور ارسال بشه و اینجا ما race condition داریم و این باعث میشه این عملیات به مشکل بخوره و اپلیکیشن ما درست کار نکنه.

تو این ویدیو ما درباره اینکه یه بک‌اند درست باید چه شرایطی داشته باشه صحبت میکنیم و بعدش refresh token rotation و race condition و tab election و memoization صحبت میکنیم، این موارد و توضیح میدیم

اگر دوست دارید بیشتر درباره کوکی httpOnly بدونید این ویدیو رو ببینید

   • امنیت سایت و توکن دزدی: پیاده سازی سی...  

اگر دوست دارید بیشتر درباره memoization بدونید میتونید این مقاله رو بخونید

https://react.ir/p/memo

لینک گیتهاب پروژه رو به زودی میزارم اینجا (کدش یکم نیاز به تمیز کاری و کامنت گذاری داره)

00:00 - مقدمه
00:30 - رفرش توکن چیه و چرا؟
03:20 - پیاده سازی اشتباه در بک‌اند
05:05 - رفرش توکن یکبار مصرف
05:18 - پراپرتی path در کوکی برای رفرش توکن
06:47 - توضیحات درباره سیتسم لاگین اپ
08:54 - بررسی وضعیت expire توکن
10:38 - پیاده سازی سیستم لاگین
11:45 - پیاده سازی client برای گرفتن دیتا
13:10 - پیاده سازی isTokenExpired
13:58 - توضیحات refresh token
16:22 - پیاده سازی refresh token
17:39 - اگر رفرش توکم باطل شده بود چی؟
19:25 - مشکل race condition
20:58 - توضیحات race condition
22:20 - memoization
24:55 - حل مشکل race condition برای رفرش توکن
27:10 - race condition در چند تب
28:23 - tab election و broadcast channel
30:46 - جمع بندی و پایان


Website: https://react.ir
Twitter:   / react_ir  
Instagram:   / react_ir  
Telegram: https://t.me/react_ir

Personal Twitter:   / nima_arf  
Personal Instagram:   / nima_arf  
Personal Github: https://github.com/nimaa77