JWT Automatic Renewal — Transparent Token Refresh Without User Interruption

class AutoRenewClient {
  constructor(config) {
    this.baseURL = config.baseURL;
    this.refreshEndpoint = config.refreshEndpoint || '/api/auth/refresh';
    this.tokenExpiryBuffer = config.bufferSeconds || 120; // Refresh 2min early
    this.onSessionExpired = config.onSessionExpired || (() => {});
    this.refreshPromise = null;
    this.refreshTimer = null;
    this._setupRefreshTimer();
  }

  setTokens(access, refresh) {
    this.accessToken = access;
    this.refreshToken = refresh;
    this.scheduleProactiveRefresh(access);
  }

  scheduleProactiveRefresh(token) {
    if (this.refreshTimer) clearTimeout(this.refreshTimer);

    try {
      const payload = JSON.parse(atob(token.split('.')[1]));
      const expiresAt = payload.exp * 1000;
      const now = Date.now();
      const timeToExpiry = expiresAt - now;
      const refreshAt = Math.max(
        0,
        timeToExpiry - (this.tokenExpiryBuffer * 1000)
      );

      if (timeToExpiry <= 0) {
        this.proactiveRefresh();
        return;
      }

      this.refreshTimer = setTimeout(
        () => this.proactiveRefresh(),
        refreshAt
      );
    } catch {
      // Token decode failed — refresh now
      this.proactiveRefresh();
    }
  }

  async proactiveRefresh() {
    if (this.refreshPromise) return this.refreshPromise;

    this.refreshPromise = (async () => {
      const resp = await fetch(`${this.baseURL}${this.refreshEndpoint}`, {
        method: 'POST',
        credentials: 'include',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify({ refresh_token: this.refreshToken })
      });

      if (resp.ok) {
        const data = await resp.json();
        this.accessToken = data.access_token;
        if (data.refresh_token) this.refreshToken = data.refresh_token;
        this.scheduleProactiveRefresh(data.access_token);
      }
    })();

    await this.refreshPromise;
    this.refreshPromise = null;
  }

  async fetch(path, options = {}) {
    const headers = { ...options.headers };
    if (this.accessToken) {
      headers['Authorization'] = `Bearer ${this.accessToken}`;
    }

    const resp = await fetch(`${this.baseURL}${path}`, { ...options, headers });

    if (resp.status === 401 && this.refreshToken) {
      await this.proactiveRefresh();
      headers['Authorization'] = `Bearer ${this.accessToken}`;
      return fetch(`${this.baseURL}${path}`, { ...options, headers });
    }

    return resp;
  }
}

from flask import Flask, request, jsonify, make_response
import jwt, datetime, secrets

app = Flask(__name__)
SECRET = "silent-refresh-secret"

@app.route("/api/auth/silent-refresh", methods=["POST"])
def silent_refresh():
    """Handles silent token refresh during app initialization."""
    refresh_token = request.json.get("refresh_token")
    if not refresh_token:
        return jsonify({"error": "Refresh required"}), 401

    # Validate refresh token (simplified)
    user = validate_and_get_user(refresh_token)
    if not user:
        return jsonify({"error": "Session expired"}), 401

    access_token = jwt.encode({
        "sub": user,
        "iat": datetime.datetime.utcnow(),
        "exp": datetime.datetime.utcnow() + datetime.timedelta(minutes=15),
        "jti": secrets.token_hex(16)
    }, SECRET, algorithm="HS256")

    return jsonify({
        "access_token": access_token,
        "expires_in": 900,
        "token_type": "Bearer"
    })

// On app start, attempt silent refresh
async function initializeApp() {
  const store = getRefreshTokenStore();
  const refreshToken = await store.get();

  if (refreshToken) {
    try {
      const resp = await fetch('/api/auth/silent-refresh', {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify({ refresh_token: refreshToken })
      });

      if (resp.ok) {
        const data = await resp.json();
        client.setTokens(data.access_token, refreshToken);
        return; // App is authenticated
      }
    } catch {
      // Network error — app works offline, retries later
    }
  }

  // No valid session — show login
  showLoginPage();
}

class QueuedAutoRenewClient {
  constructor() {
    this.accessToken = null;
    this.refreshToken = null;
    this.isRefreshing = false;
    this.queue = [];
  }

  async fetch(path, options = {}) {
    if (this.isRefreshing) {
      // Queue this request — it will be retried after refresh
      return new Promise((resolve, reject) => {
        this.queue.push({ resolve, reject, path, options });
      });
    }

    return this._executeWithRetry(path, options);
  }

  async _executeWithRetry(path, options, retried = false) {
    const headers = { ...options.headers };
    if (this.accessToken) {
      headers['Authorization'] = `Bearer ${this.accessToken}`;
    }

    const resp = await fetch(path, { ...options, headers });

    if (resp.status === 401 && !retried) {
      await this._refreshAndRetry();
      return this._executeWithRetry(path, options, true);
    }

    return resp;
  }

  async _refreshAndRetry() {
    this.isRefreshing = true;

    try {
      const resp = await fetch('/api/auth/refresh', {
        method: 'POST',
        credentials: 'include'
      });

      if (resp.ok) {
        const data = await resp.json();
        this.accessToken = data.access_token;
      }
    } finally {
      this.isRefreshing = false;
    }

    // Drain queue — all queued requests now have a valid token
    const queued = this.queue.splice(0);
    for (const item of queued) {
      item.resolve(this._executeWithRetry(item.path, item.options, true));
    }
  }
}