Fix logout on page refresh by restoring sessions via refresh token and cookies.

app/admin/templates/admin.html

@@ -881,7 +881,9 @@ document.getElementById('login-btn').onclick = async () => {
 
 ['email', 'password'].forEach(id => document.getElementById(id).addEventListener('keydown', e => { if (e.key === 'Enter') document.getElementById('login-btn').click(); }));
 
-document.getElementById('logout-btn').onclick = () => { auth.clearSession(); location.reload(); };
+document.getElementById('logout-btn').onclick = function () {
+  auth.logout().finally(function () { location.reload(); });
+};
 
 function showDashboard() {
   document.getElementById('auth-screen').style.display = 'none';

app/api/schemas_router.py

@@ -31,17 +31,20 @@ def _set_refresh_cookie(response: Response, refresh_token: str) -> None:
         secure=_cookie_secure(),
         samesite="lax",
         max_age=7 * 24 * 60 * 60,
+        path="/",
     )
 
 
 @router.post("/auth/register", response_model=TokenResponse, status_code=201, tags=["Auth"])
-async def register(payload: RegisterRequest, db: AsyncSession = Depends(get_db)):
+async def register(payload: RegisterRequest, response: Response, db: AsyncSession = Depends(get_db)):
     """Register a new author account."""
-    return await AuthService(db).register(
+    result = await AuthService(db).register(
         email=payload.email,
         password=payload.password,
         full_name=payload.full_name,
     )
+    _set_refresh_cookie(response, result["refresh_token"])
+    return result
 
 
 @router.post("/auth/login", response_model=TokenResponse, tags=["Auth"])
@@ -75,7 +78,7 @@ async def refresh(request: Request, response: Response, db: AsyncSession = Depen
 @router.post("/auth/logout", status_code=204, tags=["Auth"])
 async def logout(response: Response, _=Depends(get_current_user)):
     """Invalidate refresh token cookie."""
-    response.delete_cookie("refresh_token")
+    response.delete_cookie("refresh_token", path="/")
 
 
 @router.get("/auth/me", response_model=UserResponse, tags=["Auth"])

app/superadmin/templates/superadmin.html

@@ -481,7 +481,9 @@ document.getElementById('sa-login-btn').onclick = async () => {
 };
 
 ['sa-user', 'sa-pass'].forEach(id => document.getElementById(id).addEventListener('keydown', e => { if (e.key === 'Enter') document.getElementById('sa-login-btn').click(); }));
-document.getElementById('sa-logout-btn').onclick = () => { auth.clearSession(); location.reload(); };
+document.getElementById('sa-logout-btn').onclick = function () {
+  auth.logout().finally(function () { location.reload(); });
+};
 
 function showDashboard() {
   document.getElementById('auth-screen').style.display = 'none';

static/auth-client.js

@@ -1,10 +1,32 @@
 /**
  * AuthorBot Auth Client — shared by admin + superadmin SPAs.
- * Stores access + refresh tokens, auto-refreshes on 401, survives tab idle.
+ * Stores access + refresh tokens in localStorage, httponly refresh cookie as backup.
+ * Auto-refreshes on load and on 401 — survives page refresh and tab idle.
  */
 (function (global) {
   'use strict';
 
+  var FETCH_OPTS = { credentials: 'include' };
+
+  function decodeJwtPayload(token) {
+    try {
+      var part = token.split('.')[1];
+      if (!part) return null;
+      var json = atob(part.replace(/-/g, '+').replace(/_/g, '/'));
+      return JSON.parse(json);
+    } catch (e) {
+      return null;
+    }
+  }
+
+  function isAccessTokenExpired(token, skewSeconds) {
+    skewSeconds = skewSeconds || 60;
+    if (!token) return true;
+    var payload = decodeJwtPayload(token);
+    if (!payload || !payload.exp) return true;
+    return (payload.exp - skewSeconds) <= Date.now() / 1000;
+  }
+
   function AuthClient(options) {
     this.apiBase = options.apiBase;
     this.accessKey = options.accessKey || 'access_token';
@@ -37,18 +59,22 @@
     if (this.slugKey) localStorage.removeItem(this.slugKey);
   };
 
+  AuthClient.prototype.hasSession = function () {
+    return !!(this.getAccessToken() || this.getRefreshToken());
+  };
+
   AuthClient.prototype.refreshAccessToken = function () {
     var self = this;
     if (this._refreshing) return this._refreshing;
 
     var refresh = this.getRefreshToken();
-    if (!refresh) return Promise.resolve(false);
+    var body = refresh ? JSON.stringify({ refresh_token: refresh }) : '{}';
 
-    this._refreshing = fetch(this.apiBase + '/auth/refresh', {
+    this._refreshing = fetch(this.apiBase + '/auth/refresh', Object.assign({}, FETCH_OPTS, {
       method: 'POST',
       headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({ refresh_token: refresh }),
-    })
+      body: body,
+    }))
       .then(function (res) {
         if (!res.ok) return false;
         return res.json();
@@ -64,55 +90,97 @@
     return this._refreshing;
   };
 
+  AuthClient.prototype.ensureValidAccessToken = function () {
+    var self = this;
+    var access = this.getAccessToken();
+    var refresh = this.getRefreshToken();
+
+    if (access && !isAccessTokenExpired(access)) {
+      return Promise.resolve(true);
+    }
+    if (!refresh) {
+      return Promise.resolve(false);
+    }
+    return this.refreshAccessToken();
+  };
+
   AuthClient.prototype.restoreSession = function (validateFn) {
     var self = this;
-    if (!this.getAccessToken()) return Promise.resolve(false);
 
-    return this.request('GET', '/auth/me')
-      .then(function (user) { return validateFn ? validateFn(user) : true; })
+    if (!this.hasSession()) {
+      return Promise.resolve(false);
+    }
+
+    function loadProfile() {
+      return self.get('/auth/me').then(function (user) {
+        if (self.slugKey && user && user.id) {
+          localStorage.setItem(self.slugKey, user.id);
+        }
+        if (validateFn && !validateFn(user)) {
+          return false;
+        }
+        return true;
+      });
+    }
+
+    return this.ensureValidAccessToken()
+      .then(function (ok) {
+        if (!ok) {
+          self.clearSession();
+          return false;
+        }
+        return loadProfile();
+      })
       .catch(function () {
-        return self.refreshAccessToken().then(function (ok) {
-          if (!ok) {
+        return self.refreshAccessToken().then(function (refreshed) {
+          if (!refreshed) {
             self.clearSession();
             return false;
           }
-          return self.request('GET', '/auth/me')
-            .then(function (user) { return validateFn ? validateFn(user) : true; })
-            .catch(function () {
-              self.clearSession();
-              return false;
-            });
+          return loadProfile();
         });
+      })
+      .catch(function () {
+        self.clearSession();
+        return false;
       });
   };
 
   AuthClient.prototype.request = function (method, path, body, retried) {
     var self = this;
-    var token = this.getAccessToken();
-    var headers = { Authorization: 'Bearer ' + token };
 
-    var opts = { method: method, headers: headers };
-    if (body !== undefined && body !== null) {
-      headers['Content-Type'] = 'application/json';
-      opts.body = JSON.stringify(body);
-    }
+    return this.ensureValidAccessToken().then(function (ok) {
+      if (!ok) {
+        self.clearSession();
+        throw new Error('Session expired — please sign in again');
+      }
 
-    return fetch(this.apiBase + path, opts)
-      .catch(function () {
-        throw new Error('Cannot reach server. Check your connection and try again.');
-      })
-      .then(function (res) {
-        if (res.status === 401 && !retried) {
-          return self.refreshAccessToken().then(function (ok) {
-            if (!ok) {
-              self.clearSession();
-              throw new Error('Session expired — please sign in again');
-            }
-            return self.request(method, path, body, true);
-          });
-        }
-        return res;
-      });
+      var token = self.getAccessToken();
+      var headers = { Authorization: 'Bearer ' + token };
+
+      var opts = Object.assign({}, FETCH_OPTS, { method: method, headers: headers });
+      if (body !== undefined && body !== null) {
+        headers['Content-Type'] = 'application/json';
+        opts.body = JSON.stringify(body);
+      }
+
+      return fetch(self.apiBase + path, opts)
+        .catch(function () {
+          throw new Error('Cannot reach server. Check your connection and try again.');
+        })
+        .then(function (res) {
+          if (res.status === 401 && !retried) {
+            return self.refreshAccessToken().then(function (refreshed) {
+              if (!refreshed) {
+                self.clearSession();
+                throw new Error('Session expired — please sign in again');
+              }
+              return self.request(method, path, body, true);
+            });
+          }
+          return res;
+        });
+    });
   };
 
   AuthClient.prototype._parse = function (res) {
@@ -146,57 +214,75 @@
 
   AuthClient.prototype.upload = function (path, formData, retried) {
     var self = this;
-    var token = this.getAccessToken();
-    return fetch(this.apiBase + path, {
-      method: 'POST',
-      headers: { Authorization: 'Bearer ' + token },
-      body: formData,
-    })
-      .catch(function () {
-        throw new Error('Cannot reach server. Check your connection and try again.');
-      })
-      .then(function (res) {
-        if (res.status === 401 && !retried) {
-          return self.refreshAccessToken().then(function (ok) {
-            if (!ok) {
-              self.clearSession();
-              throw new Error('Session expired — please sign in again');
-            }
-            return self.upload(path, formData, true);
-          });
-        }
-        return res;
-      });
+
+    return this.ensureValidAccessToken().then(function (ok) {
+      if (!ok) {
+        self.clearSession();
+        throw new Error('Session expired — please sign in again');
+      }
+
+      var token = self.getAccessToken();
+      return fetch(self.apiBase + path, Object.assign({}, FETCH_OPTS, {
+        method: 'POST',
+        headers: { Authorization: 'Bearer ' + token },
+        body: formData,
+      }))
+        .catch(function () {
+          throw new Error('Cannot reach server. Check your connection and try again.');
+        })
+        .then(function (res) {
+          if (res.status === 401 && !retried) {
+            return self.refreshAccessToken().then(function (refreshed) {
+              if (!refreshed) {
+                self.clearSession();
+                throw new Error('Session expired — please sign in again');
+              }
+              return self.upload(path, formData, true);
+            });
+          }
+          return res;
+        });
+    });
   };
 
   AuthClient.prototype.download = function (path, retried) {
     var self = this;
-    var token = this.getAccessToken();
-    return fetch(this.apiBase + path, { headers: { Authorization: 'Bearer ' + token } })
-      .catch(function () {
-        throw new Error('Cannot reach server. Check your connection and try again.');
-      })
-      .then(function (res) {
-        if (res.status === 401 && !retried) {
-          return self.refreshAccessToken().then(function (ok) {
-            if (!ok) {
-              self.clearSession();
-              throw new Error('Session expired — please sign in again');
-            }
-            return self.download(path, true);
-          });
-        }
-        return res;
-      });
+
+    return this.ensureValidAccessToken().then(function (ok) {
+      if (!ok) {
+        self.clearSession();
+        throw new Error('Session expired — please sign in again');
+      }
+
+      var token = self.getAccessToken();
+      return fetch(self.apiBase + path, Object.assign({}, FETCH_OPTS, {
+        headers: { Authorization: 'Bearer ' + token },
+      }))
+        .catch(function () {
+          throw new Error('Cannot reach server. Check your connection and try again.');
+        })
+        .then(function (res) {
+          if (res.status === 401 && !retried) {
+            return self.refreshAccessToken().then(function (refreshed) {
+              if (!refreshed) {
+                self.clearSession();
+                throw new Error('Session expired — please sign in again');
+              }
+              return self.download(path, true);
+            });
+          }
+          return res;
+        });
+    });
   };
 
   AuthClient.prototype.login = function (email, password) {
     var self = this;
-    return fetch(this.apiBase + '/auth/login', {
+    return fetch(this.apiBase + '/auth/login', Object.assign({}, FETCH_OPTS, {
       method: 'POST',
       headers: { 'Content-Type': 'application/json' },
       body: JSON.stringify({ email: email, password: password }),
-    })
+    }))
       .then(function (res) { return res.json().then(function (data) { return { res: res, data: data }; }); })
       .then(function (_ref) {
         var res = _ref.res, data = _ref.data;
@@ -210,5 +296,12 @@
       });
   };
 
+  AuthClient.prototype.logout = function () {
+    var self = this;
+    return this.post('/auth/logout').catch(function () {}).finally(function () {
+      self.clearSession();
+    });
+  };
+
   global.AuthorBotAuthClient = AuthClient;
 })(window);