Merge pull request #8284 from systeminit/secure-bearer-tokens

feat(auth-api): Implement secure bearer tokens behind feature flag

Author: stack72

app/web/src/newhotness/logic_composables/tokens.ts

@@ -4,12 +4,23 @@ import jwtDecode from "jwt-decode";
 
 // token logic pulled from authstore
 
-type TokenData = {
+// V1 token format (legacy)
+type TokenDataV1 = {
   user_pk: string;
   workspace_pk: string;
-  // isImpersonating?: boolean;
 };
 
+// V2 token format (new secure tokens)
+type TokenDataV2 = {
+  version: "2";
+  userId: string;
+  workspaceId: string;
+  role: string;
+  jti: string;
+};
+
+type TokenData = TokenDataV1 | TokenDataV2;
+
 const AUTH_LOCAL_STORAGE_KEYS = {
   USER_TOKENS: "si-auth",
 };
@@ -29,8 +40,16 @@ export const readTokens = () => {
 };
 
 export const getUserPkFromToken = (token: string): string => {
-  const { user_pk: userPk } = jwtDecode<TokenData>(token);
-  return userPk;
+  const decoded = jwtDecode<TokenData>(token);
+
+  // Check if V2 token format
+  if ("version" in decoded && decoded.version === "2") {
+    return decoded.userId;
+  }
+
+  // V1 token format
+  const v1Token = decoded as TokenDataV1;
+  return v1Token.user_pk;
 };
 
 readTokens();

app/web/src/router.ts

@@ -272,9 +272,9 @@ const routes: RouteRecordRaw[] = [
   {
     path: "/logout",
     name: "logout",
-    beforeEnter: () => {
+    beforeEnter: async () => {
       const authStore = useAuthStore();
-      authStore.localLogout();
+      await authStore.logout();
     },
     component: () => import("@/pages/auth/LogoutPage.vue"), // just need something here for TS, but guard always redirects
   },

app/web/src/store/apis.web.ts

@@ -5,6 +5,7 @@ import Axios, {
   InternalAxiosRequestConfig,
 } from "axios";
 import { useToast } from "vue-toastification";
+import { trackEvent } from "@/utils/tracking";
 import { useAuthStore } from "@/store/auth.store";
 import { useChangeSetsStore } from "@/store/change_sets.store";
 import FiveHundredError from "@/components/toasts/FiveHundredError.vue";
@@ -13,9 +14,9 @@ import UnscheduledDowntime from "@/components/toasts/UnscheduledDowntime.vue";
 
 // api base url - can use a proxy or set a full url
 let apiUrl: string;
-if (import.meta.env.VITE_API_PROXY_PATH)
+if (import.meta.env.VITE_API_PROXY_PATH) {
   apiUrl = `${window.location.origin}${import.meta.env.VITE_API_PROXY_PATH}`;
-else throw new Error("Invalid API env var config");
+} else throw new Error("Invalid API env var config");
 export const API_HTTP_URL = apiUrl;
 
 // set up websocket url, by replacing protocol and appending /ws
@@ -129,11 +130,39 @@ async function handleOutageModes(error: AxiosError) {
   return Promise.reject(error);
 }
 
+async function handle401(error: AxiosError) {
+  if (error?.response?.status === 401) {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    const errorKind = (error?.response?.data as any)?.kind;
+    if (
+      errorKind === "AuthTokenRevoked" ||
+      errorKind === "AuthTokenInvalid" ||
+      errorKind === "AuthTokenCorrupt"
+    ) {
+      const authStore = useAuthStore();
+
+      // Track automatic logout event
+      if (authStore.user) {
+        trackEvent("automatic_logout_forced", {
+          reason: errorKind,
+          requestUrl: error?.config?.url,
+          userEmail: authStore.user.email,
+          logoutTriggeredAt: new Date().toISOString(),
+        });
+      }
+
+      authStore.localLogout(true);
+    }
+  }
+  return Promise.reject(error);
+}
+
 sdfApiInstance.interceptors.response.use(handleProxyTimeouts, handle500);
 sdfApiInstance.interceptors.response.use(
   handleForcedChangesetRedirection,
   handleOutageModes,
 );
+sdfApiInstance.interceptors.response.use((r) => r, handle401);
 
 export const authApiInstance = Axios.create({
   headers: {
@@ -143,6 +172,7 @@ export const authApiInstance = Axios.create({
   withCredentials: true, // needed to attach the cookie
 });
 authApiInstance.interceptors.request.use(injectBearerTokenAuth);
+authApiInstance.interceptors.response.use((r) => r, handle401);
 
 export const moduleIndexApiInstance = Axios.create({
   headers: {

app/web/src/store/auth.store.ts

@@ -19,12 +19,23 @@ const AUTH_LOCAL_STORAGE_KEYS = {
   USER_TOKENS: "si-auth",
 };
 
-type TokenData = {
+// V1 token format (legacy)
+type TokenDataV1 = {
   user_pk: string;
   workspace_pk: string;
-  // isImpersonating?: boolean;
 };
 
+// V2 token format (new secure tokens)
+type TokenDataV2 = {
+  version: "2";
+  userId: string;
+  workspaceId: string;
+  role: string;
+  jti: string;
+};
+
+type TokenData = TokenDataV1 | TokenDataV2;
+
 interface LoginResponse {
   user: User;
   workspace: Workspace;
@@ -38,6 +49,27 @@ export interface WorkspaceUser {
   email: string;
 }
 
+// Helper function to normalize token data from V1 or V2 format
+function normalizeTokenData(token: TokenData): {
+  userPk: string;
+  workspacePk: string;
+} {
+  if ("version" in token && token.version === "2") {
+    // V2 token format
+    return {
+      userPk: token.userId,
+      workspacePk: token.workspaceId,
+    };
+  }
+
+  // V1 token format (explicit cast since TypeScript doesn't narrow automatically)
+  const v1Token = token as TokenDataV1;
+  return {
+    userPk: v1Token.user_pk,
+    workspacePk: v1Token.workspace_pk,
+  };
+}
+
 export const useAuthStore = () => {
   const WORKSPACE_API_PREFIX = ["v2", "workspaces"];
 
@@ -213,10 +245,11 @@ export const useAuthStore = () => {
         const tokens = _.values(tokensByWorkspacePk);
         if (!tokens.length) return [];
 
-        // token contains user pk and biling account pk
-        const { user_pk: userPk } =
-          // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-          jwtDecode<TokenData>(tokens[0]!);
+        // token contains user pk and workspace pk (normalize V1/V2 format)
+        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+        const decodedToken = jwtDecode<TokenData>(tokens[0]!);
+        const { userPk } = normalizeTokenData(decodedToken);
+
         this.$patch({
           tokens: tokensByWorkspacePk,
           userPk,
@@ -265,6 +298,29 @@ export const useAuthStore = () => {
           }
         }
       },
+      async logout() {
+        // Call backend to revoke token
+        // Use fetch directly with the workspace token from localStorage
+        try {
+          const workspaceToken = this.selectedWorkspaceToken;
+          if (workspaceToken) {
+            const AUTH_API_URL = import.meta.env.VITE_AUTH_API_URL;
+            await fetch(`${AUTH_API_URL}/session/logout`, {
+              method: "POST",
+              headers: {
+                Authorization: `Bearer ${workspaceToken}`,
+                "Content-Type": "application/json",
+              },
+            });
+          }
+        } catch (error) {
+          // Silently fail - logout will still clear local state
+        }
+
+        // Clear local state and redirect
+        this.localLogout(true);
+      },
+
       localLogout(redirectToAuthPortal = true) {
         storage.removeItem(AUTH_LOCAL_STORAGE_KEYS.USER_TOKENS);
         this.$patch({
@@ -281,11 +337,13 @@ export const useAuthStore = () => {
       // split out so we can reuse for different login methods (password, oauth, magic link, signup, etc)
       finishUserLogin(loginResponse: LoginResponse) {
         const decodedJwt = jwtDecode<TokenData>(loginResponse.token);
+        const { userPk, workspacePk } = normalizeTokenData(decodedJwt);
+
         this.$patch({
-          userPk: decodedJwt.user_pk,
+          userPk,
           tokens: {
             ...this.tokens,
-            [decodedJwt.workspace_pk]: loginResponse.token,
+            [workspacePk]: loginResponse.token,
           },
           user: loginResponse.user,
           userWorkspaceFlags: loginResponse.userWorkspaceFlags,