245 lines
6.7 KiB
Plaintext
245 lines
6.7 KiB
Plaintext
import React, { createContext, useContext, useEffect, useMemo, useRef, useState } from "react";
|
|
import { clearAuth, guessUsernameFromToken, jwtExpSeconds, loadAuth, saveAuth } from "./authStorage";
|
|
|
|
const AuthCtx = createContext(null);
|
|
|
|
function apiBase() {
|
|
// même domaine par défaut
|
|
return (import.meta?.env?.VITE_API_BASE_URL || "").replace(/\/+$/, "");
|
|
}
|
|
|
|
async function apiFetch(path, opts = {}) {
|
|
const url = apiBase() + path;
|
|
const res = await fetch(url, {
|
|
...opts,
|
|
headers: {
|
|
"Content-Type": "application/json",
|
|
...(opts.headers || {}),
|
|
},
|
|
});
|
|
return res;
|
|
}
|
|
|
|
async function whoami(accessToken) {
|
|
const res = await apiFetch("/api/whoami", {
|
|
method: "GET",
|
|
headers: accessToken ? { Authorization: `Bearer ${accessToken}` } : {},
|
|
});
|
|
const j = await res.json().catch(() => null);
|
|
return { ok: res.ok, status: res.status, json: j };
|
|
}
|
|
|
|
async function refreshTokens(refreshToken) {
|
|
const res = await apiFetch("/api/refresh", {
|
|
method: "POST",
|
|
body: JSON.stringify({ refresh_token: refreshToken }),
|
|
});
|
|
const j = await res.json().catch(() => null);
|
|
return { ok: res.ok, status: res.status, json: j };
|
|
}
|
|
|
|
function nowSec() {
|
|
return Math.floor(Date.now() / 1000);
|
|
}
|
|
|
|
export function AuthProvider({ children }) {
|
|
const [status, setStatus] = useState("loading"); // loading | anon | auth
|
|
const [user, setUser] = useState(null); // { username }
|
|
const [tokens, setTokens] = useState(null); // { access_token, refresh_token, ... }
|
|
const [error, setError] = useState("");
|
|
const refreshTimer = useRef(null);
|
|
|
|
function setAnon(msg = "") {
|
|
setStatus("anon");
|
|
setUser(null);
|
|
setTokens(null);
|
|
setError(msg || "");
|
|
clearAuth();
|
|
}
|
|
|
|
function setAuthFromTokens(t, usernameGuess = "") {
|
|
setTokens(t);
|
|
saveAuth({ ...t, obtained_at: Date.now() });
|
|
const u = usernameGuess || guessUsernameFromToken(t?.access_token) || "";
|
|
setUser(u ? { username: u } : null);
|
|
setStatus("auth");
|
|
setError("");
|
|
}
|
|
|
|
async function ensureFreshSession(existing) {
|
|
if (!existing?.access_token) return { ok: false, reason: "no_access_token" };
|
|
|
|
const exp = jwtExpSeconds(existing.access_token);
|
|
const skew = 60; // seconds
|
|
const isExpiredOrSoon = !exp || exp <= (nowSec() + skew);
|
|
|
|
// 1) refresh si nécessaire
|
|
if (isExpiredOrSoon) {
|
|
if (!existing.refresh_token) return { ok: false, reason: "expired_no_refresh" };
|
|
|
|
const rr = await refreshTokens(existing.refresh_token);
|
|
if (!rr.ok || !rr.json?.access_token) {
|
|
return { ok: false, reason: `refresh_failed_${rr.status}` };
|
|
}
|
|
|
|
const merged = {
|
|
...existing,
|
|
...rr.json,
|
|
};
|
|
|
|
// certains serveurs renvoient pas refresh_token à chaque fois
|
|
if (!merged.refresh_token) merged.refresh_token = existing.refresh_token;
|
|
|
|
setAuthFromTokens(merged);
|
|
existing = merged;
|
|
} else {
|
|
// access token encore bon
|
|
setAuthFromTokens(existing);
|
|
}
|
|
|
|
// 2) confirmer avec backend (whoami)
|
|
const w = await whoami(existing.access_token);
|
|
if (w.ok && w.json?.authenticated) {
|
|
const uname = w.json.username || guessUsernameFromToken(existing.access_token) || "";
|
|
setUser(uname ? { username: uname } : null);
|
|
setStatus("auth");
|
|
setError("");
|
|
return { ok: true };
|
|
}
|
|
|
|
// Si whoami fail, on considère désync (token invalide pour backend)
|
|
return { ok: false, reason: `whoami_${w.status}` };
|
|
}
|
|
|
|
function scheduleAutoRefresh(t) {
|
|
if (refreshTimer.current) {
|
|
clearInterval(refreshTimer.current);
|
|
refreshTimer.current = null;
|
|
}
|
|
// check aux 30s, refresh quand exp < 90s
|
|
refreshTimer.current = setInterval(async () => {
|
|
const cur = loadAuth();
|
|
if (!cur?.access_token) return;
|
|
|
|
const exp = jwtExpSeconds(cur.access_token);
|
|
if (!exp) return;
|
|
|
|
if (exp <= nowSec() + 90) {
|
|
if (!cur.refresh_token) {
|
|
setAnon("Session expirée (pas de refresh_token).");
|
|
return;
|
|
}
|
|
const rr = await refreshTokens(cur.refresh_token);
|
|
if (!rr.ok || !rr.json?.access_token) {
|
|
setAnon("Session expirée. Please login again.");
|
|
return;
|
|
}
|
|
const merged = { ...cur, ...rr.json };
|
|
if (!merged.refresh_token) merged.refresh_token = cur.refresh_token;
|
|
setAuthFromTokens(merged);
|
|
}
|
|
}, 30000);
|
|
}
|
|
|
|
async function restore() {
|
|
setStatus("loading");
|
|
setError("");
|
|
const saved = loadAuth();
|
|
if (!saved?.access_token) {
|
|
setAnon("");
|
|
return;
|
|
}
|
|
|
|
const r = await ensureFreshSession(saved);
|
|
if (!r.ok) {
|
|
setAnon("Login desynced. Please login again.");
|
|
return;
|
|
}
|
|
|
|
scheduleAutoRefresh(saved);
|
|
}
|
|
|
|
async function login(username, password) {
|
|
setError("");
|
|
setStatus("loading");
|
|
|
|
const res = await apiFetch("/api/login", {
|
|
method: "POST",
|
|
body: JSON.stringify({ username, password }),
|
|
});
|
|
|
|
const j = await res.json().catch(() => null);
|
|
if (!res.ok || !j?.access_token) {
|
|
setAnon(j?.error_description || j?.error || "Login failed");
|
|
return { ok: false, status: res.status, json: j };
|
|
}
|
|
|
|
const t = {
|
|
...j,
|
|
obtained_at: Date.now(),
|
|
};
|
|
|
|
setAuthFromTokens(t);
|
|
scheduleAutoRefresh(t);
|
|
|
|
// confirm whoami (si ça fail -> desync)
|
|
const w = await whoami(t.access_token);
|
|
if (!w.ok || !w.json?.authenticated) {
|
|
setAnon("Login desynced. Please login again.");
|
|
return { ok: false, status: w.status, json: w.json };
|
|
}
|
|
|
|
const uname = w.json.username || guessUsernameFromToken(t.access_token) || "";
|
|
setUser(uname ? { username: uname } : null);
|
|
setStatus("auth");
|
|
return { ok: true };
|
|
}
|
|
|
|
function logout() {
|
|
if (refreshTimer.current) clearInterval(refreshTimer.current);
|
|
refreshTimer.current = null;
|
|
setAnon("");
|
|
}
|
|
|
|
useEffect(() => {
|
|
restore();
|
|
|
|
const onStorage = (e) => {
|
|
if (e.key === "sociowire:auth") restore();
|
|
};
|
|
window.addEventListener("storage", onStorage);
|
|
return () => window.removeEventListener("storage", onStorage);
|
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
}, []);
|
|
|
|
useEffect(() => {
|
|
if (status === "auth" && tokens?.access_token) {
|
|
scheduleAutoRefresh(tokens);
|
|
}
|
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
}, [status]);
|
|
|
|
const value = useMemo(() => {
|
|
return {
|
|
status,
|
|
user,
|
|
tokens,
|
|
error,
|
|
|
|
isAuthed: status === "auth",
|
|
accessToken: tokens?.access_token || "",
|
|
|
|
login,
|
|
logout,
|
|
restore,
|
|
setError,
|
|
};
|
|
}, [status, user, tokens, error]);
|
|
|
|
return <AuthCtx.Provider value={value}>{children}</AuthCtx.Provider>;
|
|
}
|
|
|
|
export function useAuth() {
|
|
return useContext(AuthCtx);
|
|
}
|