كيف يعمل access token و refresh token معًا؟

Question

IT Interview Practice · Accepted Answer

يتبع الرمزان دورة حياة بسيطة: **access token قصير العمر** يمنح الإذن لكل استدعاء API، و**refresh token طويل العمر** يصكّ بصمت access token جديدة عند انتهائها — فيبقى المستخدم مسجّل الدخول دون إعادة إدخال بيانات الاعتماد.

## التدفق

```
┌─────────┐  1. login (user + pass)   ┌────────────┐
│ Client  │ ────────────────────────▶ │ Auth server│
│         │ ◀──── access + refresh ─── │            │
└─────────┘                            └────────────┘
     │  2. API call: Authorization: Bearer <access>
     ▼
┌────────────┐  verify signature + exp   (no DB lookup)
│ Resource   │ ──── 200 OK ────▶ (access still valid)
│ API        │ ──── 401 ───────▶ (access expired)
└────────────┘
     │  3. on 401: POST /token { refresh }
     ▼
┌────────────┐  verify + rotate
│ Auth server│ ──── new access (+ new refresh) ────▶ retry the call
└────────────┘
```

1. **Login** — يصادِق المستخدم مرة واحدة؛ يُعيد الخادم **access token** (بعمر قصير TTL) و**refresh token** (بعمر طويل TTL).
2. **الوصول إلى واجهات API** — يرسل العميل access token في `Authorization: Bearer …` في كل طلب. تتحقق منه الواجهة بلا حالة (التوقيع + `exp`) وتستجيب — دون الحاجة إلى مخزن جلسات.
3. **التجديد عند الانتهاء** — عندما تُعيد الواجهة `401` (أو يرى العميل أن `exp` قريبة)، يرسل العميل **refresh token** عبر POST إلى نقطة نهاية `/token` في خادم المصادقة ويحصل على access token جديدة، ثم يعيد الطلب الأصلي. لا يلاحظ المستخدم شيئًا.
4. **تسجيل الخروج / الإبطال** — يحذف الخادم refresh token أو يضعه في قائمة الرفض؛ يفشل التجديد التالي وتنتهي الجلسة (access token الحالي ما يزال يموت وحده خلال دقائق).

```js
// مُعترِض من جهة العميل: جدِّد مرة واحدة عند 401، ثم أعد المحاولة.
async function apiFetch(url, opts = {}) {
  let res = await fetch(url, withAuth(opts, accessToken));
  if (res.status === 401) {
    accessToken = await refreshAccessToken(refreshToken); // POST /token
    res = await fetch(url, withAuth(opts, accessToken));   // أعد المحاولة
  }
  return res;
}
```

## تدوير refresh token (rotation)

أفضل ممارسة هي **التدوير (rotation)**: كل استدعاء تجديد يُعيد refresh token *جديدًا* ويُبطل القديم. إذا قُدِّم refresh token قديم (مُستخدَم بالفعل) مرة أخرى، فهذا يشير إلى سرقة — يُبطل الخادم عائلة الرموز بأكملها ويفرض إعادة تسجيل الدخول. هذا يحدّ من ضرر refresh token المسروق.

## التخزين

- **Refresh token** ← كوكي `httpOnly` و`Secure` و`SameSite` كي لا تستطيع JavaScript (وبالتالي XSS) قراءته.
- **Access token** ← يُحفظ في ذاكرة العميل؛ عمره القصير يحدّ من التعرّض.
- لا تضع أيًّا منهما في `localStorage` إن استطعت تجنّب ذلك — فهو قابل للقراءة من أي سكربت مُحقَن.

## لماذا يهم

هذا التدفق هو العمود الفقري لإدارة الجلسات في تطبيقات SPA وتطبيقات الجوال وواجهات API الحديثة، لذا يتوقّع المحاورون منك تتبّعه من البداية للنهاية: أصدِر الرمزين عند تسجيل الدخول، وامنح الإذن بـ access token، وجدِّد بشفافية عند الانتهاء، ودوِّر وأبطل من أجل الأمان. إتقان التفاصيل — التحقق بلا حالة، والتجديد فقط عند token endpoint، والتدوير مع كشف إعادة الاستخدام، والتخزين في `httpOnly` — هو الفرق بين جلسة سلسة وآمنة وأخرى يعني فيها رمز مسروق واحد استيلاءً على الحساب طويل الأمد.

التدفق

تدوير refresh token (rotation)

التخزين

لماذا يهم

أسئلة ذات صلة