SPA'da access token ve refresh token nerede saklanmalıdır? Refresh token rotation nasıl çalışır?

Önerilen yaklaşım: access token kısa ömürlü (5-15 dk) olur ve bellekte (JS değişkeni) tutulur; refresh token ise `HttpOnly`, `Secure`, `SameSite` cookie içinde saklanır ve her kullanımda yenilenir (rotation). En güvenli seçenek ise token'ları hiç tarayıcıya vermeyip bir BFF ile session cookie kullanmaktır.

Saklama seçenekleri

XSS varsa saldırgan token'ı okuyamasa bile kullanıcının adına istek atabilir; yani hiçbir saklama yeri XSS'i tamamen telafi etmez.

Refresh token rotation

1. Login sonrası sunucu access token'ı yanıt gövdesinde, refresh token'ı cookie'de döner.
2. Access token süresi dolunca frontend POST /auth/refresh çağırır; cookie otomatik gönderilir.
3. Sunucu refresh token'ı doğrular, eskisini geçersiz kılar, yeni bir access + refresh çifti üretir.
4. Reuse detection: daha önce kullanılmış bir refresh token tekrar gelirse token çalınmış demektir; o token ailesinin tamamı iptal edilir ve kullanıcı yeniden giriş yapmak zorunda kalır.

// Frontend: 401 alınca bir kez refresh edip isteği tekrarla
async function api(url, opts = {}) {
  let res = await fetch(url, { ...opts, headers: { Authorization: `Bearer ${accessToken}` } });
  if (res.status === 401) {
    const r = await fetch("/auth/refresh", { method: "POST", credentials: "include" });
    if (!r.ok) return redirectToLogin();
    accessToken = (await r.json()).accessToken;
    res = await fetch(url, { ...opts, headers: { Authorization: `Bearer ${accessToken}` } });
  }
  return res;
}

Aynı anda birden fazla istek 401 alırsa tek bir refresh promise'i paylaşılmalıdır; aksi halde rotation, ikinci refresh isteğini "reuse" sanıp oturumu kapatır.